Styles seem not to apply to CharmFlyout

May 8, 2013 at 10:44 AM
Edited May 8, 2013 at 10:45 AM
Hi, I was using your handy control to reduce duplicating code in my app. But I was unable to apply custom style that I've created because all my CharmFlyout instances have same settings. The setting from style simply do not aplly. At the same time similar style nicely applied to a ToggleSwitch control inside CharmFlyout. Please see my sample code below
<UserControl
    x:Class="SampleStoreApp.MyCharmFlyouts"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:cfl="using:CharmFlyoutLibrary"
    mc:Ignorable="d">

    <UserControl.Resources>
        <Style x:Key="CharmFlyoutStyle" TargetType="cfl:CharmFlyout">
            <Setter Property="HeadingBackgroundBrush" Value="DarkGreen"></Setter>
            <Setter Property="ContentForegroundBrush" Value="DarkGreen"></Setter>
            <Setter Property="Logo">
                <Setter.Value>
                    <Image Width="35" Height="35" Source="Assets/SmallLogo.png"></Image>
                </Setter.Value>
            </Setter>
        </Style>

        <Style x:Key="ToggleSwitchStyle" TargetType="ToggleSwitch">
            <Setter Property="Foreground" Value="DarkGreen"></Setter>
        </Style>
    </UserControl.Resources>

    <Grid>
        <cfl:CharmFlyout x:Name="AboutCharmFlyout" Style="{StaticResource CharmFlyoutStyle}">
            <StackPanel>
                <TextBlock FontSize="16">CharmFlyout by John Michael Hauck</TextBlock>
                <TextBlock FontSize="16">For support:</TextBlock>
                <HyperlinkButton Click="OnMailTo">some-e-mail@some-domain.com</HyperlinkButton>
            </StackPanel>
        </cfl:CharmFlyout>

        <cfl:CharmFlyout x:Name="SettingsCharmFlyout" Style="{StaticResource CharmFlyoutStyle}">
            <StackPanel>
                <TextBlock FontSize="16">Just some settings</TextBlock>
                <ToggleSwitch Style="{StaticResource ToggleSwitchStyle}"></ToggleSwitch>
            </StackPanel>
        </cfl:CharmFlyout>

    </Grid>
</UserControl>