Добавить AppBarCommand в AppBar в WinJS

Мне нужно добавить AppBarCommand в программу AppBar. Это использовалось для работы с Windows 8.1, но оно не работает в Windows 10. Я не получаю ошибок, но когда я выполняю приведенный ниже код, моя панель приложений пуста. Кто-нибудь знает, возможно ли добавить AppBarCommand s в AppBar из WinJS? Если да, то как это можно сделать? Благодарю.Добавить AppBarCommand в AppBar в WinJS

Хотя моя проблема возникала в более крупном приложении, я воспроизвел проблему из шаблона «Пустой» WinJS.

default.js:

(function() { 
    "use strict"; 

    var app = WinJS.Application; 
    var activation = Windows.ApplicationModel.Activation; 

    app.onactivated = function (args) { 
     if (args.detail.kind === activation.ActivationKind.launch) { 
      if (args.detail.previousExecutionState !== activation.ApplicationExecutionState.terminated) { 
       var appBarDiv = document.createElement("div"); 
       document.body.appendChild(appBarDiv); 
       var appBar = new WinJS.UI.AppBar(appBarDiv, {}); 
       var command = new WinJS.UI.AppBarCommand(null, { id: "commandID", type:"button", label: "Label", section: "secondary" }); 
       appBar.commands = [command]; 
      } 
      args.setPromise(WinJS.UI.processAll()); 
     } 
    }; 
    app.start(); 
})();

default.html:

<!DOCTYPE html> 
<html> 
<head> 
    <meta charset="utf-8" /> 
    <title>App1</title> 

    <!-- WinJS references --> 
    <link href="WinJS/css/ui-dark.css" rel="stylesheet" /> 
    <script src="WinJS/js/base.js"></script> 
    <script src="WinJS/js/ui.js"></script> 

    <!-- App1 references --> 
    <link href="/css/default.css" rel="stylesheet" /> 
    <script src="/js/default.js"></script> 
</head> 
<body class="win-type-body"> 
    <p>Content goes here</p> 
</body> 
</html>

источник

2015-08-01 user1325179

смогли решить эту проблему, были вы? – TheTanic

@ TheTanic, no. Мне пришлось отказаться от программных дополнений и абстракций. Надеюсь, они когда-нибудь это исправит. – user1325179

Вы пытались использовать свойство данных вместо команд? [Из Appbar] Это работает для меня – TheTanic

В качестве временного решения вы можете создать все кнопки в начале, но затем сделать их скрытые или видны динамически.

источник

2015-08-24 10:02:21

я понял, что это, с помощью data свойство WinJS.UI.AppBar:

Сначала вам нужна переменная для Binding списка:

var commandList;

Создать AppBar:

function createBar() { 
    var appBarDiv = document.createElement("div"); 
    var appBar = new WinJS.UI.AppBar(appBarDiv, {}); 
    commandList = new WinJS.Binding.List([]); 
    appBar.data = commandList; 
    document.body.appendChild(appBarDiv); 
}

Функция для создания команд:

function createCommand(id, label, tooltip, icon, section) {  
    var btn = document.createElement("button"); 
    var command = new WinJS.UI.AppBarCommand(btn, { 
     id: id, 
     label: label, 
     tooltip: tooltip, 
     icon: icon, 
     section: section, 
     type: "button" 
    }); 
    return command; 
}

Функция для добавления команд в AppBar:

function addCommand(id, label, tooltip, icon, section) { 
    commandList.push(createCommand(id, label, tooltip, icon, section)); 
}

Это работает для меня. Конечно, вы можете уже добавлять команды в функции creatBar().

EDIT:
Вот полный пример, который создает 10 команд и добавить их в Allready созданный AppBar:

HTML

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
    <meta charset="utf-8" /> 
 
    <title>TestApp</title> 
 

 
    <link href="lib/winjs-4.0.1/css/ui-light.css" rel="stylesheet" /> 
 
    <script src="lib/winjs-4.0.1/js/base.js"></script> 
 
    <script src="lib/winjs-4.0.1/js/ui.js"></script> 
 

 
    <link href="css/default.css" rel="stylesheet" /> 
 
    <script src="js/main.js"></script> 
 
</head> 
 
<body class="win-type-body"> 
 
</body> 
 
</html>

// For an introduction to the Blank template, see the following documentation: 
 
// http://go.microsoft.com/fwlink/?LinkId=232509 
 

 
(function() { 
 
    "use strict"; 
 

 
    var app = WinJS.Application; 
 
    var activation = Windows.ApplicationModel.Activation; 
 
    var isFirstActivation = true; 
 
    var commandList; 
 

 
    app.onactivated = function (args) { 
 

 
     if (isFirstActivation) { 
 

 
      args.setPromise(WinJS.UI.processAll()); 
 
     } 
 

 
     isFirstActivation = false; 
 
    }; 
 

 
    WinJS.UI.processAll().then(function() { 
 

 
     createBar(); 
 
     for (var i = 0; i < 10; i++) { 
 
      addCommand("test" + i, "test" + i, "test" + i, "street", "primary"); 
 
     } 
 
    }); 
 

 
    function createBar() { 
 
     var appBarDiv = document.createElement("div"); 
 
     var appBar = new WinJS.UI.AppBar(appBarDiv, {}); 
 
     commandList = new WinJS.Binding.List([]); 
 
     appBar.data = commandList; 
 
     document.body.appendChild(appBarDiv); 
 
    } 
 

 
    function createCommand(id, label, tooltip, icon, section) { 
 
     var btn = document.createElement("button"); 
 
     var command = new WinJS.UI.AppBarCommand(btn, { 
 
      id: id, 
 
      label: label, 
 
      tooltip: tooltip, 
 
      icon: icon, 
 
      section: section, 
 
      type: "button" 
 
     }); 
 
     return command; 
 
    } 
 

 
    function addCommand(id, label, tooltip, icon, section) { 
 
     commandList.push(createCommand(id, label, tooltip, icon, section)); 
 
    } 
 

 

 
    app.start(); 
 

 
})();

источник

2016-11-28 07:37:43 TheTanic

Добавить AppBarCommand в AppBar в WinJS

ответ

Смежные вопросы