Skip to content

Commit

Permalink
chore: add avalonia CheckBox demo.
Browse files Browse the repository at this point in the history
  • Loading branch information
NaBian committed Dec 2, 2024
1 parent 00d64d5 commit 9122671
Show file tree
Hide file tree
Showing 10 changed files with 239 additions and 82 deletions.
Original file line number Diff line number Diff line change
@@ -0,0 +1,26 @@
<UserControl xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="HandyControlDemo.UserControl.CheckBoxDemoCtl">
<StackPanel Margin="32"
HorizontalAlignment="Center"
VerticalAlignment="Center">
<CheckBox Content="CheckBox"
IsChecked="True" />
<CheckBox Margin="0,16,0,0"
Content="CheckBox"
IsChecked="True"
IsEnabled="False" />
<CheckBox Margin="0,16,0,0"
Content="CheckBox" />
<CheckBox Margin="0,16,0,0"
Content="CheckBox"
IsEnabled="False" />
<CheckBox Margin="0,16,0,0"
Content="CheckBox"
IsChecked="{x:Null}" />
<CheckBox Margin="0,16,0,0"
Content="CheckBox"
IsChecked="{x:Null}"
IsEnabled="False" />
</StackPanel>
</UserControl>
Original file line number Diff line number Diff line change
@@ -0,0 +1,9 @@
namespace HandyControlDemo.UserControl;

public partial class CheckBoxDemoCtl : Avalonia.Controls.UserControl
{
public CheckBoxDemoCtl()
{
InitializeComponent();
}
}
121 changes: 121 additions & 0 deletions src/Avalonia/HandyControl_Avalonia/Themes/Styles/CheckBox.axaml
Original file line number Diff line number Diff line change
@@ -0,0 +1,121 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<ControlTheme x:Key="CheckBoxBaseStyle"
TargetType="CheckBox">
<Setter Property="Foreground"
Value="{DynamicResource PrimaryTextBrush}" />
<Setter Property="Background"
Value="White" />
<Setter Property="BorderBrush"
Value="{DynamicResource BorderBrush}" />
<Setter Property="BorderThickness"
Value="1" />
<Setter Property="HorizontalAlignment"
Value="Stretch" />
<Setter Property="VerticalAlignment"
Value="Center" />
<Setter Property="VerticalContentAlignment"
Value="Center" />
<Setter Property="Padding"
Value="6,0,0,0" />
<Setter Property="Template">
<ControlTemplate>
<Grid Background="Transparent"
ColumnDefinitions="Auto, *">
<Border Height="16"
Width="16"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="2" />
<Panel Grid.Column="0"
Height="16"
Width="16">
<Path FlowDirection="LeftToRight"
StrokeDashOffset="8"
StrokeDashArray="8,8"
Width="10"
Height="8"
Data="{StaticResource CheckedGeometry}"
StrokeThickness="2"
Stretch="Uniform"
Stroke="{DynamicResource TextIconBrush}"
VerticalAlignment="Center"
HorizontalAlignment="Center"
x:Name="path">
<Path.Transitions>
<Transitions>
<DoubleTransition Property="StrokeDashOffset"
Duration="0:0:0.2" />
</Transitions>
</Path.Transitions>
</Path>
<Rectangle RadiusX="2"
RadiusY="2"
Width="12"
Height="12"
Fill="{DynamicResource PrimaryBrush}"
IsVisible="{Binding IsChecked, RelativeSource={RelativeSource TemplatedParent}, Converter={x:Static ObjectConverters.IsNull}}"
Margin="2"
Opacity="1"
x:Name="indeterminateMark" />
</Panel>
<ContentPresenter x:Name="contentPresenter"
IsVisible="{Binding $self.Content, Converter={x:Static ObjectConverters.IsNotNull}}"
Grid.Column="1"
Focusable="False"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
Margin="{TemplateBinding Padding}"
RecognizesAccessKey="True"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Grid>
</ControlTemplate>
</Setter>

<Style Selector="^:pointerover">
<Setter Property="BorderBrush"
Value="{DynamicResource SecondaryBorderBrush}" />
</Style>

<Style Selector="^:checked">
<Setter Property="Background"
Value="{DynamicResource PrimaryBrush}" />
<Setter Property="BorderBrush"
Value="{DynamicResource DarkPrimaryBrush}" />

<Style Selector="^ /template/ Path#path">
<Setter Property="StrokeDashOffset"
Value="0" />
</Style>
</Style>

