bobpxp 发表于 2015-5-21 12:40:57

Win8:WinJS.UI.AppBar 工具栏

  创建工具栏不是十分简单,直接用winjs的控件appbar就行。直接看官方代码:
  在HTML中:



   










  要添加相应时间,直接在js的WinJS.UI.processAll 加载之后添加即可:



document.getElementById("cmdAdd").addEventListener("click", doClickAdd, false);

function doClickAdd() {
WinJS.log && WinJS.log("Add button pressed", "sample", "status");
}
  如果你在default.html 中添加了上面AppBar 那工具栏就会在所有pages中有效,当然你也可以在特定页中使用不同的AppBar。
  看下效果图:

  看看 WinJS.UI.AppBar 的data-win-options 属性:
  disabled: default is false. true 的话就创建一个不可用的appbar。
  layout:can be "commands" (the default) or "custom"
  placement can be either "top" or "bottom" (the default).
  sticky: default is false. true 的话貌似只有右击能取消掉bar。
  再看WinJS.UI.AppBarCommand 的属性及options:
  id:标识, which you can use with document.getElementById or the app bar’s getCommandById method to wire up click handlers.
  type:One of "button" (the default), "separator" (which creates a vertical bar分界线), "flyout" (which triggers a popup specified with the flyout property; “Command Menus”), and "toggle" (which creates a button with on/off states)。
  label: command 的字,如上面的add。
  tooltip: 当鼠标移在command上时的提示信息。
  icon:图标;
  section: 位置。selection 在左边,global在右边(LTR)。
页: [1]
查看完整版本: Win8:WinJS.UI.AppBar 工具栏