现代UI自定义AppBar按钮

rin*_*t.6 3 appbar windows-8 windows-runtime winjs windows-store-apps

我正在开发我的第一个Windows 8现代应用程序,我似乎很难找到正确的文档来制作不像默认应用程序栏按钮.

我正在尝试做的事情就像Microsoft Solitaire Collection中的应用程序栏,如下所示:http://www.windows8core.com/wp-content/uploads/2012/08/2b1.png

有三件事需要注意:

  1. 自定义图标(熊,在第一个)
  2. 它不像图标下方带有文本的默认按钮
  3. 它是矩形的,宽度与填充和全屏横向模式下应用程序的宽度成正比.(在固定模式下,按钮会消失,但对于我的应用程序,如果可能,我会在固定模式下使用"仅图标").

我已经使用开始时<button>,因为语义上它们是按钮,并且似乎只有<button><hr>在应用栏的归属.

我是在data-win-options属性中设置参数还是在JavaScript中完成的?

我使用的是JavaScript/HTML5,而不是C++/C#/ VB.以下是我读过的有关应用栏的MSDN文章.

dev*_*mer 5

如果这是一个通常用于导航的上层AppBar,您实际上可以通过在data-win-options中指定"layout"属性来提供自定义UI,其值为"custom",如此处所述.

您可能还想阅读样式应用栏.

最后,但并非最不重要的是,查看HTML AppBar控件示例,其中说明了自定义布局的使用等.

有关Windows应用商店应用开发的更多信息,请注册Generation App.