<Style Selector="^:unchecked">
<Style Selector="^ /template/ Path#path">
<Setter Property="Stroke"
Value="{DynamicResource BorderBrush}" />
<Setter Property="StrokeDashOffset"
Value="8" />
</Style>
</Style>

<Style Selector="^:pressed">
<Style Selector="^:checked">
<Setter Property="Opacity"
Value=".8" />
</Style>
<Style Selector="^:unchecked">
<Setter Property="BorderBrush"
Value="{DynamicResource PrimaryBrush}" />
</Style>
</Style>

<Style Selector="^:disabled">
<Setter Property="Opacity"
Value="0.4" />
</Style>
</ControlTheme>

<ControlTheme x:Key="{x:Type CheckBox}"
BasedOn="{StaticResource CheckBoxBaseStyle}"
TargetType="CheckBox" />
</ResourceDictionary>
26 changes: 14 additions & 12 deletions src/Avalonia/HandyControl_Avalonia/Themes/Styles/RadioButton.axaml
Original file line number Diff line number Diff line change
Expand Up @@ -70,30 +70,32 @@
Value="{DynamicResource SecondaryBorderBrush}" />
</Style>

<Style Selector="^:pressed:checked">
<Setter Property="Opacity"
Value=".8" />
</Style>

<Style Selector="^:pressed:unchecked">
<Setter Property="BorderBrush"
Value="{DynamicResource PrimaryBrush}" />
<Style Selector="^:pressed">
<Style Selector="^:checked">
<Setter Property="Opacity"
Value=".8" />
</Style>
<Style Selector="^:unchecked">
<Setter Property="BorderBrush"
Value="{DynamicResource PrimaryBrush}" />
</Style>
</Style>

<Style Selector="^:disabled">
<Setter Property="Opacity"
Value="0.4" />
</Style>

<Style Selector="^:checked">
<Setter Property="Background"
Value="{DynamicResource PrimaryBrush}" />
<Setter Property="BorderBrush"
Value="{DynamicResource DarkPrimaryBrush}" />
</Style>

<Style Selector="^:checked /template/ Ellipse">
<Setter Property="RenderTransform"
Value="scale(1)" />
<Style Selector="^ /template/ Ellipse">
<Setter Property="RenderTransform"
Value="scale(1)" />
</Style>
</Style>
</ControlTheme>

Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -17,6 +17,7 @@
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/RepeatButton.axaml" />
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/ToggleButton.axaml" />
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/RadioButton.axaml" />
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/CheckBox.axaml" />
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/Border.axaml" />
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/ItemsControl.axaml" />
<MergeResourceInclude Source="avares://HandyControl/Themes/Styles/TabItem.axaml" />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -46,11 +46,11 @@
<Style Selector="^:selected">
<Setter Property="Foreground"
Value="{DynamicResource PrimaryBrush}" />
</Style>

<Style Selector="^:selected /template/ Border#mainBorder">
<Setter Property="BorderThickness"
Value="0,0,0,2" />
<Style Selector="^ /template/ Border#mainBorder">
<Setter Property="BorderThickness"
Value="0,0,0,2" />
</Style>
</Style>
</ControlTheme>
</ResourceDictionary>
122 changes: 60 additions & 62 deletions src/Avalonia/HandyControl_Avalonia/Themes/Styles/ToggleButton.axaml
Original file line number Diff line number Diff line change
Expand Up @@ -585,34 +585,34 @@
</ControlTemplate>
</Setter>

<Style Selector="^:checked /template/ Border#thumb">
<Setter Property="RenderTransform"
Value="translateX(32px)" />
<Style Selector="^:checked">
<Style Selector="^ /template/ Border#thumb">
<Setter Property="RenderTransform"
Value="translateX(32px)" />
</Style>
<Style Selector="^ /template/ Border#lightBorder">
<Setter Property="Opacity"
Value="1" />
</Style>
<Style Selector="^ /template/ Border#innerBorder">
<Setter Property="Opacity"
Value="0" />
</Style>
</Style>

<Style Selector="^:unchecked /template/ Border#thumb">
<Setter Property="RenderTransform"
Value="translateX(0px)" />
</Style>

<Style Selector="^:checked /template/ Border#lightBorder">
<Setter Property="Opacity"
Value="1" />
</Style>

<Style Selector="^:unchecked /template/ Border#lightBorder">
<Setter Property="Opacity"
Value="0" />
</Style>

<Style Selector="^:checked /template/ Border#innerBorder">
<Setter Property="Opacity"
Value="0" />
</Style>

