chore: add avalonia ListBox demo.

2025-02-08 17:37:58 +08:00
1 parent 98b67b3fd5
commit 29cf68d8ec
@@ -12,6 +12,36 @@ namespace HandyControlDemo.Service;

 public class DataService
 {
+    internal List<DemoDataModel> GetDemoDataList()
+    {
+        var list = new List<DemoDataModel>();
+        for (int i = 1; i <= 20; i++)
+        {
+            var dataList = new List<DemoDataModel>();
+            for (int j = 0; j < 3; j++)
+            {
+                dataList.Add(new DemoDataModel
+                {
+                    Index = j, IsSelected = j % 2 == 0, Name = $"SubName{j}", Type = (DemoType)j
+                });
+            }
+
+            var model = new DemoDataModel
+            {
+                Index = i,
+                IsSelected = i % 2 == 0,
+                Name = $"Name{i}",
+                Type = (DemoType)(i % 6 + 1),
+                DataList = dataList,
+                ImgPath = $"/HandyControlDemo;component/Resources/Img/Avatar/avatar{i % 6 + 1}.png",
+                Remark = new string(i.ToString()[0], 10)
+            };
+            list.Add(model);
+        }
+
+        return list;
+    }
+
    internal List<DemoInfoModel> GetDemoInfo()
    {
        var infoList = new List<DemoInfoModel>();
@@ -0,0 +1,25 @@
+<UserControl xmlns="https://github.com/avaloniaui"
+             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+             x:Class="HandyControlDemo.UserControl.ListBoxDemo">
+    <WrapPanel Margin="16">
+        <ListBox Margin="16"
+                 Width="200"
+                 ItemsSource="{Binding DataList}">
+            <ListBox.ItemTemplate>
+                <DataTemplate>
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </ListBox.ItemTemplate>
+        </ListBox>
+        <ListBox Margin="16"
+                 Width="200"
+                 ItemsSource="{Binding DataList}"
+                 Theme="{StaticResource ListBox.Small}">
+            <ListBox.ItemTemplate>
+                <DataTemplate>
+                    <TextBlock Text="{Binding Name}" />
+                </DataTemplate>
+            </ListBox.ItemTemplate>
+        </ListBox>
+    </WrapPanel>
+</UserControl>
@@ -0,0 +1,9 @@
+namespace HandyControlDemo.UserControl;
+
+public partial class ListBoxDemo : Avalonia.Controls.UserControl
+{
+    public ListBoxDemo()
+    {
+        InitializeComponent();
+    }
+}
@@ -76,11 +76,20 @@ public class MainViewModel : DemoViewModelBase<DemoDataModel>

        //load items
        DemoInfoCollection = [];
-        foreach (var item in _dataService.GetDemoInfo())
+        Dispatcher.UIThread.InvokeAsync(() =>
        {
-            Dispatcher.UIThread.InvokeAsync(() => DemoInfoCollection.Add(item));
-        }
-        Dispatcher.UIThread.InvokeAsync(() => SwitchDemo(DemoInfoCollection.First().DemoItemList.First()));
+            DataList = _dataService.GetDemoDataList();
+
+            foreach (var item in _dataService.GetDemoInfo())
+            {
+                DemoInfoCollection.Add(item);
+            }
+
+            if (DemoInfoCollection.Any() && DemoInfoCollection.First().DemoItemList.Any())
+            {
+                SwitchDemo(DemoInfoCollection.First().DemoItemList.First());
+            }
+        });
    }

    private void SwitchDemo(DemoItemModel item)
@@ -1,6 +1,58 @@
 <ResourceDictionary xmlns="https://github.com/avaloniaui"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
