chfei/HandyControl
1
0 Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: Add WaterfallPanel control and demo.

Browse Source 
Introduce a new WaterfallPanel control for Avalonia and a demo UserControl showcasing its usage. The panel supports Groups, AutoGroup, DesiredLength (coerced to >= 0) and Orientation; AutoGroup computes columns/rows based on DesiredLength. Measure/Arrange logic distributes children into the shortest group (waterfall layout) and sizes items by dividing the primary axis by group count. Also add WaterfallPanelDemo.axaml and code-behind demonstrating horizontal/vertical examples with a NumericUpDown to adjust groups.
This commit is contained in:
NaBian committed 2026-06-13 15:12:10 +08:00
1 parent 3f384cb0c2
commit 22cbc47156
3 files changed
+299
Download Patch File Download Diff File Expand all files Collapse all files

No files matched your search

src/Avalonia/HandyControlDemo_Avalonia/UserControl/Styles/WaterfallPanelDemo.axaml
+132
View File
@@ -0,0 +1,132 @@
<UserControl xmlns="https://github.com/avaloniaui"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
xmlns:hc="https://handyorg.github.io/handycontrol"
x:Class="HandyControlDemo.UserControl.WaterfallPanelDemo">
<Grid Margin="32">
<Grid.RowDefinitions>
<RowDefinition Height="Auto"/>
<RowDefinition/>
</Grid.RowDefinitions>
<NumericUpDown x:Name="UpDownGroups"
HorizontalAlignment="Center"
Value="2"
Minimum="1"
Maximum="3"
Width="200"
Theme="{StaticResource NumericUpDownExtend}"
hc:TitleElement.Title="Groups"
hc:TitleElement.TitleWidth="50"
hc:TitleElement.TitlePlacement="Left"/>
<hc:UniformSpacingPanel Grid.Row="1"
Spacing="16"
ChildWrapping="Wrap"
Margin="0,16,0,0">
<ScrollViewer MaxHeight="300">
<hc:WaterfallPanel VerticalAlignment="Center"
Width="300"
Groups="{Binding #UpDownGroups.Value}">
<Border Height="100"
Background="{DynamicResource PrimaryBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Height="140"
Background="{DynamicResource DangerBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Height="100"
Background="{DynamicResource SuccessBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Height="170"
Background="{DynamicResource InfoBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Height="100"
Background="{DynamicResource WarningBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
</hc:WaterfallPanel>
</ScrollViewer>
<ScrollViewer HorizontalScrollBarVisibility="Auto"
VerticalScrollBarVisibility="Hidden"
hc:ScrollViewerAttach.Orientation="Horizontal"
MaxWidth="300">
<hc:WaterfallPanel VerticalAlignment="Center"
Height="300"
Orientation="Vertical"
Groups="{Binding #UpDownGroups.Value}">
<Border Width="100"
Background="{DynamicResource PrimaryBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Width="140"
Background="{DynamicResource DangerBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Width="100"
Background="{DynamicResource SuccessBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Width="170"
Background="{DynamicResource InfoBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
<Border Width="100"
Background="{DynamicResource WarningBrush}"
Effect="{StaticResource EffectShadow1}"
Margin="5">
<TextBlock Text="Content"
VerticalAlignment="Center"
HorizontalAlignment="Center"
Foreground="White"/>
</Border>
</hc:WaterfallPanel>
</ScrollViewer>
</hc:UniformSpacingPanel>
</Grid>
</UserControl>
src/Avalonia/HandyControlDemo_Avalonia/UserControl/Styles/WaterfallPanelDemo.axaml.cs
+9
View File
@@ -0,0 +1,9 @@
namespace HandyControlDemo.UserControl;
public partial class WaterfallPanelDemo : Avalonia.Controls.UserControl
{
public WaterfallPanelDemo()
{
InitializeComponent();
}
}