tsai
/
Avalonia
mirror of https://github.com/AvaloniaUI/Avalonia.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
Browse Source

Test

pull/4069/head
JamRemco 6 years ago
parent
576365ff8f
commit
34622c4559
3 changed files with 150 additions and 148 deletions
Whitespace
Show all changes Ignore whitespace when comparing lines Ignore changes in amount of whitespace Ignore changes in whitespace at EOL
Split View
Diff Options
Show Stats Download Patch File Download Diff File
  1. 2
      samples/ControlCatalog/Pages/ToolTipPage.xaml
  2. 286
      src/Avalonia.Themes.Default/ToggleSwitch.xaml
  3. 10
      src/Avalonia.Themes.Fluent/ToggleSwitch.xaml

2
samples/ControlCatalog/Pages/ToolTipPage.xaml
View File

@ -18,7 +18,7 @@
ToolTip.Tip="This is a ToolTip">
<TextBlock>Hover Here</TextBlock>
</Border>
<CheckBox Grid.Column="1"
<ToggleSwitch Grid.Column="1"
Margin="5"
Grid.Row="0"
IsChecked="{Binding ElementName=Border, Path=(ToolTip.IsOpen)}"

286
src/Avalonia.Themes.Default/ToggleSwitch.xaml
View File

@ -1,6 +1,7 @@
<!--Version Fri 5-6 17:30 -->
<Styles xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<Design.PreviewWith>
<StackPanel Margin="20" Width="250" Spacing="24">
@ -32,146 +33,147 @@
</StackPanel>
</Design.PreviewWith>
<Style Selector="ToggleSwitch">
<Style Selector="ToggleSwitch">
<Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
<Setter Property="Foreground" Value="{DynamicResource ThemeForegroundBrush}" />
<Setter Property="MinWidth" Value="72"/>
<Setter Property="MinHeight" Value="32"/>
<Setter Property="FontFamily" Value="{DynamicResource ContentControlThemeFontFamily}" />
<Setter Property="FontSize" Value="{DynamicResource ControlContentThemeFontSize}" />
<Setter Property="Foreground" Value="{DynamicResource ThemeForegroundBrush}" />
<Setter Property="MinWidth" Value="72"/>
<Setter Property="MinHeight" Value="32"/>
<Setter Property="Template">
<ControlTemplate>
<Grid ColumnDefinitions="Auto,*"
RowDefinitions="22,auto"
<Setter Property="Template">
<ControlTemplate>
<Grid ColumnDefinitions="Auto,*"
RowDefinitions="22,auto"
>
<Canvas
Height="24"
Grid.Row="1"
Grid.Column="0">
<Border
Name="PART_BorderBackground"
Height="20" Width="44"
Canvas.Top="2"
Canvas.Left="0"
BorderThickness="2"
CornerRadius="100"/>
<Ellipse
Name="PART_CircleThumb"
Height="10" Width="10"
Canvas.Top="7"
Canvas.Left="5"/>
<ContentControl Name="PART_TextBooleanValue"
Canvas.Left="51" VerticalContentAlignment="Bottom" Height="20"/>
</Canvas>
<ContentPresenter
Name="PART_ContentPresenter"
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
Margin="{TemplateBinding Padding}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Background="Transparent"
IsVisible="{TemplateBinding Content, Converter={x:Static ObjectConverters.IsNotNull}}"
Grid.Row="0" Grid.Column="0"/>
</Grid>
</ControlTemplate>
</Setter>
</Style>
<Style Selector="ToggleSwitch:unchecked /template/ Ellipse#PART_CircleThumb">
<Style.Animations>
<Animation Duration="0:0:0.4" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Fill" Value="White"/>
<Setter Property="Canvas.Left" Value="28"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Fill" Value="royalBlue"/>
<Setter Property="Canvas.Left" Value="5"/>
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
<Style Selector="ToggleSwitch:checked /template/ Ellipse#PART_CircleThumb">
<Style.Animations>
<Animation Duration="0:0:0.4" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Fill" Value="royalBlue"/>
<Setter Property="Canvas.Left" Value="5"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Fill" Value="White"/>
<Setter Property="Canvas.Left" Value="28"/>
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
<Style Selector="ToggleSwitch:unchecked /template/ Border#PART_BorderBackground">
<Style.Animations>
<Animation Duration="0:0:0.5" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Background" Value="Royalblue"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Background" Value="White"/>
</KeyFrame>
</Animation>
</Style.Animations>
<Setter Property="BorderBrush" Value="royalblue"/>
</Style>
<Style Selector="ToggleSwitch:checked /template/ Border#PART_BorderBackground">
<Style.Animations>
<Animation Duration="0:0:0.5" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Background" Value="White"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Background" Value="RoyalBlue"/>
</KeyFrame>
</Animation>
</Style.Animations>
<Setter Property="BorderBrush" Value="Royalblue"/>
</Style>
<!--<Style Selector="ToggleSwitch:pressed /template/ Border#PART_BorderBackground">
<Setter Property="BorderBrush" Value="{DynamicResource ThemeControlHighBrush}"/>
</Style>-->
<Style Selector="ToggleSwitch:checked /template/ ContentControl#PART_TextBooleanValue">
<Setter Property="Content" Value="On"/>
</Style>
<Style Selector="ToggleSwitch:unchecked /template/ ContentControl#PART_TextBooleanValue">
<Setter Property="Content" Value="Off"/>
</Style>
<Style Selector="ToggleSwitch /template/ Border#PART_BorderBackground:pointerover">
<Setter Property="BorderBrush" Value="cornflowerblue"/>
</Style>
<Style Selector="ToggleSwitch:focus /template/ Border#PART_BorderBackground">
<Setter Property="BorderBrush" Value="Mediumblue"/>
</Style>
<Style Selector="ToggleSwitch:focus:checked /template/ Border#PART_BorderBackground">
<Setter Property="Background" Value="Royalblue"/>
</Style>
<Style Selector="ToggleSwitch:focus /template/ Border#PART_BorderBackground:pointerover">
<Setter Property="BorderBrush" Value="cornflowerblue"/>
</Style>
<!--<Style Selector="ToggleSwitch:checked /template/ Border#PART_BorderBackground:pointerover">
<Canvas
Height="24"
Grid.Row="1"
Grid.Column="0">
<Border
Name="PART_BorderBackground"
Height="20" Width="44"
Canvas.Top="2"
Canvas.Left="0"
BorderThickness="2"
CornerRadius="100"/>
<Ellipse
Name="PART_CircleThumb"
Height="10" Width="10"
Canvas.Top="7"
/>
<ContentControl Name="PART_TextBooleanValue"
Canvas.Left="51" VerticalContentAlignment="Bottom" Height="20"/>
</Canvas>
<ContentPresenter
Name="PART_ContentPresenter"
ContentTemplate="{TemplateBinding ContentTemplate}"
Content="{TemplateBinding Content}"
Margin="{TemplateBinding Padding}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Background="Transparent"
IsVisible="{TemplateBinding Content, Converter={x:Static ObjectConverters.IsNotNull}}"
Grid.Row="0" Grid.Column="0"/>
</Grid>
</ControlTemplate>
</Setter>
</Style>
<Style Selector="ToggleSwitch:unchecked /template/ Ellipse#PART_CircleThumb">
<Style.Animations>
<Animation Duration="0:0:0.4" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Fill" Value="White"/>
<Setter Property="Canvas.Left" Value="28"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Fill" Value="royalBlue"/>
<Setter Property="Canvas.Left" Value="5"/>
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
<Style Selector="ToggleSwitch:checked /template/ Ellipse#PART_CircleThumb">
<Style.Animations>
<Animation Duration="0:0:0.4" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Fill" Value="royalBlue"/>
<Setter Property="Canvas.Left" Value="5"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Fill" Value="White"/>
<Setter Property="Canvas.Left" Value="28"/>
</KeyFrame>
</Animation>
</Style.Animations>
</Style>
<Style Selector="ToggleSwitch:unchecked /template/ Border#PART_BorderBackground">
<Style.Animations>
<Animation Duration="0:0:0.5" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Background" Value="Royalblue"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Background" Value="White"/>
</KeyFrame>
</Animation>
</Style.Animations>
<Setter Property="BorderBrush" Value="RoyalBlue"/>
</Style>
<Style Selector="ToggleSwitch:checked /template/ Border#PART_BorderBackground">
<Style.Animations>
<Animation Duration="0:0:0.5" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
<Setter Property="Background" Value="White"/>
</KeyFrame>
<KeyFrame Cue="100%">
<Setter Property="Background" Value="RoyalBlue"/>
</KeyFrame>
</Animation>
</Style.Animations>
<Setter Property="BorderBrush" Value="Royalblue"/>
</Style>
<!--<Style Selector="ToggleSwitch:pressed /template/ Border#PART_BorderBackground">
<Setter Property="BorderBrush" Value="{DynamicResource ThemeControlHighBrush}"/>
</Style>-->
<Style Selector="ToggleSwitch:checked /template/ ContentControl#PART_TextBooleanValue">
<Setter Property="Content" Value="On"/>
</Style>
<Style Selector="ToggleSwitch:unchecked /template/ ContentControl#PART_TextBooleanValue">
<Setter Property="Content" Value="Off"/>
</Style>
<Style Selector="ToggleSwitch /template/ Border#PART_BorderBackground:pointerover">
<Setter Property="BorderBrush" Value="cornflowerblue"/>
</Style>
<Style Selector="ToggleSwitch:focus /template/ Border#PART_BorderBackground">
<Setter Property="BorderBrush" Value="Mediumblue"/>
</Style>
<!--<Style Selector="ToggleSwitch:focus:checked /template/ Border#PART_BorderBackground">
<Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}"/>
</Style>-->
<Style Selector="ToggleSwitch:focus /template/ Border#PART_BorderBackground:pointerover">
<Setter Property="BorderBrush" Value="cornflowerblue"/>
</Style>
<!--<Style Selector="ToggleSwitch:checked /template/ Border#PART_BorderBackground:pointerover">
<Style.Animations>
<Animation Duration="0:0:0.1" FillMode="Forward" Easing="CubicEaseOut">
<KeyFrame Cue="0%">
@ -184,12 +186,12 @@
</Style.Animations>
</Style>-->
<Style Selector="ToggleSwitch:disabled">
<Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}"/>
</Style>
<Style Selector="ToggleSwitch:disabled">
<Setter Property="Opacity" Value="{DynamicResource ThemeDisabledOpacity}"/>
</Style>
<!--<Style Selector="ToggleSwitch:indeterminate /template/ ContentControl#PART_TextBooleanValue">
<!--<Style Selector="ToggleSwitch:indeterminate /template/ ContentControl#PART_TextBooleanValue">
<Setter Property="Content" Value="Not set"/>
</Style>-->

