Пользовательский шаблон для переключателя и использования визуального состояния

Это пользовательский стиль, который я использую для переключателя. Идея состоит в том, чтобы переключать цвет переднего плана и фона между отмеченным и непроверенным состоянием. Все работает нормально, пока я не наведу курсор мыши на проверенную кнопку и не выдвину ее. Передний план переключается обратно на основной цвет.

Уточнить это, что я думаю, что происходит.

  1. Когда кнопка нажата, проверенное состояние становится активным.
  2. Когда вы перемещаете указатель, состояние PointerOver становится активным и меняет передний план на цвет WhiteTextAndIcons.
  3. Когда указатель перемещается, передний план возвращается к значению по умолчанию, которое является Primary Color, следовательно, оно соответствует фону.

Что мне нужно, если состояние проверено, то передний план не должен возвращаться по умолчанию, когда указатель перемещается внутрь или наружу. Это возможно через стиль?

Это обходной путь, который я использую, но я хочу знать, что я делаю здесь не так.

Временное решение:

private void MainPage_PointerExited(object sender, PointerRoutedEventArgs e)
    {
        if(sender is RadioButton)
        {
            var radio = sender as RadioButton;
            if(radio.IsChecked.HasValue && radio.IsChecked.Value)
            {
                radio.IsChecked = false;
                radio.IsChecked = true;
            }
        }
    }

Цвет и пользовательский шаблон.

<Color x:Key="DarkPrimaryColor">#FF1664A7</Color>
<Color x:Key="PrimaryColor">#FF0078D7</Color>
<Color x:Key="LightPrimaryColor">#FF2488D8</Color>
<Color x:Key="WhiteTextAndIcons">#FFFFFFFF</Color>

<SolidColorBrush x:Key="NavButtonPressedBackgroundBrush" Color="{ThemeResource PrimaryColor}" />
<SolidColorBrush x:Key="NavButtonHoverBackgroundBrush" Color="{ThemeResource LightPrimaryColor}" />
<SolidColorBrush x:Key="NavButtonCheckedBackgroundBrush" Color="{ThemeResource PrimaryColor}" />
<SolidColorBrush x:Key="NavButtonCheckedPressedBackgroundBrush" Color="{ThemeResource DarkPrimaryColor}" />
<SolidColorBrush x:Key="NavButtonCheckedHoverBackgroundBrush" Color="{ThemeResource LightPrimaryColor}" />
<SolidColorBrush x:Key="NavButtonCheckedForegroundBrush" Color="{ThemeResource WhiteTextAndIcons}" />
<SolidColorBrush x:Key="NavButtonForegroundBrush" Color="{ThemeResource PrimaryColor}" />

