zhusenlin/Semi.Avalonia
1
0
Fork 0
mirror of https://gitcode.com/gh_mirrors/se/Semi.Avalonia synced 2026-03-02 15:50:49 +08:00
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #572 from irihitech/tree

Browse Source 
enhance TreeDataGrid
This commit is contained in:
Dong Bin
2025-03-18 22:43:08 +08:00
committed by GitHub
parent 3b41331c67 a796cb828b
commit 992017951b
8 changed files with 55 additions and 69 deletions
Download Patch File Download Diff File Expand all files Collapse all files

8
demo/Semi.Avalonia.TreeDataGrid.Demo/Converters/FileIconConverter.cs
View File

@@ -3,15 +3,13 @@ using System.Collections.Generic;
using System.Globalization;
using Avalonia;
using Avalonia.Data.Converters;
using Avalonia.Media;
using Avalonia.Metadata;
namespace Semi.Avalonia.TreeDataGrid.Demo.Converters;
public class FileIconConverter: IMultiValueConverter
public class FileIconConverter : IMultiValueConverter
{
[Content]
public Dictionary<string, PathGeometry> Items { get; set; } = new Dictionary<string, PathGeometry>();
[Content] public IDictionary<string, object?> Items { get; } = new Dictionary<string, object?>();
public object? Convert(IList<object?> values, Type targetType, object? parameter, CultureInfo culture)
{
@@ -21,8 +19,10 @@ public class FileIconConverter: IMultiValueConverter
{
return Items["file"];
}
return isOpen ? Items["folderOpen"] : Items["folderClosed"];
}
return AvaloniaProperty.UnsetValue;
}
}

18
demo/Semi.Avalonia.TreeDataGrid.Demo/MainWindow.axaml
View File

@@ -13,9 +13,9 @@
mc:Ignorable="d">
<Window.Resources>
<converters:FileIconConverter x:Key="FileIconConverter">
<PathGeometry x:Key="file">M14,2H6A2,2 0 0,0 4,4V20A2,2 0 0,0 6,22H18A2,2 0 0,0 20,20V8L14,2M18,20H6V4H13V9H18V20Z</PathGeometry>
<PathGeometry x:Key="folderOpen">M6.1,10L4,18V8H21A2,2 0 0,0 19,6H12L10,4H4A2,2 0 0,0 2,6V18A2,2 0 0,0 4,20H19C19.9,20 20.7,19.4 20.9,18.5L23.2,10H6.1M19,18H6L7.6,12H20.6L19,18Z</PathGeometry>
<PathGeometry x:Key="folderClosed">M20,18H4V8H20M20,6H12L10,4H4C2.89,4 2,4.89 2,6V18A2,2 0 0,0 4,20H20A2,2 0 0,0 22,18V8C22,6.89 21.1,6 20,6Z</PathGeometry>
<StaticResource x:Key="file" ResourceKey="SemiIconFile" />
<StaticResource x:Key="folderOpen" ResourceKey="SemiIconFolderOpen" />
<StaticResource x:Key="folderClosed" ResourceKey="SemiIconFolder" />
</converters:FileIconConverter>
</Window.Resources>
<Grid RowDefinitions="Auto, *">
@@ -58,7 +58,7 @@
</TreeDataGrid.Resources>
<TreeDataGrid.Styles>
<Style Selector="TreeDataGrid TreeDataGridRow:nth-last-child(2n)">
<Setter Property="Background" Value="#20808080" />
<Setter Property="Background" Value="{DynamicResource SemiColorFill0}" />
</Style>
</TreeDataGrid.Styles>
</TreeDataGrid>
@@ -86,10 +86,8 @@
<DataTemplate x:Key="FileNameCell" DataType="vm:FileNodeViewModel">
<StackPanel Orientation="Horizontal">
<PathIcon
Width="16"
Height="16"
Margin="8,0"
VerticalAlignment="Center">
Theme="{StaticResource InnerPathIcon}"
Margin="8,0">
<PathIcon.Data>
<MultiBinding Converter="{StaticResource FileIconConverter}">
<Binding Path="IsDirectory" />
@@ -127,7 +125,7 @@
</TreeDataGrid.Resources>
<TreeDataGrid.Styles>
<Style Selector="TreeDataGrid TreeDataGridRow:nth-child(2n)">
<Setter Property="Background" Value="#20808080" />
<Setter Property="Background" Value="{DynamicResource SemiColorFill0}" />
</Style>
</TreeDataGrid.Styles>
</TreeDataGrid>
@@ -135,4 +133,4 @@
</TabItem>
</TabControl>
</Grid>
</Window>
</Window>

