Files
ShrlAlgoToolkit/WPFluent/Controls/RadioButton/RadioButton.xaml

224 lines
14 KiB
Plaintext
Raw Normal View History

<!--
This Source Code Form is subject to the terms of the MIT License.
If a copy of the MIT was not distributed with this file, You can obtain one at https://opensource.org/licenses/MIT.
Copyright (C) Leszek Pomianowski and WPF UI Contributors.
All Rights Reserved.
Based on Microsoft XAML for Win UI
Copyright (c) Microsoft Corporation. All Rights Reserved.
-->
<ResourceDictionary
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:system="clr-namespace:System;assembly=System.Runtime">
<system:Double x:Key="RadioButtonCheckGlyphSize">12</system:Double>
<system:Double x:Key="RadioButtonOuterEllipseSize">20</system:Double>
<!--
<system:Double x:Key="RadioButtonCheckGlyphPointerOverSize">14</system:Double>
<system:Double x:Key="RadioButtonCheckGlyphPressedOverSize">10</system:Double>-->
<system:Double x:Key="RadioButtonStrokeThickness">1</system:Double>
<Thickness x:Key="RadioButtonPadding">8,6,0,0</Thickness>
<Style x:Key="DefaultRadioButtonStyle" TargetType="{x:Type RadioButton}">
<!-- Universal WPF UI focus -->
<Setter Property="FocusVisualStyle" Value="{DynamicResource DefaultControlFocusVisualStyle}" />
<!-- Universal WPF UI focus -->
<Setter Property="Background" Value="{DynamicResource RadioButtonOuterEllipseCheckedStroke}" />
<Setter Property="Foreground" Value="{DynamicResource RadioButtonForeground}" />
<Setter Property="BorderBrush" Value="Transparent" />
<Setter Property="Margin" Value="0" />
<Setter Property="Padding" Value="{StaticResource RadioButtonPadding}" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Center" />
<Setter Property="HorizontalContentAlignment" Value="Left" />
<Setter Property="VerticalContentAlignment" Value="Top" />
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
<Setter Property="FontWeight" Value="Normal" />
<Setter Property="MinWidth" Value="120" />
<Setter Property="KeyboardNavigation.IsTabStop" Value="True" />
<Setter Property="Focusable" Value="True" />
<Setter Property="SnapsToDevicePixels" Value="True" />
<Setter Property="OverridesDefaultStyle" Value="True" />
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type RadioButton}">
<Grid
HorizontalAlignment="Stretch"
VerticalAlignment="{TemplateBinding VerticalAlignment}"
Background="Transparent">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="20" />
<ColumnDefinition Width="*" />
</Grid.ColumnDefinitions>
<Grid Height="32" VerticalAlignment="Top">
<Ellipse
x:Name="OuterEllipse"
Width="{StaticResource RadioButtonOuterEllipseSize}"
Height="{StaticResource RadioButtonOuterEllipseSize}"
Fill="{DynamicResource RadioButtonOuterEllipseFill}"
Stroke="{DynamicResource RadioButtonOuterEllipseStroke}"
StrokeThickness="{StaticResource RadioButtonStrokeThickness}"
UseLayoutRounding="False" />
<!-- A separate element is added since the two orthogonal state groups that cannot touch the same property -->
<Ellipse
x:Name="CheckOuterEllipse"
Width="{StaticResource RadioButtonOuterEllipseSize}"
Height="{StaticResource RadioButtonOuterEllipseSize}"
Fill="{TemplateBinding Background}"
Opacity="0"
Stroke="{TemplateBinding Background}"
StrokeThickness="{StaticResource RadioButtonStrokeThickness}"
UseLayoutRounding="False" />
<Ellipse
x:Name="CheckGlyph"
Width="{StaticResource RadioButtonCheckGlyphSize}"
Height="{StaticResource RadioButtonCheckGlyphSize}"
Fill="{DynamicResource RadioButtonCheckGlyphFill}"
Opacity="0"
Stroke="{DynamicResource CircleElevationBorderBrush}"
UseLayoutRounding="False">
<Ellipse.LayoutTransform>
<ScaleTransform ScaleX="1.0" ScaleY="1.0" />
</Ellipse.LayoutTransform>
</Ellipse>
<!-- A separate element is added since the two orthogonal state groups that cannot touch the same property -->
<Border
x:Name="PressedCheckGlyph"
Width="4"
Height="4"
Background="{DynamicResource RadioButtonCheckGlyphFill}"
BorderBrush="{DynamicResource CircleElevationBorderBrush}"
CornerRadius="6"
Opacity="0"
UseLayoutRounding="False" />
</Grid>
<ContentPresenter
x:Name="ContentPresenter"
Grid.Column="1"
Margin="{TemplateBinding Padding}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
TextElement.Foreground="{TemplateBinding Foreground}" />
</Grid>
<ControlTemplate.Triggers>
<!-- Clunky, todo
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="IsChecked" Value="True" />
<Condition Property="IsEnabled" Value="True" />
</MultiTrigger.Conditions>
<MultiTrigger.EnterActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="CheckGlyph"
Storyboard.TargetProperty="(Ellipse.LayoutTransform).(ScaleTransform.ScaleY)"
From="1.0"
To="1.2"
Duration="00:00:00.167" />
<DoubleAnimation
Storyboard.TargetName="CheckGlyph"
Storyboard.TargetProperty="(Ellipse.LayoutTransform).(ScaleTransform.ScaleX)"
From="1.0"
To="1.2"
Duration="00:00:00.167" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.EnterActions>
<MultiTrigger.ExitActions>
<BeginStoryboard>
<Storyboard>
<DoubleAnimation
Storyboard.TargetName="CheckGlyph"
Storyboard.TargetProperty="(Ellipse.LayoutTransform).(ScaleTransform.ScaleY)"
From="1.2"
To="1.0"
Duration="00:00:00.167" />
<DoubleAnimation
Storyboard.TargetName="CheckGlyph"
Storyboard.TargetProperty="(Ellipse.LayoutTransform).(ScaleTransform.ScaleX)"
From="1.2"
To="1.0"
Duration="00:00:00.167" />
</Storyboard>
</BeginStoryboard>
</MultiTrigger.ExitActions>
</MultiTrigger>
-->
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsPressed" Value="True" />
<Condition Property="IsChecked" Value="False" />
<Condition Property="IsEnabled" Value="True" />
</MultiTrigger.Conditions>
<Setter TargetName="CheckGlyph" Property="Opacity" Value="1.0" />
<Setter TargetName="OuterEllipse" Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPressed}" />
<Setter TargetName="OuterEllipse" Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokePressed}" />
</MultiTrigger>
<Trigger Property="IsChecked" Value="True">
<Setter TargetName="CheckGlyph" Property="Opacity" Value="1.0" />
<Setter TargetName="OuterEllipse" Property="Opacity" Value="0.0" />
<Setter TargetName="CheckOuterEllipse" Property="Opacity" Value="1.0" />
</Trigger>
<Trigger Property="FlowDirection" Value="RightToLeft">
<Setter Property="HorizontalAlignment" Value="Right" />
</Trigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="IsChecked" Value="False" />
<Condition Property="IsEnabled" Value="True" />
</MultiTrigger.Conditions>
<Setter TargetName="OuterEllipse" Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPointerOver}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsMouseOver" Value="True" />
<Condition Property="IsChecked" Value="True" />
<Condition Property="IsEnabled" Value="True" />
</MultiTrigger.Conditions>
<Setter TargetName="OuterEllipse" Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillPointerOver}" />
<!--<Setter TargetName="CheckGlyph" Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePointerOver}" />-->
<Setter TargetName="PressedCheckGlyph" Property="Background" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokePointerOver}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="False" />
<Condition Property="IsEnabled" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
<Setter TargetName="OuterEllipse" Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillDisabled}" />
<Setter TargetName="OuterEllipse" Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseStrokeDisabled}" />
</MultiTrigger>
<MultiTrigger>
<MultiTrigger.Conditions>
<Condition Property="IsChecked" Value="True" />
<Condition Property="IsEnabled" Value="False" />
</MultiTrigger.Conditions>
<Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
<Setter Property="Foreground" Value="{DynamicResource RadioButtonForegroundDisabled}" />
<Setter TargetName="OuterEllipse" Property="Fill" Value="{DynamicResource RadioButtonOuterEllipseFillDisabled}" />
<Setter TargetName="OuterEllipse" Property="Stroke" Value="{DynamicResource RadioButtonOuterEllipseCheckedStrokeDisabled}" />
<Setter TargetName="CheckGlyph" Property="Opacity" Value="0.7" />
<Setter TargetName="CheckOuterEllipse" Property="Opacity" Value="0.7" />
</MultiTrigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
<Style BasedOn="{StaticResource DefaultRadioButtonStyle}" TargetType="{x:Type RadioButton}" />
</ResourceDictionary>