zhaoyushun1999/Semi.Avalonia
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: ComboBox BackgroundSizing.

Browse Source
This commit is contained in:
Zhang Dian 2024-03-24 21:00:20 +08:00
parent 76c9b57a4b
commit 8142dd48cd
3 changed files with 45 additions and 69 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

95
demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml
View File

@ -4,71 +4,40 @@
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
d:DesignHeight="450" xmlns:pages="clr-namespace:Semi.Avalonia.Demo.Pages"
d:DesignHeight="800"
d:DesignWidth="800" d:DesignWidth="800"
mc:Ignorable="d"> mc:Ignorable="d">
<Design.DataContext>
<pages:ComboBoxDemoViewModel />
</Design.DataContext>
<StackPanel Spacing="20"> <StackPanel Spacing="20">
<ComboBox Width="150"> <StackPanel.Styles>
<ComboBoxItem>Ding</ComboBoxItem> <Style Selector="ComboBox">
<ComboBoxItem>Otter</ComboBoxItem> <Setter Property="Width" Value="300" />
<ComboBoxItem>Husky</ComboBoxItem> <Setter Property="ItemsSource" Value="{Binding Items}" />
<ComboBoxItem>Mr. 17</ComboBoxItem> </Style>
<ComboBoxItem>Cass</ComboBoxItem> </StackPanel.Styles>
</ComboBox>
<ComboBox Width="150" Classes="ClearButton"> <ComboBox />
<ComboBoxItem>Ding</ComboBoxItem> <ComboBox Classes="ClearButton" />
<ComboBoxItem>Otter</ComboBoxItem> <ComboBox PlaceholderText="Please Select" />
<ComboBoxItem>Husky</ComboBoxItem> <ComboBox IsEnabled="False" />
<ComboBoxItem>Mr. 17</ComboBoxItem> <ComboBox Classes="Large" IsEnabled="False" />
<ComboBoxItem>Cass</ComboBoxItem> <ComboBox Classes="Small" />
</ComboBox> <ComboBox Classes="Bordered" />
<ComboBox Width="150" PlaceholderText="Please Select"> <ComboBox Classes="Bordered" IsEnabled="False" />
<ComboBoxItem>Ding</ComboBoxItem>
<ComboBoxItem>Otter</ComboBoxItem> <StackPanel Orientation="Horizontal">
<ComboBoxItem>Husky</ComboBoxItem> <ComboBox Width="100" Classes="Large" PlaceholderText="Large" />
<ComboBoxItem>Mr. 17</ComboBoxItem> <ComboBox Width="100" PlaceholderText="Default" />
<ComboBoxItem>Cass</ComboBoxItem> <ComboBox Width="100" Classes="Small" PlaceholderText="Small" />
</ComboBox> </StackPanel>
<ComboBox Width="150" IsEnabled="False">
<ComboBoxItem>Ding</ComboBoxItem> <StackPanel Orientation="Horizontal">
<ComboBoxItem>Otter</ComboBoxItem> <ComboBox Width="100" IsEnabled="False" PlaceholderText="Disabled" />
<ComboBoxItem>Husky</ComboBoxItem> <ComboBox Width="100" Classes="Bordered" PlaceholderText="Bordered" />
<ComboBoxItem>Mr. 17</ComboBoxItem> <ComboBox Width="100" Classes="Bordered" IsEnabled="False" />
<ComboBoxItem>Cass</ComboBoxItem> </StackPanel>
</ComboBox>
<ComboBox
Width="150"
Classes="Large"
IsEnabled="False">
<ComboBoxItem>Ding</ComboBoxItem>
<ComboBoxItem>Otter</ComboBoxItem>
<ComboBoxItem>Husky</ComboBoxItem>
<ComboBoxItem>Mr. 17</ComboBoxItem>
<ComboBoxItem>Cass</ComboBoxItem>
</ComboBox>
<ComboBox Width="150" Classes="Small">
<ComboBoxItem>Ding</ComboBoxItem>
<ComboBoxItem>Otter</ComboBoxItem>
<ComboBoxItem>Husky</ComboBoxItem>
<ComboBoxItem>Mr. 17</ComboBoxItem>
<ComboBoxItem>Cass</ComboBoxItem>
</ComboBox>
<ComboBox Width="150" Classes="Bordered">
<ComboBoxItem>Ding</ComboBoxItem>
<ComboBoxItem>Otter</ComboBoxItem>
<ComboBoxItem>Husky</ComboBoxItem>
<ComboBoxItem>Mr. 17</ComboBoxItem>
<ComboBoxItem>Cass</ComboBoxItem>
</ComboBox>
<ComboBox
Width="150"
Classes="Bordered"
IsEnabled="False">
<ComboBoxItem>Ding</ComboBoxItem>
<ComboBoxItem>Otter</ComboBoxItem>
<ComboBoxItem>Husky</ComboBoxItem>
<ComboBoxItem>Mr. 17</ComboBoxItem>
<ComboBoxItem>Cass</ComboBoxItem>
</ComboBox>
</StackPanel> </StackPanel>
</UserControl> </UserControl>