16
src/Semi.Avalonia.TreeDataGrid/Dark.axaml
View File

@@ -1,11 +1,11 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<SolidColorBrush x:Key="TreeDataGridGridLinesBrush" Opacity="0.08" Color="White" />
<SolidColorBrush x:Key="TreeDataGridHeaderPointerOverBackground" Opacity="0.16" Color="White" />
<SolidColorBrush x:Key="TreeDataGridHeaderPressedBackground" Opacity="0.20" Color="White" />
<StaticResource x:Key="TreeDataGridGridLinesBrush" ResourceKey="SemiColorBorder" />
<StaticResource x:Key="TreeDataGridHeaderPointerOverBackground" ResourceKey="SemiColorFill1" />
<StaticResource x:Key="TreeDataGridHeaderPressedBackground" ResourceKey="SemiColorFill2" />
<SolidColorBrush x:Key="TreeDataGridHeaderPointerOverBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TreeDataGridHeaderPressedBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TreeDataGridHeaderPointerOverForeground" Opacity="0.8" Color="#F9F9F9" />
<SolidColorBrush x:Key="TreeDataGridHeaderPressedForeground" Opacity="1" Color="#F9F9F9" />
<SolidColorBrush x:Key="TreeDataGridCellSelectedBackground" Opacity="0.2" Color="#FF54A9FF" />
<SolidColorBrush x:Key="TreeDataGridColumnHeaderForeground" Opacity="0.6" Color="#F9F9F9" />
</ResourceDictionary>
<StaticResource x:Key="TreeDataGridHeaderPointerOverForeground" ResourceKey="SemiColorText1" />
<StaticResource x:Key="TreeDataGridHeaderPressedForeground" ResourceKey="SemiColorText0" />
<StaticResource x:Key="TreeDataGridCellSelectedBackground" ResourceKey="SemiColorPrimaryLight" />
<StaticResource x:Key="TreeDataGridColumnHeaderForeground" ResourceKey="SemiColorText2" />
</ResourceDictionary>

16
src/Semi.Avalonia.TreeDataGrid/Light.axaml
View File

@@ -1,11 +1,11 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<SolidColorBrush x:Key="TreeDataGridGridLinesBrush" Opacity="0.08" Color="#1C1F23" />
<SolidColorBrush x:Key="TreeDataGridHeaderPointerOverBackground" Opacity="0.09" Color="#2E3238" />
<SolidColorBrush x:Key="TreeDataGridHeaderPressedBackground" Opacity="0.13" Color="#2E3238" />
<StaticResource x:Key="TreeDataGridGridLinesBrush" ResourceKey="SemiColorBorder" />
<StaticResource x:Key="TreeDataGridHeaderPointerOverBackground" ResourceKey="SemiColorFill1" />
<StaticResource x:Key="TreeDataGridHeaderPressedBackground" ResourceKey="SemiColorFill2" />
<SolidColorBrush x:Key="TreeDataGridHeaderPointerOverBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TreeDataGridHeaderPressedBorderBrush" Color="Transparent" />
<SolidColorBrush x:Key="TreeDataGridHeaderPointerOverForeground" Opacity="0.8" Color="#1C1F23" />
<SolidColorBrush x:Key="TreeDataGridHeaderPressedForeground" Opacity="1" Color="#1C1F23" />
<SolidColorBrush x:Key="TreeDataGridCellSelectedBackground" Color="#EAF5FF" />
<SolidColorBrush x:Key="TreeDataGridColumnHeaderForeground" Opacity="0.62" Color="#1C1F23" />
</ResourceDictionary>
<StaticResource x:Key="TreeDataGridHeaderPointerOverForeground" ResourceKey="SemiColorText1" />
<StaticResource x:Key="TreeDataGridHeaderPressedForeground" ResourceKey="SemiColorText0" />
<StaticResource x:Key="TreeDataGridCellSelectedBackground" ResourceKey="SemiColorPrimaryLight" />
<StaticResource x:Key="TreeDataGridColumnHeaderForeground" ResourceKey="SemiColorText2" />
</ResourceDictionary>