-    <ControlTheme x:Key="{x:Type ListBox}"
+                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
+                    xmlns:hc="clr-namespace:HandyControl.Controls">
+    <ControlTheme x:Key="ListBoxItemBaseStyle"
+                  TargetType="ListBoxItem">
+        <Setter Property="Padding"
+                Value="10,0" />
+        <Setter Property="MinHeight"
+                Value="{StaticResource DefaultControlHeight}" />
+        <Setter Property="VerticalContentAlignment"
+                Value="Center" />
+        <Setter Property="Background"
+                Value="{DynamicResource RegionBrush}" />
+        <Setter Property="BorderBrush"
+                Value="Transparent" />
+        <Setter Property="CornerRadius"
+                Value="{Binding $self.(hc:BorderElement.CornerRadius)}" />
+        <Setter Property="BorderThickness"
+                Value="0" />
+        <Setter Property="Margin"
+                Value="0,0,0,2" />
+        <Setter Property="Template">
+            <ControlTemplate>
+                <ContentPresenter Name="PART_ContentPresenter"
+                                  Padding="{TemplateBinding Padding}"
+                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
+                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
+                                  Background="{TemplateBinding Background}"
+                                  BorderBrush="{TemplateBinding BorderBrush}"
+                                  BorderThickness="{TemplateBinding BorderThickness}"
+                                  Content="{TemplateBinding Content}"
+                                  ContentTemplate="{TemplateBinding ContentTemplate}"
+                                  CornerRadius="{TemplateBinding CornerRadius}" />
+            </ControlTemplate>
+        </Setter>
+
+        <Style Selector="^:pointerover /template/ ContentPresenter">
+            <Setter Property="Background"
+                    Value="{DynamicResource SecondaryRegionBrush}" />
+        </Style>
+
+        <Style Selector="^:selected /template/ ContentPresenter">
+            <Setter Property="Background"
+                    Value="{DynamicResource PrimaryBrush}" />
+            <Setter Property="Foreground"
+                    Value="{DynamicResource TextIconBrush}" />
+        </Style>
+
+        <Style Selector="^:disabled">
+            <Setter Property="Opacity"
+                    Value="0.4" />
+        </Style>
+    </ControlTheme>
+
+    <ControlTheme x:Key="ListBoxBaseStyle"
                  TargetType="ListBox">
        <Setter Property="Background"
                Value="{DynamicResource RegionBrush}" />
@@ -11,23 +63,27 @@
        <Setter Property="CornerRadius"
                Value="{StaticResource DefaultCornerRadius}" />
        <Setter Property="Padding"
-                Value="4" />
+                Value="2,2,2,0" />
        <Setter Property="ScrollViewer.HorizontalScrollBarVisibility"
                Value="Auto" />
        <Setter Property="ScrollViewer.VerticalScrollBarVisibility"
                Value="Auto" />
        <Setter Property="ScrollViewer.IsScrollChainingEnabled"
                Value="True" />
+        <Setter Property="ItemContainerTheme"
+                Value="{StaticResource ListBoxItemBaseStyle}" />
+        <Setter Property="hc:BorderElement.CornerRadius"
+                Value="{StaticResource DefaultCornerRadius}" />
        <Setter Property="Template">
            <ControlTemplate>
                <Border Name="border"
                        BorderBrush="{TemplateBinding BorderBrush}"
                        BorderThickness="{TemplateBinding BorderThickness}"
+                        Background="{TemplateBinding Background}"
                        CornerRadius="{TemplateBinding CornerRadius}">
                    <ScrollViewer Name="PART_ScrollViewer"
                                  AllowAutoHide="{TemplateBinding (ScrollViewer.AllowAutoHide)}"
                                  BringIntoViewOnFocusChange="{TemplateBinding (ScrollViewer.BringIntoViewOnFocusChange)}"
-                                  Background="{TemplateBinding Background}"
                                  HorizontalScrollBarVisibility="{TemplateBinding (ScrollViewer.HorizontalScrollBarVisibility)}"
                                  IsScrollChainingEnabled="{TemplateBinding (ScrollViewer.IsScrollChainingEnabled)}"
                                  IsDeferredScrollingEnabled="{TemplateBinding (ScrollViewer.IsDeferredScrollingEnabled)}"
