- Fitting It In
- Task List
- The Development Process in a Nutshell
- Say Hello
- Create a New Project
- Run in the Simulator
- Set Some XAML Properties
- Change the XAML
- Use the Property Window
- Add a Contract
- Wire up the Flyout
- Add a Live Tile
- Certify your App
- Say What?
- Visual Studio Templates
- Common Files
- Visual Studio 2013 Express
- Using the Simulator
- The XAML Designer
- Blend integration
- Review
This chapter is from the book
This chapter is from the book
This chapter is from the book
Wire up the Flyout
When you add a new item to a project, Visual Studio does a lot of the work for you, but it can’t do everything. In the case of the SettingsFlyout, we need to add code to the App.Xaml.cs or App.Xaml.vb file to hook the flyout we create to the Settings charm. Here’s how:
MAKE A NOTE
Throughout the book, when you see a big langage brad like this, it means that the next bit of text is language-specific. I’ll repeat the discussion for both languages, so you can just read the one that pertains to you and skip the other.
REFERENCE APPLICATIONSETTINGSThe objects we’ll be using are defined in the Windows.UI.ApplicationSettings namespace, so open up the App.Xaml code-behind file and add a using statement to the top of the file:
using Windows.UI.ApplicationSettings;
Register an Event Handler
We want to display our custom settings flyout when the user opens the Settings charm, so the first thing we need to do is register an event handler to the CommandsRequested event of the SettingsPane.
Don’t worry too much about the details of how this works right now. We’ll discuss contracts and the structure of the App.Xaml.cs file in detail in Chapter 17. Just scroll to the bottom of the file and add the OnWindowCreated function shown below. Notice that Visual Studio offers a conventional name for the event handler and then offers to create a skeleton function for us. Press Tab twice to save yourself some typing.
)
Handle the Event
We could do everything inside the event handler Visual Studio created for us, but best practice dictates that we should separate responding to the event from opening the flyout, and that’s what we’ll do:
)
)
)
MAKE A NOTE
Just in case you missed it a few pages ago (in which case I apologize for the confusion), this big brad tells you that this page contains Visual Basic code examples. If you’re using C#, you’ve already seen them and can skip to page 62.
Reference Applicationsettings
The objects we’ll be using are defined in the Windows.UI.ApplicationSettings and Windows.UI.Popups namespaces, so open up the App.xaml code-behind file and add a using statement to the top of the file:
Imports Windows.UI.ApplicationSettings Imports Windows.UI.Popups
Register an Event Handler
We want to display our custom settings flyout when the user opens the Settings charm, so the first thing we need to do is register an event handler to the CommandsRequested event of the SettingsPane.
Don’t worry too much about the details of how this works right now. We’ll discuss contracts and the structure of the App.Xaml.vb file in detail in Chapter 17. Just scroll to the bottom of the file and add the OnWindowCreated function shown below. Because we haven’t created the method yet, Visual Studio will display an error. If you click on the red button and choose “Generate method stub...”, you’ll save yourself some typing.
)
Handle the Event
We could do everything inside the event handler Visual Studio created for us, but best practice dictates that we should separate responding to the event from opening the Flyout, and that’s what we’ll do:
)
)
)
Run the Application on your Local Machine
You can’t use the simulator to test how your application interacts with the operating system, so choose Local Machine from the toolbar, and then click the green arrow to run the app.
Open the Settings Charm
Once the application loads, open the Charm Menu and choose the Settings charm.
)
Choose Custom Setting
Choose Custom Settings and (if you got all those event handlers right) our custom flyout will display. Not much there now, but don’t worry, you’ll learn how to expand its functionality in Chapter 17.
)