10
src/Avalonia.Themes.Fluent/ToggleSwitch.xaml
View File

@ -62,7 +62,7 @@
Name="PART_CircleThumb"
Height="10" Width="10"
Canvas.Top="7"
Canvas.Left="5"/>
/>
<ContentControl Name="PART_TextBooleanValue"
Canvas.Left="51" VerticalContentAlignment="Bottom" Height="20"/>
@ -126,7 +126,7 @@
</KeyFrame>
</Animation>
</Style.Animations>
<Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}"/>
<Setter Property="BorderBrush" Value="RoyalBlue"/>
</Style>
<Style Selector="ToggleSwitch:checked /template/ Border#PART_BorderBackground">
@ -140,7 +140,7 @@
</KeyFrame>
</Animation>
</Style.Animations>
<Setter Property="BorderBrush" Value="{DynamicResource ToggleSwitchStrokeOn}"/>
<Setter Property="BorderBrush" Value="Royalblue"/>
</Style>
<!--<Style Selector="ToggleSwitch:pressed /template/ Border#PART_BorderBackground">
@ -163,9 +163,9 @@
<Setter Property="BorderBrush" Value="Mediumblue"/>
</Style>
<Style Selector="ToggleSwitch:focus:checked /template/ Border#PART_BorderBackground">
<!--<Style Selector="ToggleSwitch:focus:checked /template/ Border#PART_BorderBackground">
<Setter Property="Background" Value="{DynamicResource ToggleSwitchFillOn}"/>
</Style>
</Style>-->
<Style Selector="ToggleSwitch:focus /template/ Border#PART_BorderBackground:pointerover">
<Setter Property="BorderBrush" Value="cornflowerblue"/>

Write Preview
Loading…
Cancel
Save