<Style TargetType="RadioButton" x:Key="SplitViewRadioButtonWithWhiteBGStyle">
            <Setter Property="Background" Value="Transparent" />
            <Setter Property="Foreground" Value="{ThemeResource NavButtonForegroundBrush}" />
            <Setter Property="Padding" Value="1,4,0,0" />
            <Setter Property="HorizontalAlignment" Value="Stretch" />
            <Setter Property="VerticalAlignment" Value="Center" />
            <Setter Property="HorizontalContentAlignment" Value="Left" />
            <Setter Property="VerticalContentAlignment" Value="Center" />
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="RadioButton">
                        <Border Background="{TemplateBinding Background}" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}">
                            <VisualStateManager.VisualStateGroups>
                                <VisualStateGroup x:Name="CommonStates">
                                    <VisualState x:Name="Normal" />
                                    <VisualState x:Name="PointerOver">
                                        <VisualState.Setters>
                                            <Setter Target="HoverBackground.Visibility" Value="Visible"/>
                                            <Setter Target="CheckedHoverBackground.Visibility" Value="Visible"/>
                                            <Setter Target="NixonGlyph.(ContentPresenter.Foreground)" Value="{StaticResource NavButtonCheckedForegroundBrush}"/>
                                            <Setter Target="ContentPresenter.Foreground" Value="{StaticResource NavButtonCheckedForegroundBrush}"/>
                                        </VisualState.Setters>
                                    </VisualState>

                                    <VisualState x:Name="Pressed">
                                        <VisualState.Setters>
                                            <Setter Target="PressedBackground.Visibility" Value="Visible"/>
                                            <Setter Target="CheckedPressedBackground.Visibility" Value="Visible"/>
                                            <Setter Target="NixonGlyph.(ContentPresenter.Foreground)" Value="{StaticResource NavButtonCheckedForegroundBrush}"/>
                                            <Setter Target="ContentPresenter.Foreground" Value="{StaticResource NavButtonCheckedForegroundBrush}"/>
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="Disabled">
                                        <VisualState.Setters>
                                            <Setter Target="NixonGlyph.(ContentPresenter.Foreground)" Value="{ThemeResource RadioButtonContentDisabledForegroundThemeBrush}"/>
                                            <Setter Target="ContentPresenter.Foreground" Value="{ThemeResource RadioButtonContentDisabledForegroundThemeBrush}"/>
                                        </VisualState.Setters>
                                    </VisualState>
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="CheckStates">
                                    <VisualState x:Name="Checked">
                                        <VisualState.Setters>
                                            <Setter Target="CheckedBackground.Visibility" Value="Visible"/>
                                            <Setter Target="NixonGlyph.(ContentPresenter.Foreground)" Value="{StaticResource NavButtonCheckedForegroundBrush}"/>
                                            <Setter Target="ContentPresenter.Foreground" Value="{StaticResource NavButtonCheckedForegroundBrush}"/>
                                        </VisualState.Setters>
                                    </VisualState>
                                    <VisualState x:Name="Unchecked" />
                                    <VisualState x:Name="Indeterminate" />
                                </VisualStateGroup>
                                <VisualStateGroup x:Name="FocusStates">
                                    <VisualState x:Name="Focused">
                                        <Storyboard>
                                            <DoubleAnimation Duration="0" Storyboard.TargetName="FocusVisualWhite" Storyboard.TargetProperty="Opacity" To="1" />
                                            <DoubleAnimation Duration="0" Storyboard.TargetName="FocusVisualBlack" Storyboard.TargetProperty="Opacity" To="1" />
                                        </Storyboard>
                                    </VisualState>
                                    <VisualState x:Name="Unfocused"/>
                                    <VisualState x:Name="PointerFocused" />
                                </VisualStateGroup>
                            </VisualStateManager.VisualStateGroups>
                            <Grid>

                                <Grid.RowDefinitions>
                                    <RowDefinition Height="48" />
                                </Grid.RowDefinitions>

                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="48" />
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="20" />
                                </Grid.ColumnDefinitions>

                                <Grid.Resources>
                                    <Style TargetType="Rectangle" x:Name="FocusVisual">
                                        <Setter Property="Opacity" Value="0" />
                                        <Setter Property="StrokeDashArray" Value="1,1" />
                                        <Setter Property="StrokeEndLineCap" Value="Square" />
                                    </Style>
                                </Grid.Resources>

                                <!-- background -->

                                <Grid x:Name="NotCheckedBackground" Grid.ColumnSpan="4">
                                    <Rectangle x:Name="PressedBackground" Visibility="Collapsed" Fill="{StaticResource NavButtonPressedBackgroundBrush}"/>
                                    <Rectangle x:Name="HoverBackground" Visibility="Collapsed" Fill="{StaticResource NavButtonHoverBackgroundBrush}"/>
                                </Grid>
                                <Grid x:Name="CheckedBackground" Grid.ColumnSpan="4" Visibility="Collapsed" Background="{StaticResource NavButtonCheckedBackgroundBrush}">
                                    <Rectangle x:Name="CheckedPressedBackground" Visibility="Collapsed" Fill="{StaticResource NavButtonCheckedPressedBackgroundBrush}"/>
                                    <Rectangle x:Name="CheckedHoverBackground" Visibility="Collapsed" Fill="{StaticResource NavButtonCheckedHoverBackgroundBrush}"/>
                                </Grid>

                                <!-- focus -->
                                <Rectangle x:Name="FocusVisualWhite" Stroke="{ThemeResource FocusVisualWhiteStrokeThemeBrush}" StrokeDashOffset="1.5" Style="{StaticResource FocusVisual}" />
                                <Rectangle x:Name="FocusVisualBlack" Stroke="{ThemeResource FocusVisualBlackStrokeThemeBrush}" StrokeDashOffset="0.5" Style="{StaticResource FocusVisual}" />

                                <!-- glyph -->
                                <ContentPresenter x:Name="NixonGlyph" Content="{TemplateBinding Tag}" />

                                <!-- text -->
                                <ContentPresenter x:Name="ContentPresenter"
                                Grid.Column="1"
                                Margin="{TemplateBinding Padding}"
                                HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                AutomationProperties.AccessibilityView="Raw"
                                Content="{TemplateBinding Content}"
                                ContentTemplate="{TemplateBinding ContentTemplate}"
                                ContentTransitions="{TemplateBinding ContentTransitions}" />
                            </Grid>
                        </Border>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>

0 ответов

Другие вопросы по тегам