zhusenlin/Semi.Avalonia
1
0
Fork 0
mirror of https://gitcode.com/gh_mirrors/se/Semi.Avalonia synced 2026-04-09 02:36:34 +08:00
Code Issues Packages Projects Releases Wiki Activity

feat: AutoCompleteBox new theme.

Browse Source
This commit is contained in:
rabbitism
2023-02-15 16:17:49 +08:00
parent 3ecebc0387
commit 7762eff214
4 changed files with 48 additions and 30 deletions
Download Patch File Download Diff File Expand all files Collapse all files

12
demo/Semi.Avalonia.Demo/Pages/AutoCompleteBoxDemo.axaml
View File

@@ -25,8 +25,18 @@
</AutoCompleteBox.ItemTemplate> </AutoCompleteBox.ItemTemplate>
</AutoCompleteBox> </AutoCompleteBox>
<AutoCompleteBox <AutoCompleteBox
Classes="Bordered"
Items="{Binding States}"
ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
<AutoCompleteBox.ItemTemplate>
<DataTemplate DataType="local:StateData">
<TextBlock Text="{Binding Name}" />
</DataTemplate>
</AutoCompleteBox.ItemTemplate>
</AutoCompleteBox>
<AutoCompleteBox
IsEnabled="False"
Items="{Binding States}" Items="{Binding States}"
Theme="{StaticResource BorderlessAutoCompleteBox}"
ValueMemberBinding="{Binding Name, x:DataType=local:StateData}"> ValueMemberBinding="{Binding Name, x:DataType=local:StateData}">
<AutoCompleteBox.ItemTemplate> <AutoCompleteBox.ItemTemplate>
<DataTemplate DataType="local:StateData"> <DataTemplate DataType="local:StateData">

58
src/Semi.Avalonia/Controls/AutoCompleteBox.axaml
View File

@@ -6,23 +6,14 @@
</StackPanel> </StackPanel>
</Design.PreviewWith> </Design.PreviewWith>
<ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox"> <ControlTheme x:Key="{x:Type AutoCompleteBox}" TargetType="AutoCompleteBox">
<Setter Property="Background" Value="{DynamicResource AutoCompleteBoxDefaultBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource AutoCompleteBoxDefaultBorderBrush}" />
<Setter Property="CornerRadius" Value="{DynamicResource AutoCompleteBoxCornerRadius}" />
<Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="600" /> <Setter Property="AutoCompleteBox.MaxDropDownHeight" Value="600" />
<Setter Property="BorderThickness" Value="1" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate TargetType="AutoCompleteBox"> <ControlTemplate TargetType="AutoCompleteBox">
<Panel> <Panel>
<TextBox <TextBox
Name="PART_TextBox" Name="PART_TextBox"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}"
DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}" DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
Watermark="{TemplateBinding Watermark}" /> Watermark="{TemplateBinding Watermark}" />
<Popup <Popup
Name="PART_Popup" Name="PART_Popup"
MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}" MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
@@ -48,18 +39,43 @@
</Panel> </Panel>
</ControlTemplate> </ControlTemplate>
</Setter> </Setter>
<Style Selector="^.Bordered">
<Setter Property="Template">
<ControlTemplate TargetType="AutoCompleteBox">
<Panel>
<TextBox
Name="PART_TextBox"
Classes="Bordered"
DataValidationErrors.Errors="{TemplateBinding (DataValidationErrors.Errors)}"
Watermark="{TemplateBinding Watermark}" />
<Popup
Name="PART_Popup"
MinWidth="{Binding Bounds.Width, RelativeSource={RelativeSource TemplatedParent}}"
MaxHeight="{TemplateBinding MaxDropDownHeight}"
IsLightDismissEnabled="True"
PlacementTarget="{TemplateBinding}">
<Border
Margin="{DynamicResource AutoCompleteBoxPopupMargin}"
HorizontalAlignment="Stretch"
Background="{DynamicResource AutoCompleteBoxPopupBackground}"
BorderBrush="{DynamicResource AutoCompleteBoxPopupBorderBrush}"
BorderThickness="{DynamicResource AutoCompleteBoxPopupBorderThickness}"
BoxShadow="{DynamicResource AutoCompleteBoxPopupBoxShadow}"
CornerRadius="{DynamicResource AutoCompleteBoxPopupCornerRadius}">
<ListBox
Name="PART_SelectingItemsControl"
Foreground="{TemplateBinding Foreground}"
ItemTemplate="{TemplateBinding ItemTemplate}"
ScrollViewer.HorizontalScrollBarVisibility="Auto"
ScrollViewer.VerticalScrollBarVisibility="Auto" />
</Border>
</Popup>
</Panel>
</ControlTemplate>
</Setter>
</Style>
</ControlTheme> </ControlTheme>
<ControlTheme
x:Key="BorderlessAutoCompleteBox"
BasedOn="{StaticResource {x:Type AutoCompleteBox}}"
TargetType="AutoCompleteBox">
<ControlTheme.Children>
<Style Selector="^ /template/ TextBox#PART_TextBox">
<Setter Property="Theme" Value="{DynamicResource BorderlessTextBox}" />
</Style>
</ControlTheme.Children>
<Setter Property="Background" Value="{DynamicResource AutoCompleteBoxBorderlessBackground}" />
<Setter Property="BorderBrush" Value="{DynamicResource AutoCompleteBoxBorderlessBorderBrush}" />
</ControlTheme>
</ResourceDictionary> </ResourceDictionary>

