Skip to content

SettingsFlyout

Tim Heuer edited this page Oct 25, 2013 · 5 revisions

SettingsFlyout (Obsolete)

DEPRECATED

This control is deprecated in favor of using the Windows.UI.Xaml.Controls.SettingsFlyout control in Windows 8.1. Visit Callisto Migration Tips for specific information.

What it is

This control is a helper control to provide the Settings charm experience for custom settings within your app. It follows the specific Windows UI guidelines for layout and entrance/exit/positioning animations. It is a content control for your settings that are app-wide or contextual to your current view.

Example Usage

Declarative:

At present time, this doesn't work well declaratively - use at your own risk.

Code:

// NOTE: the MyCommandsRequested function is fired on the SettingsPane object, please consult the Windows SDK in order to learn how to add commands to the Settings charm.

private void MyCommandsRequested(SettingsPane sender, SettingsPaneCommandsRequestedEventArgs args)
{
    SettingsCommand cmd = new SettingsCommand("sample", "Sample Custom Setting", (x) =>
    {
        // create a new instance of the flyout
        SettingsFlyout settings = new SettingsFlyout();
        
        // optionally change header and content background colors away from defaults (recommended)
        //settings.Background = new SolidColorBrush(Colors.Red);
        settings.HeaderBrush = new SolidColorBrush(Colors.Orange);
        settings.HeaderText = "Foo Bar Custom Settings";

        // provide some logo (preferrably the smallogo the app uses)
        BitmapImage bmp = new BitmapImage(new Uri("ms-appx:///Assets/SmallLogo.png"));
        settings.SmallLogoImageSource = bmp;

        // set the content for the flyout
        settings.Content = new SettingsContent();

        // open it
        settings.IsOpen = true;
    });

    args.Request.ApplicationCommands.Add(cmd);
}

Example UI

SettingsFlyout from Callisto

Known Issues

  • Back button doesn't work in all situations for developers (e.g., no Command binding)