Applikations-Einstellungen einer Windows Store-App können in der Charm Bar integriert werden. Der Benutzer braucht dann in der App nur die “Windowstaste + C” drücken und kann dann im Menüpunkt “Einstellungen” die für die App definierten Settings einsehen.
Wie man solche Settings mit C# hinzufügt, möchte ich in einem kleinen Code-Beispiel zeigen.
MainPage.xaml.cs
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 | public MainPage() { this.InitializeComponent(); SettingsPane.GetForCurrentView().CommandsRequested += MainPage_CommandsRequested; } private void MainPage_CommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args) { UICommandInvokedHandler MyCommandAction = new UICommandInvokedHandler(async (command) => { MessageDialog dialog = new MessageDialog(command.Label, "Selected command"); await dialog.ShowAsync(); // Shows title "Select command" and content "My setting" }); SettingsCommand settingsCommand = new SettingsCommand("MyCommandId", "My setting", MyCommandAction); args.Request.ApplicationCommands.Add(settingsCommand); } |
Hier dasselbe Beispiel ohne Lambda-Ausdruck:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | ... private void MainPage_CommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args) { UICommandInvokedHandler MyCommandAction = new UICommandInvokedHandler(MyCommandActionHandler); SettingsCommand settingsCommand = new SettingsCommand("MyCommandId", "My setting", MyCommandAction); args.Request.ApplicationCommands.Add(settingsCommand); } private async void MyCommandActionHandler(IUICommand command) { MessageDialog dialog = new MessageDialog(command.Label, "Selected command"); await dialog.ShowAsync(); // Shows title "Select command" and content "My setting" } |
Globale Einstellungen für alle Seiten
Möchte man, dass die eigenen Einstellungen nicht nur in Verbindung mit der MainPage.xaml angezeigt werden, sondern stattdessen von allen Seiten aus erreichbar sind, so muss man den Listener für CommandsRequested in der OnLaunched-Methode der App.xaml.cs setzen.
App.xaml.cs
1 2 3 4 5 6 | protected override void OnLaunched(LaunchActivatedEventArgs args) { // Register global app settings SettingsPane.GetForCurrentView().CommandsRequested += OnCommandsRequested; ... } |
Einstellungen mit FlyOut
Mit JavaScript ist es einfach ein Settings-Flyout zu erstellen. Mit C# und XAML wird es da etwas schwieriger. Die Empfehlung von Microsoft ist im Artikel Quickstart: Add app settings zu sehen. Es gibt aber auch ein Toolkit namens Callisto, welches einem viel Arbeit abnehmen kann (weil man sonst ein komplettes FlyOut als UserControl selber designen müsste). Die Anweisungen dafür sind in “How to add a settings menu in a Windows 8 Metro-style app” und der “SettingsFlyout“-Dokumentation des Projektes beschrieben.
Hier ein Beispiel mit Bordmitteln:
App.xaml.cs
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 | sealed partial class App : Application { Popup _settingsPopup = null; ... protected override void OnLaunched(LaunchActivatedEventArgs args) { // Register app settings SettingsPane.GetForCurrentView().CommandsRequested += OnCommandsRequested; } private void OnCommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args) { // Privacy setting UICommandInvokedHandler privacySettingAction = new UICommandInvokedHandler(PrivacySettingActionHandler); SettingsCommand privacySetting = new SettingsCommand("PrivacySetting", "Privacy", privacySettingAction); args.Request.ApplicationCommands.Add(privacySetting); } private void PrivacySettingActionHandler(IUICommand command) { int flyOutWidth = 346; // Can be 346 or 646 _settingsPopup = new Popup(); _settingsPopup.Closed += OnPopupClosed; Window.Current.Activated += OnWindowActivated; _settingsPopup.IsLightDismissEnabled = true; _settingsPopup.Width = flyOutWidth; _settingsPopup.Height = Window.Current.Bounds.Height; AppSettingsFlyout myUserControl = new AppSettingsFlyout(); myUserControl.Width = flyOutWidth; myUserControl.Height = Window.Current.Bounds.Height; _settingsPopup.Child = myUserControl; _settingsPopup.SetValue(Canvas.LeftProperty, Window.Current.Bounds.Width - flyOutWidth); _settingsPopup.SetValue(Canvas.TopProperty, 0); _settingsPopup.IsOpen = true; } private void OnWindowActivated(object sender, Windows.UI.Core.WindowActivatedEventArgs e) { if (e.WindowActivationState == Windows.UI.Core.CoreWindowActivationState.Deactivated) { _settingsPopup.IsOpen = false; } } void OnPopupClosed(object sender, object e) { Window.Current.Activated -= OnWindowActivated; } ... } |
AppSettingsFlyout.xaml (User Control)
1 2 3 4 5 6 7 8 9 10 11 12 13 14 | <UserControl x:Class="Informatk_Tutorials.UserControls.AppSettingsFlyout" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:local="using:Informatk_Tutorials.UserControls" xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="346"> <Grid> <TextBlock HorizontalAlignment="Left" TextWrapping="Wrap" Text="Description" VerticalAlignment="Top"/> </Grid> </UserControl> |
Wer gerne ein vorgefertigtes UserControl (das schon nach etwas aussieht!) verwenden möchte, der sollte sich das CharmFrame anschauen.
Einstellungen speichern
Wer wissen möchte, wie die Einstellungen gespeichert werden können oder wie man über die Settings auf eine URL verweist, dem empfehle ich den Artikel “Windows 8 Metro: Add settings to your application“.
Super Beitrag, genau was ich gesucht habe.
Was muss man machen um mehr als einen Punkt mit in die Settings zu nehmen z.B. “Privacy” und “About”?
Guten Abend/Morgen,
zuerst, vielen dank für diesen Artikel.
Gibt es bereits einen Lösungsweg zum hinzufügen mehrere Punkte?
LG Sandro