GithubStar/AtomUI
1
0
Fork 0
mirror of https://github.com/AtomUI/AtomUI.git synced 2026-10-28 23:08:36 +08:00
Code Issues Packages Projects Releases Wiki Activity

Refactor Splitter for Attached property

Browse Source
This commit is contained in:
chinboy
2026-01-01 20:50:43 +08:00
parent 627982ed5e
commit 882b90eaef
9 changed files with 2056 additions and 1978 deletions
Download Patch File Download Diff File Expand all files Collapse all files
controlgallery/AtomUIGallery/ShowCases/Views/Layout/SplitterShowCase.axaml
+71 -116
View File
@@ -34,16 +34,12 @@
<gallery:ShowCaseItem Title="Basic" Description="Initial sizes with min/max constraints." IsOccupyEntireRow="True">
<Border Classes="splitter-surface">
<atom:Splitter Orientation="Vertical" Height="220">
<atom:SplitterPanel Size="30%">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel DefaultSize="100" Min="60">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel" atom:Splitter.Size="30%">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
<Border Classes="splitter-panel" atom:Splitter.DefaultSize="100" atom:Splitter.MinSize="60">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:Splitter>
</Border>
</gallery:ShowCaseItem>
@@ -51,71 +47,50 @@
<gallery:ShowCaseItem Title="Horizontal" Description="Top-bottom splitter with collapsible icons." IsOccupyEntireRow="True">
<Border Classes="splitter-surface">
<atom:Splitter Orientation="Horizontal" Height="220">
<atom:SplitterPanel Size="40%" >
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Top</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel >
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Bottom</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel" atom:Splitter.Size="40%">
<TextBlock Classes="splitter-label">Top</TextBlock>
</Border>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Bottom</TextBlock>
</Border>
</atom:Splitter>
</Border>
</gallery:ShowCaseItem>
<gallery:ShowCaseItem Title="Composite" Description="Nested horizontal inside vertical layout." IsOccupyEntireRow="True">
<Border Classes="splitter-surface">
<atom:Splitter Orientation="Vertical" Height="260">
<atom:SplitterPanel Size="40%" >
<Border Classes="splitter-panel" atom:Splitter.Size="40%">
<TextBlock Classes="splitter-label">Left</TextBlock>
</Border>
<atom:Splitter Orientation="Horizontal">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Left</TextBlock>
<TextBlock Classes="splitter-label">Top</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel>
<Border Classes="splitter-panel alt" Padding="0">
<atom:Splitter Orientation="Horizontal">
<atom:SplitterPanel >
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Top</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel >
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Bottom</TextBlock>
</Border>
</atom:SplitterPanel>
</atom:Splitter>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Bottom</TextBlock>
</Border>
</atom:SplitterPanel>
</atom:Splitter>
</atom:Splitter>
</Border>
</gallery:ShowCaseItem>
<gallery:ShowCaseItem Title="Resizable Disabled" Description="If either side disables resizable, dragging is blocked." IsOccupyEntireRow="True">
<Border Classes="splitter-surface">
<atom:Splitter Orientation="Vertical" Height="220">
<atom:SplitterPanel Size="35%">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Resizable</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel DefaultSize="120" IsResizable="False">
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Not Resizable</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel DefaultSize="120">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Resizable</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel" atom:Splitter.Size="35%">
<TextBlock Classes="splitter-label">Resizable</TextBlock>
</Border>
<Border Classes="splitter-panel alt" atom:Splitter.DefaultSize="120" atom:Splitter.IsResizable="False">
<TextBlock Classes="splitter-label">Not Resizable</TextBlock>
</Border>
<Border Classes="splitter-panel" atom:Splitter.DefaultSize="120">
<TextBlock Classes="splitter-label">Resizable</TextBlock>
</Border>
</atom:Splitter>
</Border>
</gallery:ShowCaseItem>
<gallery:ShowCaseItem Title="ShowCollapsibleIcon"
Description="Three panels with hover and always-visible collapsible icons."
IsOccupyEntireRow="True">
@@ -135,83 +110,63 @@
IsCheckedChanged="HandleShowCollapsibleIconChanged">False</atom:RadioButton>
</StackPanel>
<atom:Splitter Orientation="Vertical" Height="220">
<atom:SplitterPanel x:Name="ShowCollapsiblePanelFirst" DefaultSize="33%">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel x:Name="ShowCollapsiblePanelSecond" DefaultSize="34%">
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel x:Name="ShowCollapsiblePanelThird">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">Third</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel"
x:Name="ShowCollapsiblePanelFirst"
atom:Splitter.DefaultSize="33%">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
<Border Classes="splitter-panel alt" x:Name="ShowCollapsiblePanelSecond"
atom:Splitter.DefaultSize="34%">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
<Border Classes="splitter-panel"
x:Name="ShowCollapsiblePanelThird">
<TextBlock Classes="splitter-label">Third</TextBlock>
</Border>
</atom:Splitter>
</StackPanel>
</Border>
</gallery:ShowCaseItem>
<gallery:ShowCaseItem Title="Multi Panels" Description="Multiple panels in vertical layout." IsOccupyEntireRow="True">
<Border Classes="splitter-surface">
<atom:Splitter Orientation="Vertical" Height="240">
<atom:SplitterPanel Size="20%">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">A</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel Size="20%">
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">B</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel>
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">C</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">D</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel" atom:Splitter.Size="20%">
<TextBlock Classes="splitter-label">A</TextBlock>
</Border>
<Border Classes="splitter-panel alt" atom:Splitter.Size="20%">
<TextBlock Classes="splitter-label">B</TextBlock>
</Border>
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">C</TextBlock>
</Border>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">D</TextBlock>
</Border>
</atom:Splitter>
</Border>
</gallery:ShowCaseItem>
<gallery:ShowCaseItem Title="Lazy"
Description="Lazy rendering mode: sizes update on drag release."
IsOccupyEntireRow="True">
<Border Classes="splitter-surface" Padding="16">
<StackPanel Spacing="12">
<atom:Splitter Orientation="Vertical" Height="140" IsLazy="True">
<atom:SplitterPanel Size="50%">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel" atom:Splitter.Size="50%">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:Splitter>
<atom:Splitter Orientation="Horizontal" Height="140" IsLazy="True">
<atom:SplitterPanel Size="50%">
<Border Classes="splitter-panel">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
</atom:SplitterPanel>
<atom:SplitterPanel>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:SplitterPanel>
<Border Classes="splitter-panel" atom:Splitter.Size="50%">
<TextBlock Classes="splitter-label">First</TextBlock>
</Border>
<Border Classes="splitter-panel alt">
<TextBlock Classes="splitter-label">Second</TextBlock>
</Border>
</atom:Splitter>
</StackPanel>
</Border>
controlgallery/AtomUIGallery/ShowCases/Views/Layout/SplitterShowCase.axaml.cs
+6 -5
View File
@@ -1,9 +1,10 @@
using System;
using AtomUI.Desktop.Controls;
using AtomUIGallery.ShowCases.ViewModels;
using Avalonia.Controls;
using Avalonia.Interactivity;
using ReactiveUI;
using ReactiveUI.Avalonia;
using RadioButton = AtomUI.Desktop.Controls.RadioButton;
namespace AtomUIGallery.ShowCases.Views;
@@ -55,12 +56,12 @@ public partial class SplitterShowCase : ReactiveUserControl<SplitterViewModel>
ApplyShowMode(ShowCollapsiblePanelThird, mode);
}
private static void ApplyShowMode(SplitterPanel panel, SplitterCollapsibleIconDisplayMode mode)
private static void ApplyShowMode(Control panel, SplitterCollapsibleIconDisplayMode mode)
{
panel.Collapsible = new SplitterPanelCollapsible
Splitter.SetCollapsible(panel, new SplitterPanelCollapsible()
{
IsEnabled = true,
IsEnabled = true,
ShowCollapsibleIcon = mode
};
});
}
}
src/AtomUI.Desktop.Controls/Splitter/Splitter.cs
+123 -1745
View File
File diff suppressed because it is too large Load Diff
src/AtomUI.Desktop.Controls/Splitter/SplitterPanel.cs
+1841 -87
View File
File diff suppressed because it is too large Load Diff
src/AtomUI.Desktop.Controls/Splitter/Themes/SplitterHandleTheme.axaml
+1 -1
View File
@@ -57,7 +57,7 @@
<Setter Property="CornerRadius" Value="{DynamicResource {x:Static atom:SharedTokenKey.BorderRadiusXS}}" />
<Setter Property="BorderThickness" Value="0" />
<Setter Property="Padding" Value="0" />
<Setter Property="Panel.ZIndex" Value="{DynamicResource {x:Static atom:SharedTokenKey.ZIndexPopupBase}}" />
<Setter Property="ZIndex" Value="{DynamicResource {x:Static atom:SharedTokenKey.ZIndexPopupBase}}" />
<Setter Property="HorizontalAlignment" Value="Center" />
<Setter Property="VerticalAlignment" Value="Center" />
</Style>
src/AtomUI.Desktop.Controls/Splitter/Themes/SplitterPanelTheme.axaml
-23
View File
@@ -1,23 +0,0 @@
<ResourceDictionary
xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:atom="https://atomui.net"
x:ClassModifier="internal">
<ControlTheme x:Key="{x:Type atom:SplitterPanel}" TargetType="atom:SplitterPanel">
<Setter Property="Template">
<ControlTemplate>
<Border Background="{TemplateBinding Background}"
BorderBrush="{TemplateBinding BorderBrush}"
BorderThickness="{TemplateBinding BorderThickness}">
<ContentPresenter Content="{TemplateBinding Content}"
ContentTemplate="{TemplateBinding ContentTemplate}"
HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment="{TemplateBinding VerticalContentAlignment}" />
</Border>
</ControlTemplate>
</Setter>
<Setter Property="Background" Value="{DynamicResource {x:Static atom:SharedTokenKey.ColorBgContainer}}" />
<Setter Property="BorderThickness" Value="0" />
</ControlTheme>
</ResourceDictionary>
src/AtomUI.Desktop.Controls/Splitter/Themes/SplitterTheme.axaml
+13
View File
@@ -4,6 +4,19 @@
xmlns:atom="https://atomui.net"
x:ClassModifier="internal">
<ControlTheme x:Key="{x:Type atom:Splitter}" TargetType="atom:Splitter">
<Setter Property="Template">
<ControlTemplate>
<Border Name="Frame">
<atom:SplitterPanel Name="{x:Static atom:SplitterThemeConstants.SplitterPanelPart}"
HandleSize="{TemplateBinding HandleSize}"
Orientation="{TemplateBinding Orientation}"
IsLazy="{TemplateBinding IsLazy}"
CollapsePreviousIcon="{TemplateBinding CollapsePreviousIcon}"
CollapseNextIcon="{TemplateBinding CollapseNextIcon}"/>
</Border>
</ControlTemplate>
</Setter>
<Setter Property="ClipToBounds" Value="True" />
<Setter Property="HandleSize" Value="{DynamicResource {x:Static atom:SplitterTokenKey.SplitBarHandleSize}}" />
</ControlTheme>
src/AtomUI.Desktop.Controls/Splitter/Themes/SplitterThemeConstants.cs
+1
View File
@@ -7,4 +7,5 @@ internal static class SplitterThemeConstants
public const string CollapseIconsHostPart = "PART_CollapseIconsHost";
public const string CollapsePrevButtonPart = "PART_CollapsePrevButton";
public const string CollapseNextButtonPart = "PART_CollapseNextButton";
public const string SplitterPanelPart = "PART_SplitterPanel";
}
src/AtomUI.Desktop.Controls/Splitter/Themes/SplitterThemes.axaml
-1
View File
@@ -3,7 +3,6 @@
x:ClassModifier="internal">
<ResourceDictionary.MergedDictionaries>
<ResourceInclude Source="SplitterTheme.axaml" />
<ResourceInclude Source="SplitterPanelTheme.axaml" />
<ResourceInclude Source="SplitterHandleTheme.axaml" />
</ResourceDictionary.MergedDictionaries>
</ResourceDictionary>