@@ -42,4 +98,24 @@
            </ControlTemplate>
        </Setter>
    </ControlTheme>
+
+    <ControlTheme x:Key="{x:Type ListBox}"
+                  BasedOn="{StaticResource ListBoxBaseStyle}"
+                  TargetType="ListBox" />
+
+    <ControlTheme x:Key="ListBoxItemBaseStyle.Small"
+                  BasedOn="{StaticResource ListBoxItemBaseStyle}"
+                  TargetType="ListBoxItem">
+        <Setter Property="Padding"
+                Value="6,0" />
+        <Setter Property="MinHeight"
+                Value="24" />
+    </ControlTheme>
+
+    <ControlTheme x:Key="ListBox.Small"
+                  BasedOn="{StaticResource ListBoxBaseStyle}"
+                  TargetType="ListBox">
+        <Setter Property="ItemContainerTheme"
+                Value="{StaticResource ListBoxItemBaseStyle.Small}" />
+    </ControlTheme>
 </ResourceDictionary>
@@ -1,49 +0,0 @@
-<ResourceDictionary xmlns="https://github.com/avaloniaui"
-                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
-                    xmlns:hc="clr-namespace:HandyControl.Controls">
-    <ControlTheme x:Key="{x:Type ListBoxItem}"
-                  TargetType="ListBoxItem">
-        <Setter Property="Padding"
-                Value="10,0" />
-        <Setter Property="MinHeight"
-                Value="{StaticResource DefaultControlHeight}" />
-        <Setter Property="VerticalContentAlignment"
-                Value="Center" />
-        <Setter Property="Background"
-                Value="{DynamicResource RegionBrush}" />
-        <Setter Property="BorderBrush"
-                Value="Transparent" />
-        <Setter Property="CornerRadius"
-                Value="{StaticResource DefaultCornerRadius}" />
-        <Setter Property="BorderThickness"
-                Value="0" />
-        <Setter Property="Margin"
-                Value="0,0,0,2" />
-        <Setter Property="Template">
-            <ControlTemplate>
-                <ContentPresenter Name="PART_ContentPresenter"
-                                  Padding="{TemplateBinding Padding}"
-                                  HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
-                                  VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
-                                  Background="{TemplateBinding Background}"
-                                  BorderBrush="{TemplateBinding BorderBrush}"
-                                  BorderThickness="{TemplateBinding BorderThickness}"
-                                  Content="{TemplateBinding Content}"
-                                  ContentTemplate="{TemplateBinding ContentTemplate}"
-                                  CornerRadius="{TemplateBinding CornerRadius}" />
-            </ControlTemplate>
-        </Setter>
-
-        <Style Selector="^:pointerover /template/ ContentPresenter">
-            <Setter Property="Background"
-                    Value="{DynamicResource SecondaryRegionBrush}" />
-        </Style>
-
-        <Style Selector="^:selected /template/ ContentPresenter">
-            <Setter Property="Background"
-                    Value="{DynamicResource PrimaryBrush}" />
-            <Setter Property="Foreground"
-                    Value="{DynamicResource TextIconBrush}" />
-        </Style>
-    </ControlTheme>
-</ResourceDictionary>
@@ -28,7 +28,6 @@
                <MergeResourceInclude Source="/Themes/Styles/ItemsControl.axaml" />
                <MergeResourceInclude Source="/Themes/Styles/TabItem.axaml" />
                <MergeResourceInclude Source="/Themes/Styles/TabControl.axaml" />
-                <MergeResourceInclude Source="/Themes/Styles/ListBoxItem.axaml" />
                <MergeResourceInclude Source="/Themes/Styles/ScrollViewer.axaml" />
                <MergeResourceInclude Source="/Themes/Styles/ListBox.axaml" />
                <MergeResourceInclude Source="/Themes/Styles/Label.axaml" />