10
demo/Semi.Avalonia.Demo/Pages/ComboBoxDemo.axaml.cs
View File

@ -1,6 +1,6 @@
using Avalonia; using System.Collections.ObjectModel;
using Avalonia.Controls; using Avalonia.Controls;
using Avalonia.Markup.Xaml; using CommunityToolkit.Mvvm.ComponentModel;
namespace Semi.Avalonia.Demo.Pages; namespace Semi.Avalonia.Demo.Pages;
@ -9,5 +9,11 @@ public partial class ComboBoxDemo : UserControl
public ComboBoxDemo() public ComboBoxDemo()
{ {
InitializeComponent(); InitializeComponent();
this.DataContext = new ComboBoxDemoViewModel();
} }
}
public class ComboBoxDemoViewModel : ObservableObject
{
public ObservableCollection<string> Items { get; set; } = ["Ding", "Otter", "Husky", "Mr.17", "Cass"];
} }

9
src/Semi.Avalonia/Controls/ComboBox.axaml
View File

@ -32,6 +32,7 @@
<Setter Property="FocusAdorner" Value="{x:Null}" /> <Setter Property="FocusAdorner" Value="{x:Null}" />
<Setter Property="MaxDropDownHeight" Value="504" /> <Setter Property="MaxDropDownHeight" Value="504" />
<Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBackground}" /> <Setter Property="Background" Value="{DynamicResource ComboBoxSelectorBackground}" />
<Setter Property="BackgroundSizing" Value="OuterBorderEdge" />
<Setter Property="BorderThickness" Value="1" /> <Setter Property="BorderThickness" Value="1" />
<Setter Property="Cursor" Value="Hand" /> <Setter Property="Cursor" Value="Hand" />
<Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" /> <Setter Property="CornerRadius" Value="{DynamicResource ComboBoxSelectorCornerRadius}" />
@ -41,6 +42,7 @@
<Setter Property="VerticalContentAlignment" Value="Center" /> <Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="HorizontalAlignment" Value="Left" /> <Setter Property="HorizontalAlignment" Value="Left" />
<Setter Property="VerticalAlignment" Value="Top" /> <Setter Property="VerticalAlignment" Value="Top" />
<Setter Property="MinHeight" Value="{DynamicResource ComboBoxDefaultHeight}" />
<Setter Property="Template"> <Setter Property="Template">
<ControlTemplate TargetType="ComboBox"> <ControlTemplate TargetType="ComboBox">
<DataValidationErrors> <DataValidationErrors>
@ -49,9 +51,8 @@
x:Name="Background" x:Name="Background"
Grid.Column="0" Grid.Column="0"
Grid.ColumnSpan="3" Grid.ColumnSpan="3"
MinWidth="{DynamicResource ComboBoxThemeMinWidth}"
MinHeight="{DynamicResource ComboBoxDefaultHeight}"
Background="{TemplateBinding Background}" Background="{TemplateBinding Background}"
BackgroundSizing="{TemplateBinding BackgroundSizing}"
BorderBrush="{TemplateBinding BorderBrush}" BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}" BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}" /> CornerRadius="{TemplateBinding CornerRadius}" />
@ -147,10 +148,10 @@
</Style> </Style>
</Style> </Style>
<Style Selector="^.Large /template/ Border#Background"> <Style Selector="^.Large">
<Setter Property="MinHeight" Value="{DynamicResource ComboBoxLargeHeight}" /> <Setter Property="MinHeight" Value="{DynamicResource ComboBoxLargeHeight}" />
</Style> </Style>
<Style Selector="^.Small /template/ Border#Background"> <Style Selector="^.Small">
<Setter Property="MinHeight" Value="{DynamicResource ComboBoxSmallHeight}" /> <Setter Property="MinHeight" Value="{DynamicResource ComboBoxSmallHeight}" />
</Style> </Style>