Skip to content

Commit

Permalink
Merge pull request #11 from asv-soft/feat/step-sizing-adaptive-button
Browse files Browse the repository at this point in the history
feat(step-sizing-button): fix button display when margin property set
  • Loading branch information
asv-soft-u01 authored Jun 3, 2024
2 parents ef387c2 + 61d346f commit db11818
Show file tree
Hide file tree
Showing 2 changed files with 53 additions and 51 deletions.
Original file line number Diff line number Diff line change
Expand Up @@ -3,62 +3,57 @@
xmlns:buttons="clr-namespace:Asv.Avalonia.Toolkit.UI.Controls.Buttons">
<Design.PreviewWith>
<Border Height="500" Padding="20" Width="500">
<StackPanel Spacing="10">
<WrapPanel Width="200">
<buttons:StepSizingButton StepSizeHeight="20" StepSizeWidth="50">
<StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
<PathIcon>
<Border BorderBrush="Brown" BorderThickness="2" Width="216">
<WrapPanel Width="216">
<Border Width="50" Margin="2" Height="20" BorderBrush="Brown" BorderThickness="1" />
<Border Width="50" Margin="2" Height="20" BorderBrush="Brown" BorderThickness="1" />
<Border Width="50" Margin="2" Height="20" BorderBrush="Brown" BorderThickness="1" />
<Border Width="50" Margin="2" Height="20" BorderBrush="Brown" BorderThickness="1" />
<buttons:StepSizingButton Margin="2" StepSizeHeight="20" StepSizeWidth="50">
<Grid ColumnDefinitions="Auto, Auto">
<PathIcon Grid.Column="0" MaxWidth="20">
<PathIcon.Data>
M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z
</PathIcon.Data>
</PathIcon>
<TextBlock Margin="10,0" Text="Home"></TextBlock>
</StackPanel>

<TextBlock Grid.Column="1" Text="Home" />
</Grid>
</buttons:StepSizingButton>
<buttons:StepSizingButton StepSizeHeight="20" StepSizeWidth="50">
<buttons:StepSizingButton Margin="2" StepSizeHeight="20" StepSizeWidth="50">
<StackPanel HorizontalAlignment="Center" Orientation="Horizontal">
<PathIcon>
<PathIcon.Data>
M6.5 14.5v-3.505c0-.245.25-.495.5-.495h2c.25 0 .5.25.5.5v3.5a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5v-7a.5.5 0 0 0-.146-.354L13 5.793V2.5a.5.5 0 0 0-.5-.5h-1a.5.5 0 0 0-.5.5v1.293L8.354 1.146a.5.5 0 0 0-.708 0l-6 6A.5.5 0 0 0 1.5 7.5v7a.5.5 0 0 0 .5.5h4a.5.5 0 0 0 .5-.5z
</PathIcon.Data>
</PathIcon>
</StackPanel>

</buttons:StepSizingButton>
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" Content="12345222222" />
<buttons:StepSizingButton Content="12345222222222"
StepSizeHeight="20" StepSizeWidth="50">
</buttons:StepSizingButton>
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" Content="1234" />
<buttons:StepSizingButton StepSizeHeight="20" StepSizeWidth="50" Content="1234567890">
</buttons:StepSizingButton>
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton StepSizeWidth="50" StepSizeHeight="20" Content="1234222222" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="33333333333" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="11" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="222222222" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="11" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="2222222" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="11" />
<buttons:StepSizingButton Margin="2" StepSizeWidth="50" StepSizeHeight="20" Content="44444444444444444444" />
</WrapPanel>
</StackPanel>
</Border>
</Border>
</Design.PreviewWith>
<ControlTheme x:Key="{x:Type buttons:StepSizingButton}"
TargetType="buttons:StepSizingButton">
<Setter Property="Template">
<ControlTemplate>
<Button
Height="{TemplateBinding Height}"
Command="{TemplateBinding Command}">
<ContentPresenter
Margin="0 0 5 0"
HorizontalContentAlignment="Center"
Width="{TemplateBinding Width}"
x:Name="PartContentPresenter"
Content="{TemplateBinding Content}"
Foreground="{TemplateBinding Foreground}"
Theme="{TemplateBinding Theme}" />
Width="{TemplateBinding Width}"
Height="{TemplateBinding Height}"
Command="{TemplateBinding Command}">
<ContentPresenter
HorizontalContentAlignment="Center"
x:Name="PartContentPresenter"
Content="{TemplateBinding Content}"
Foreground="{TemplateBinding Foreground}"
Theme="{TemplateBinding Theme}" />
</Button>
</ControlTemplate>
</Setter>
Expand Down
39 changes: 23 additions & 16 deletions src/Asv.Avalonia.Toolkit/UI/Controls/Buttons/StepSizingButton.cs
Original file line number Diff line number Diff line change
Expand Up @@ -7,53 +7,60 @@ namespace Asv.Avalonia.Toolkit.UI.Controls.Buttons;

public class StepSizingButton : Button
{

public static readonly StyledProperty<double> ButtonUnitWidthProperty =
AvaloniaProperty.Register<StepSizingButton, double>(nameof(StepSizeWidth));

/// <summary>
/// Get or Set step of width for control
/// </summary>
public double StepSizeWidth
{
get => GetValue(ButtonUnitWidthProperty);
set => SetValue(ButtonUnitWidthProperty, value);
}

public static readonly StyledProperty<double> ButtonUnitHeightProperty =
AvaloniaProperty.Register<StepSizingButton, double>(nameof(StepSizeHeight));

/// <summary>
/// Get or Set step of height for control
/// </summary>
public double StepSizeHeight
{
get => GetValue(ButtonUnitHeightProperty);
set => SetValue(ButtonUnitHeightProperty, value);
}

protected override void OnPropertyChanged(AvaloniaPropertyChangedEventArgs change)
{
base.OnPropertyChanged(change);

if (change.Property == BoundsProperty)
{
if (StepSizeWidth != 0 )
MinWidth = StepSizeWidth;
if (StepSizeWidth != 0)
{
if (Bounds.Width > StepSizeWidth)
{
Width = StepSizeWidth * Math.Round(Bounds.Width / StepSizeWidth);
var increment = (int)Math.Round(Bounds.Width / StepSizeWidth);
Width = StepSizeWidth * increment + (Margin.Right + Margin.Left) * (increment - 1);
if (Width < Bounds.Width) increment++;
Width = StepSizeWidth * increment + (Margin.Right + Margin.Left) * (increment - 1);
}
else
{
Width = StepSizeWidth;
}
}

if (StepSizeHeight != 0)
if (StepSizeHeight == 0) return;
if (Bounds.Height > StepSizeHeight)
{
if (Bounds.Height+15 > StepSizeHeight)
{
Height = StepSizeHeight * Math.Round(Bounds.Height / StepSizeHeight);
}
else
{
Height = StepSizeHeight;
}
var increment = (int)Math.Round(Bounds.Height / StepSizeHeight);
Height = StepSizeHeight * increment + (Margin.Top + Margin.Bottom) * (increment - 1);
}
else
{
Height = StepSizeHeight;
}
}
}
Expand Down

0 comments on commit db11818

Please sign in to comment.