16
src/Semi.Avalonia.TreeDataGrid/Shared.axaml
View File

@@ -1,9 +1,11 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StreamGeometry x:Key="TreeDataGridSortIconAscendingPath">m6.45 8.34 4.8-5.48a1 1 0 0 1 1.5 0l4.8 5.48A1 1 0 0 1 16.8 10H7.2a1 1 0 0 1-.75-1.66Z</StreamGeometry>
<StreamGeometry x:Key="TreeDataGridSortIconDescendingPath">m17.55 15.66-4.8 5.48a1 1 0 0 1-1.5 0l-4.8-5.48A1 1 0 0 1 7.2 14h9.6a1 1 0 0 1 .75 1.66Z</StreamGeometry>
<StreamGeometry x:Key="TreeDataGridItemCollapsedChevronPathData">m9.66 3.44 8.97 7.8a1 1 0 0 1 0 1.51l-8.97 7.81A1 1 0 0 1 8 19.81V4.19a1 1 0 0 1 1.66-.75Z</StreamGeometry>
<!-- <StaticResource x:Key="TreeDataGridSortIconAscendingPath" ResourceKey="SemiIconCaretUp"/> -->
<!-- <StaticResource x:Key="TreeDataGridSortIconDescendingPath" ResourceKey="SemiIconCaretDown"/> -->
<!-- <StaticResource x:Key="TreeDataGridItemCollapsedChevronPathData" ResourceKey="SemiIconTreeTriangleRight"/> -->
<Thickness x:Key="TreeDataGridRowMargin">2</Thickness>
<StaticResource x:Key="TreeDataGridSortIconAscendingPath" ResourceKey="SemiIconSmallTriangleTop" />
<StaticResource x:Key="TreeDataGridSortIconDescendingPath" ResourceKey="SemiIconSmallTriangleDown" />
<StaticResource x:Key="TreeDataGridItemCollapsedChevronPathData" ResourceKey="SemiIconTreeTriangleRight" />
<StaticResource x:Key="TreeDataGridItemCollapsedChevronWidth" ResourceKey="SemiWidthIconMedium" />
<StaticResource x:Key="TreeDataGridColumnHeaderCornerRadius" ResourceKey="SemiBorderRadiusSmall" />
<StaticResource x:Key="TreeDataGridColumnHeaderMinHeight" ResourceKey="SemiHeightControlDefault" />
<StaticResource x:Key="TreeDataGridRowCornerRadius" ResourceKey="SemiBorderRadiusSmall" />
<StaticResource x:Key="TreeDataGridRowMinHeight" ResourceKey="SemiHeightControlDefault" />
<StaticResource x:Key="TreeDataGridRowMargin" ResourceKey="SemiThicknessSuperTight" />
</ResourceDictionary>

45
src/Semi.Avalonia.TreeDataGrid/TreeDataGrid.axaml
View File