4
src/Semi.Avalonia/Themes/Dark/AutoCompleteBox.axaml
View File

@@ -1,13 +1,9 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<SolidColorBrush x:Key="AutoCompleteBoxDefaultBorderBrush" Color="#41464C" />
<SolidColorBrush x:Key="AutoCompleteBoxDefaultBackground" Color="Transparent" />
<BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1AFFFFFF</BoxShadows> <BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1AFFFFFF</BoxShadows>
<SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="#35363C" /> <SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="#35363C" />
<SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#F9F9F9" /> <SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#F9F9F9" />
<Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness> <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
<Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness> <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
<CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius> <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
<SolidColorBrush x:Key="AutoCompleteBoxBorderlessBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="AutoCompleteBoxBorderlessBackground" Opacity="0.05" Color="#E6E8EA" />
<CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius> <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
</ResourceDictionary> </ResourceDictionary>

4
src/Semi.Avalonia/Themes/Light/AutoCompleteBox.axaml
View File

@@ -1,13 +1,9 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"> <ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<SolidColorBrush x:Key="AutoCompleteBoxDefaultBorderBrush" Color="#C6CACD" />
<SolidColorBrush x:Key="AutoCompleteBoxDefaultBackground" Color="Transparent" />
<BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1A000000</BoxShadows> <BoxShadows x:Key="AutoCompleteBoxPopupBoxShadow">0 0 8 0 #1A000000</BoxShadows>
<SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="White" /> <SolidColorBrush x:Key="AutoCompleteBoxPopupBackground" Color="White" />
<SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#1C1F23" /> <SolidColorBrush x:Key="AutoCompleteBoxPopupBorderBrush" Opacity="0.08" Color="#1C1F23" />
<Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness> <Thickness x:Key="AutoCompleteBoxPopupBorderThickness">1</Thickness>
<Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness> <Thickness x:Key="AutoCompleteBoxPopupMargin">4</Thickness>
<CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius> <CornerRadius x:Key="AutoCompleteBoxPopupCornerRadius">6</CornerRadius>
<SolidColorBrush x:Key="AutoCompleteBoxBorderlessBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="AutoCompleteBoxBorderlessBackground" Opacity="0.05" Color="#2E3238" />
<CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius> <CornerRadius x:Key="AutoCompleteBoxCornerRadius">3</CornerRadius>
</ResourceDictionary> </ResourceDictionary>