feat: add checkbox border style

This commit is contained in:
rabbitism
2023-03-17 23:12:24 +08:00
parent 4b7920909c
commit f0d0ed918a
4 changed files with 269 additions and 15 deletions

View File

@@ -7,18 +7,76 @@
d:DesignHeight="450"
d:DesignWidth="800"
mc:Ignorable="d">
<StackPanel Spacing="20">
<CheckBox>Unchecked</CheckBox>
<CheckBox IsEnabled="False">Unchecked</CheckBox>
<CheckBox IsChecked="True">Checked</CheckBox>
<CheckBox IsChecked="True" IsEnabled="False">Checked</CheckBox>
<CheckBox IsChecked="{x:Null}" IsThreeState="True">Indeterminate</CheckBox>
<CheckBox
IsChecked="{x:Null}"
IsEnabled="False"
IsThreeState="True">
Indeterminate
</CheckBox>
<CheckBox Width="120">Checkbox should wrap its text</CheckBox>
</StackPanel>
<ScrollViewer>
<StackPanel HorizontalAlignment="Left">
<CheckBox>Unchecked</CheckBox>
<CheckBox IsEnabled="False">Unchecked</CheckBox>
<CheckBox IsChecked="True">Checked</CheckBox>
<CheckBox IsChecked="True" IsEnabled="False">Checked</CheckBox>
<CheckBox IsChecked="{x:Null}" IsThreeState="True">Indeterminate</CheckBox>
<CheckBox
IsChecked="{x:Null}"
IsEnabled="False"
IsThreeState="True">
Indeterminate
</CheckBox>
<CheckBox Width="120">Checkbox should wrap its text</CheckBox>
<CheckBox Width="300" Theme="{DynamicResource CardCheckBox}">
<StackPanel>
<TextBlock FontWeight="Bold">复选框标题</TextBlock>
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
</StackPanel>
</CheckBox>
<CheckBox
Width="300"
IsChecked="True"
Theme="{DynamicResource CardCheckBox}">
<StackPanel>
<TextBlock FontWeight="Bold">复选框标题</TextBlock>
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
</StackPanel>
</CheckBox>
<CheckBox
Width="300"
IsEnabled="False"
Theme="{DynamicResource CardCheckBox}">
<StackPanel>
<TextBlock FontWeight="Bold">复选框标题</TextBlock>
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
</StackPanel>
</CheckBox>
<CheckBox
Width="300"
IsChecked="True"
IsEnabled="False"
Theme="{DynamicResource CardCheckBox}">
<StackPanel>
<TextBlock FontWeight="Bold">复选框标题</TextBlock>
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
</StackPanel>
</CheckBox>
<CheckBox
Width="300"
IsChecked="{x:Null}"
IsEnabled="True"
IsThreeState="True"
Theme="{DynamicResource CardCheckBox}">
<StackPanel>
<TextBlock FontWeight="Bold">复选框标题</TextBlock>
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
</StackPanel>
</CheckBox>
<CheckBox
Width="300"
IsChecked="{x:Null}"
IsEnabled="False"
IsThreeState="True"
Theme="{DynamicResource CardCheckBox}">
<StackPanel>
<TextBlock FontWeight="Bold">复选框标题</TextBlock>
<TextBlock TextWrapping="Wrap">Semi Design 是由互娱社区前端团队与 UED 团队共同设计开发并维护的设计系统</TextBlock>
</StackPanel>
</CheckBox>
</StackPanel>
</ScrollViewer>
</UserControl>