MICROSOFT_PRESS_EBOOK_PROGRAMMING_WINDOWS_8_APPS_WITH_HTML_CSS_AND_JAVASCRIPT_PDF

FIGURE 8-5 The settings flyout from Scenario 5 of the App settings sample, showing how a flyout supports vertical
scrolling; note the scrollbar positions for the top portion (left) and the bottom portion (right).
A call to showSettings is thus exactly what you use within any particular command’s invoked handler
and is what WinJS sets up within populateCommands. But it also means you can call showSettings from
anywhere else in your code when you want to display a particular settings pane. For example, if you
encounter an error condition in the app that could be rectified by changing an app setting, you can
provide a button in the message dialog of notification flyout that calls showSettings to open that
particular pane. And for what it’s worth, the hide method of that flyout will dismiss it; it doesn’t affect
the top-level settings pane for which you must use
Windows.UI.Application-Settings.SettingsPane.getForCurrentView.hide.
You might use showSettings and hide together, in fact, if you need to navigate to a third-level
settings pane. That is, one of your own settings flyouts could contain a command that calls hide on the
current flyout and then calls showSettings to invoke another. The back button of that subsidiary flyout
(and it should always have a back button) would similarly call hide on the current flyout and
showSettings to make its second-level parent reappear. That said, we don’t recommend making your
settings so complex that third-level flyouts are necessary, but the capability is there if you have a
particular scenario that demands it.
Knowing how showSettings tries to find a flyout is also helpful if you want to create a WinJS.-
UI.SettingsFlyout programmatically. So long as such a control is in the DOM when you call
showSettings with its id, WinJS will be able to find it and display it like any other. It would also work,
though I haven’t tried this and it’s not in the sample, to use a kind of hybrid approach. Because
showSettings loads the HTML page you specify as a page control with WinJS.UI.Pages.load, that page
can also include its own script wherein you define a page control object with methods like processed
and ready. Within those methods you could then make specific customizations to the settings flyout
defined in the markup.
342