Configuration contract for Windows 8 Development

Contract: A contract is like a protocol between one or more programs. A contract defines some conventions that an application must follow when it interacts with other programs or windows. Some settings of an application can be put on the AppBar. If not, for example, the subject color of the application, you can set the contract, that is, the setting panel is called through the super menu. The following describes how to add the settings panel to our settings options.

1. Introduce the namespace: Windows. UI. applicationsettings;
2. register the setting event

When the program starts, a method named onlaunched in the app. XAML. CS file will be called. At the beginning of onlaunched, I created an event handler, which is called when the user opens settingspane. The custom setting screen will not be loaded until the user opens the settings charm. When you pause your program or game, if the set panel is opened, this event will also be called.

Protected override void onlaunched (launchactivatedeventargs ARGs) {settingspane. getforcurrentview (). commandsrequested + = app_commandsrequested; // register and set the event frame rootframe = Window. current. content as frame; // do not repeat application initialization when the window contains content. // make sure that the window is active if (rootframe = NULL) {// create a framework to act as the navigation context, and navigate to the first page rootframe = new frame (); If (ARGs. previusexecutionstate = applicationexecutionstate. terminated) {// Todd O: loading status from the previously suspended application} // put the framework in the current window. current. content = rootframe;} If (rootframe. content = NULL) {// when the navigation stack is not restored, navigate to the first page, // and configure the IF (! Rootframe. navigate (typeof (mainpage), argS. arguments) {Throw new exception ("failed to create initial page") ;}// make sure that the current window is in the active state window. current. activate ();}

Void app_commandsrequested (settingspane sender, incluargs) {settingscommand cmd = new settingscommand ("about", "about applications", (handle) =>{ popup = createpopup. create (New aboutpage (), 346); Popup. isopen = true ;}); settingscommand cmd1 = new settingscommand ("topic", "topic color", (handle) =>{ popup = createpopup. create (New themcolor (), 346); Popup. isopen = true;}); args. request. applicationcommands. add (CMD); args. request. applicationcommands. add (cmd1 );}

As shown in the code above, I created a settingscommand object and provided three values. Unless you need to modify settingspane while the program is running, the first parameter value is not very important. It is a simple ID, which can then be referenced to settingscommand. The "theme color" of the tag can be any string, but it is recommended that it be no more than 40 characters, otherwise it will be truncated. The last parameter value is the handler of the command. When you tap lable, the handler is executed. Here, I use the lambada expression to simplify the processing. In the expression, I created a popup control and set its isopen attribute to true. This attribute can be changed so that popup is displayed on the screen.

3. Create a popup Control
The first step is a custom usercontrol. Then I will introduce this usercontrol. Now you only need to understand that aboutpage. XAML is a usercontrol, and aboutpage. XAML is used in the popup control.

Public class createpopup {public static popup create (usercontrol element, double width) {popup P = new popup (); p. child = element; p. islightdismissenabled = true; p. childtransitions = new transitioncollection (); p. childtransitions. add (New panethemetransition () // declare the edge conversion position of the edge UI (such as the application bar. {Edge = (settingspane. Edge = settingsedgelocation. Right )? Edgetransitionlocation. Right: edgetransitionlocation. Left}); // check the edge of settingspane. In some countries, the supermenu is on the left. Element. width = width; element. Height = Window. Current. bounds. height; p. setvalue (canvas. leftproperty, settingspane. Edge = settingsedgelocation. Right? (Window. Current. bounds. Width-width): 0); // set the margin P. setvalue (canvas. topproperty, 0); Return P ;}}

The height and width of usercontrol are defined above, and element is assigned to the popup control P. (The recommended width is 346 or 646, and the height should be the full height of the user screen. For details, refer to: Design Guide ). Finally, set the left and top attributes of popup, so that popup will appear in the appropriate position, and then return P to settingscommand.
Note: Windows 8 may vary depending on the machine's Localization settings. If the language in some countries is read from the right to the left, the actual location of the charms bar is on the left of the screen, not on the right.
Edge. This is why when I assign a value to the leftproperty of popup, I check the "edge" of settingspane ".

4. Create usercontrol
Add a new usercontrol item to the project. To match the previous code, I named it aboutpage. XAML. The content of the Code in this file is entirely dependent on you. There are no official document constraints. In usercontrol, you can access the control on the mainpage by defining a common field public static mainpage current in mainpage to modify the properties of the control on the page.

 

Click settingpanel.zip to download the source code.