<Style Selector="^:unchecked /template/ Border#innerBorder">
<Setter Property="Opacity"
Value="1" />
<Style Selector="^:unchecked">
<Style Selector="^ /template/ Border#thumb">
<Setter Property="RenderTransform"
Value="translateX(0px)" />
</Style>
<Style Selector="^ /template/ Border#lightBorder">
<Setter Property="Opacity"
Value="0" />
</Style>
<Style Selector="^ /template/ Border#innerBorder">
<Setter Property="Opacity"
Value="1" />
</Style>
</Style>

<Style Selector="^:disabled">
Expand Down Expand Up @@ -703,44 +703,42 @@
</ControlTemplate>
</Setter>

<Style Selector="^:checked /template/ Border#unCheckedElement">
<Setter Property="RenderTransform"
Value="scaleX(0)" />
</Style>

<Style Selector="^:checked /template/ Border#checkedElement">
<Setter Property="RenderTransform"
Value="scaleX(1)" />
<Style Selector="^:checked">
<Style Selector="^ /template/ Border#unCheckedElement">
<Setter Property="RenderTransform"
Value="scaleX(0)" />
</Style>
<Style Selector="^ /template/ Border#checkedElement">
<Setter Property="RenderTransform"
Value="scaleX(1)" />
</Style>
<Style Selector="^ /template/ Border#unCheckedElement">
<Setter Property="Opacity"
Value="0" />
</Style>
<Style Selector="^ /template/ Border#checkedElement">
<Setter Property="Opacity"
Value="1" />
</Style>
</Style>

<Style Selector="^:unchecked /template/ Border#unCheckedElement">
<Setter Property="RenderTransform"
Value="scaleX(1)" />
</Style>

<Style Selector="^:unchecked /template/ Border#checkedElement">
<Setter Property="RenderTransform"
Value="scaleX(0)" />
</Style>

<Style Selector="^:checked /template/ Border#unCheckedElement">
<Setter Property="Opacity"
Value="0" />
</Style>

<Style Selector="^:checked /template/ Border#checkedElement">
<Setter Property="Opacity"
Value="1" />
</Style>

<Style Selector="^:unchecked /template/ Border#unCheckedElement">
<Setter Property="Opacity"
Value="1" />
</Style>

<Style Selector="^:unchecked /template/ Border#checkedElement">
<Setter Property="Opacity"
Value="0" />
<Style Selector="^:unchecked">
<Style Selector="^ /template/ Border#unCheckedElement">
<Setter Property="RenderTransform"
Value="scaleX(1)" />
</Style>
<Style Selector="^ /template/ Border#checkedElement">
<Setter Property="RenderTransform"
Value="scaleX(0)" />
</Style>
<Style Selector="^ /template/ Border#unCheckedElement">
<Setter Property="Opacity"
Value="1" />
</Style>
<Style Selector="^ /template/ Border#checkedElement">
<Setter Property="Opacity"
Value="0" />
</Style>
</Style>

<Style Selector="^:pointerover">
Expand Down
2 changes: 1 addition & 1 deletion src/Net_40/HandyControl_Net_40/Themes/Theme.xaml
Original file line number Diff line number Diff line change
Expand Up @@ -3470,7 +3470,7 @@
<Setter Property="Padding" Value="6,1" />
<Setter Property="hc:IconElement.Height" Value="12" />
</Style>
<Style x:Key="{x:Type ToggleButton}" BasedOn="{StaticResource ToggleButtonDefault}" TargetType="ToggleButton" />
<Style BasedOn="{StaticResource ToggleButtonDefault}" TargetType="ToggleButton" />
<Style x:Key="ToggleButtonPrimary" BasedOn="{StaticResource ToggleButtonBaseStyle}" TargetType="ToggleButton">
<Setter Property="Background" Value="{DynamicResource PrimaryBrush}" />
<Setter Property="BorderBrush" Value="{DynamicResource PrimaryBrush}" />
Expand Down
Original file line number Diff line number Diff line change
Expand Up @@ -22,7 +22,7 @@
<Setter Property="hc:IconElement.Height" Value="12"/>
</Style>

<Style x:Key="{x:Type ToggleButton}" BasedOn="{StaticResource ToggleButtonDefault}" TargetType="ToggleButton"/>
<Style BasedOn="{StaticResource ToggleButtonDefault}" TargetType="ToggleButton"/>

<Style x:Key="ToggleButtonPrimary" BasedOn="{StaticResource ToggleButtonBaseStyle}" TargetType="ToggleButton">
<Setter Property="Background" Value="{DynamicResource PrimaryBrush}"/>
Expand Down
Loading

0 comments on commit 9122671

Please sign in to comment.