@@ -49,10 +49,10 @@
<ControlTheme x:Key="{x:Type TreeDataGridColumnHeader}" TargetType="TreeDataGridColumnHeader">
<Setter Property="Background" Value="Transparent" />
<Setter Property="MinHeight" Value="32" />
<Setter Property="MinHeight" Value="{DynamicResource TreeDataGridColumnHeaderMinHeight}" />
<Setter Property="Padding" Value="8 2 0 2" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="CornerRadius" Value="4" />
<Setter Property="CornerRadius" Value="{DynamicResource TreeDataGridColumnHeaderCornerRadius}" />
<Setter Property="VerticalContentAlignment" Value="Center" />
<Setter Property="Foreground" Value="{DynamicResource TreeDataGridColumnHeaderForeground}" />
<Setter Property="Template">
@@ -87,11 +87,8 @@
</Panel>
<PathIcon
Name="SortIcon"
Width="8"
Height="8"
Theme="{StaticResource InnerPathIcon}"
Margin="0,0,8,0"
HorizontalAlignment="Center"
VerticalAlignment="Center"
DockPanel.Dock="Right"
Foreground="{TemplateBinding Foreground}"
TabIndex="1" />
@@ -140,8 +137,8 @@
<ControlTheme x:Key="{x:Type TreeDataGridRow}" TargetType="TreeDataGridRow">
<Setter Property="Background" Value="Transparent" />
<Setter Property="CornerRadius" Value="3" />
<Setter Property="MinHeight" Value="32" />
<Setter Property="CornerRadius" Value="{DynamicResource TreeDataGridRowCornerRadius}" />
<Setter Property="MinHeight" Value="{DynamicResource TreeDataGridRowMinHeight}" />
<Setter Property="Cursor" Value="Hand" />
<Setter Property="Template">
<ControlTemplate>
@@ -192,25 +189,17 @@
</ControlTheme>
<ControlTheme x:Key="TreeDataGridExpandCollapseChevron" TargetType="ToggleButton">
<Setter Property="Margin" Value="0" />
<Setter Property="Width" Value="8" />
<Setter Property="Height" Value="8" />
<Setter Property="Foreground" Value="{DynamicResource TreeDataGridColumnHeaderForeground}" />
<Setter Property="Template">
<ControlTemplate>
<Border
<PathIcon
Name="ChevronPath"
Width="{TemplateBinding Width}"
Height="{TemplateBinding Height}"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Background="Transparent">
<PathIcon
Name="ChevronPath"
HorizontalAlignment="Center"
VerticalAlignment="Center"
Data="{DynamicResource TreeDataGridItemCollapsedChevronPathData}"
Foreground="{TemplateBinding Foreground}" />
</Border>
Theme="{StaticResource InnerPathIcon}"
Classes="Small"
Data="{DynamicResource TreeDataGridItemCollapsedChevronPathData}"
Foreground="{TemplateBinding Foreground}" />
</ControlTemplate>
</Setter>
<Style Selector="^:checked /template/ PathIcon#ChevronPath">
@@ -223,18 +212,16 @@
<ControlTemplate>
<Border
Name="CellBorder"
Padding="{TemplateBinding Indent,
Converter={x:Static conv:IndentConverter.Instance}}"
Padding="{TemplateBinding Indent,Converter={x:Static conv:IndentConverter.Instance}}"
Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}"
CornerRadius="{TemplateBinding CornerRadius}">
<DockPanel>
<Border
Width="12"
Height="12"
Margin="4,0"
DockPanel.Dock="Left">
DockPanel.Dock="Left"
Width="{DynamicResource TreeDataGridItemCollapsedChevronWidth}"
Margin="4,0">
<ToggleButton
Focusable="False"
IsChecked="{TemplateBinding IsExpanded, Mode=TwoWay}"
@@ -335,4 +322,4 @@
</Setter>
</Style>
</ControlTheme>
</ResourceDictionary>
</ResourceDictionary>

4
src/Semi.Avalonia/Controls/TreeView.axaml
View File

@@ -71,8 +71,8 @@
Background="Transparent">
<PathIcon
Name="PART_ExpandIconPath"
Width="{DynamicResource TreeViewItemIconSize}"
Height="{DynamicResource TreeViewItemIconSize}"
Theme="{StaticResource InnerPathIcon}"
Classes="Small"
Data="{DynamicResource ExpanderIconData}"
Foreground="{DynamicResource TreeViewItemIconDefaultForeground}">
<PathIcon.Transitions>

1
src/Semi.Avalonia/Themes/Shared/TreeView.axaml
View File

@@ -1,7 +1,6 @@
<ResourceDictionary xmlns="https://github.com/avaloniaui" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml">
<StaticResource x:Key="TreeViewItemDefaultCornerRadius" ResourceKey="SemiBorderRadiusSmall" />
<x:Double x:Key="TreeViewItemIndent">20</x:Double>
<x:Double x:Key="TreeViewItemIconSize">8</x:Double>
<StaticResource x:Key="ExpanderIconData" ResourceKey="SemiIconTreeTriangleRight" />
<Thickness x:Key="TreeViewItemIconMargin">8 0</Thickness>
<Thickness x:Key="TreeViewItemPadding">0 4 8 4</Thickness>