Many of us need to integrate settings page in our applications. All we generally do is by creating a separate page in our project. But Windows 8 provide us a separate settings panel in Charm bar which you can use for your settings page.

 

In this post we will learn more about it from scratch and integrate it to our demo application. Also, we will learn how to invoke the charm bar to show the settings panel.

 

 

Charm bar is the floated vertical bar attached at the right side of the screen, consists of Search, Share, Start, Devices and Settings button to invoke appropriate commands. You can bring the charm bar by moving your mouse pointer at the top right corner of the screen. Here’s the screenshot of the charm bar (rotated 90 degree in left direction to accumulate in this post):

 

Charm Bar in Windows 8

 

Clicking the settings button there in the charm bar, brings the settings panel in the screen where you can show application specific settings/configurations.

 

To integrate your settings panel in your application, you need to add application specific commands in the settings panel. To do this, you need to register the “CommandsRequested” event in your page. You can chose between application level or page level settings panel.

 

Write the following code to register the event first:

 
SettingsPane.GetForCurrentView().CommandsRequested += OnSettingsPaneCommandRequested;

 

 

Then you need to add the specific commands one by one in the settings panel from the commands requested event implementation. Add settings command to the pane by following the below code snippet:

 
private void OnSettingsPaneCommandRequested(SettingsPane sender,
                                            SettingsPaneCommandsRequestedEventArgs args)
{
    // Add the commands one by one to the settings panel
    args.Request.ApplicationCommands.Add(new SettingsCommand("commandID", 
                                                             "Command Name", DoOperation));
}
 
private void DoOperation(IUICommand command)
{
    // Write the logic here that you want to do, when the user clicks it
 
}

 

 

Once you integrate this in your page, you will see something similar to this in your settings pane as shown in the below screenshot:

 

 

In case you want to invoke the settings pane to show by a button click, you can write the below code in the button click implementation:

 
SettingsPane.Show();

 

That’s all to integrate the settings pane in your Windows Store application. I hope, this will now help you to understand the settings pane integration. If you have further queries on this, please don’t forget to ask. Your feedbacks are always welcome to improve the articles.

 

Connect with me on Twitter, Facebook and Google+ for any kind of discussions. Subscribe to my blog’s RSS feed and email Newsletter to receive instant notification directly in your inbox.

Have a question? Or, a comment? Let's Discuss it below...

Thank you for visiting our website!

We value your engagement and would love to hear your thoughts. Don't forget to leave a comment below to share your feedback, opinions, or questions.

We believe in fostering an interactive and inclusive community, and your comments play a crucial role in creating that environment.