显示命令'带有“更多”按钮的AppBar中的标签

时间:2015-10-10 11:48:30

标签: javascript html winjs uwp

所以我在WinJS UWP应用中获得了一个AppBar

<div data-win-control="WinJS.UI.AppBar" id="appBar" data-win-options="{ closedDisplayMode : 'compact', placement:'bottom'}">
    <button data-win-control="WinJS.UI.AppBarCommand"
            data-win-options="{id:'flyoutButton',
        type:'flyout',
        label:'Třída',
        icon:'otheruser',
        flyout:select('#classFlyout')}"></button>
    <button data-win-control="WinJS.UI.AppBarCommand"
            data-win-options="{id:'flyoutButton',
        type:'flyout',
        label:'Schovávání hodin',
        icon:'calendarday',
        flyout:select('#hidingFlyout')}"></button>
    <button data-win-control="WinJS.UI.AppBarCommand" data-win-options="{id:'moreButton',label:'More',icon:'more',section:'primary',tooltip:'Show more'}"></button>
</div>

它有两个弹出按钮和一个按钮。当我点击按钮时,我想要其他命令&#39;标签可见 - 如Win10天气应用程序。

我已经尝试创建一个功能,可以将appbar的closedDisplayMode更改为“#full”。

WinJS.UI.processAll().done(function () {
    appBar = document.getElementById("appBar");
});

function addListeners() {
    document.getElementById("moreButton").addEventListener("click", openCloseAppbar, false);
}

function openCloseAppbar() {
    appBar.closedDisplayMode = 'full';
}
然而,这并不起作用。还有其他方法通常会让我失踪吗? (因为某些原因,我无法找到任何文件。)或者我只是做错了??

1 个答案:

答案 0 :(得分:2)

这样做的正确方法显然是:

appBar.winControl.closedDisplayMode = "full";

(强调 .winControl 。)