AppBar.layout property
Gets or sets the layout of the app bar contents.
Syntax
var layout = appBar.layout;
appBar.layout = layout;
Property value
Type: String
One of the following values:
Value | Condition |
---|---|
"commands" | The content of the app bar is laid out using AppBarCommand.section. A layout property set to "commands" can include two sections: "global" and "selection". Note For Windows Store apps: "global" maps to right and "selection" maps to left in LTR (left-to-right) layouts. The opposite is true in RTL (right-to-left) layouts. "global" is intended for commands that should be displayed at all times. "selection" is intended for context commands for selected objects. Note For Windows Phone Store apps: "global" is for primary commands that are always visible in the app bar. Only the first four commands declared as "global" are displayed. "selection" is for non-primary (or secondary) commands. These are text-based menu items that appear when a primary command is invoked. All commands declared as "selection" are displayed (based on display resolution). |
"custom" | The app is responsible for its own custom layout. An AppBar control with a layout property set to "custom" can contain any HTML. However, an app bar with a "custom" layout doesn’t have the full functionality available to an app bar using the "commands" layout. |
"menu" | The content of the app bar is laid into primary and secondary sections. This is the default value. Commands in the primary section are displayed whenever possible; commands in the secondary section are hidden initially and displayed in an overflow area. To specify the section for a command, set its section property to "primary" or "secondary". |
Requirements
Minimum supported client |
Windows 8 [Windows Store apps only] |
Minimum supported server |
Windows Server 2012 [Windows Store apps only] |
Minimum supported phone |
None supported |
Namespace |
WinJS.UI |
Library |
Winjs.js |
See also
Your first app - Part 3: PageControl objects and navigation
Navigating between pages (HTML)
Navigation and navigation history sample
Designers
Bottom app bar
Top app bar