优化 margin 布局

This commit is contained in:
polarboy 2024-06-21 16:13:26 +08:00
parent 353c20932f
commit f05d08d4c1
4 changed files with 43 additions and 19 deletions

View File

@ -15,6 +15,9 @@
<Style Selector="atom|DashboardProgress">
<Setter Property="Margin" Value="5"></Setter>
</Style>
<Style Selector="#CircleWithStep atom|StepsProgressBar">
<Setter Property="Margin" Value="5"></Setter>
</Style>
</showcase:ShowCasePanel.Styles>
<showcase:ShowCaseItem
Title="Progress bar"
@ -180,7 +183,7 @@
<showcase:ShowCaseItem
Title="Circular progress bar whit steps"
Description="A circular progress bar that support steps and color segments, default gap is 2px.">
<StackPanel Orientation="Vertical" Spacing="5">
<StackPanel Orientation="Vertical" Spacing="5" x:Name="CircleWithStep">
<StackPanel Orientation="Vertical" Spacing="5">
<StackPanel Orientation="Vertical" HorizontalAlignment="Left" Width="300">
<atom:ProgressBar Value="50" Minimum="0" Maximum="100" SizeType="Large" />
@ -215,7 +218,7 @@
<showcase:ShowCaseItem
Title="Change progress value position"
Description="Change the position of the progress value, you can use percentPosition to adjust it so that the progress bar value is inside, outside or at the bottom of the progress bar.">
<StackPanel Orientation="Vertical" Spacing="5">
<StackPanel Orientation="Vertical" Spacing="10">
<atom:ProgressBar Value="30" Minimum="0" Maximum="100" Width="300" PercentPosition="{Binding InnerStartPercentPosition}"/>
<atom:ProgressBar Value="60" Minimum="0" Maximum="100" Width="300" PercentPosition="{Binding InnerCenterPercentPosition}"/>
<atom:ProgressBar Value="50" Minimum="0" Maximum="100" Width="300" PercentPosition="{Binding InnerEndPercentPosition}"/>
@ -228,5 +231,19 @@
</StackPanel>
</showcase:ShowCaseItem>
<showcase:ShowCaseItem
Title="Change progress value position for StepsProgressBar"
Description="Change the position of the progress value, you can use percentPosition to adjust it so that the progress bar value is inside, outside or at the bottom of the progress bar.">
<StackPanel Orientation="Vertical" Spacing="10">
<atom:StepsProgressBar Value="100" Minimum="0" Maximum="100" Steps="8" PercentPosition="Start"/>
<atom:StepsProgressBar Value="60" Minimum="0" Maximum="100" Steps="8" PercentPosition="Center" SizeType="Middle"/>
<atom:StepsProgressBar Value="60" Minimum="0" Maximum="100" Steps="8" PercentPosition="Center" SizeType="Small"/>
<atom:StepsProgressBar Value="55" Minimum="0" Maximum="100" Steps="8" PercentPosition="Center"/>
<atom:StepsProgressBar Value="100" Minimum="0" Maximum="100" Steps="8" PercentPosition="End"/>
<atom:StepsProgressBar Value="55" Minimum="0" Maximum="100" Steps="8" PercentPosition="End" Status="Exception"/>
<atom:StepsProgressBar Value="99" Minimum="0" Maximum="100" Steps="8" PercentPosition="Start"/>
</StackPanel>
</showcase:ShowCaseItem>
</showcase:ShowCasePanel>
</UserControl>

View File

@ -19,7 +19,7 @@ public partial class ProgressBarShowCase : UserControl
public PercentPosition OutterStartPercentPosition { get; set; }
public PercentPosition OutterCenterPercentPosition { get; set; }
public PercentPosition OutterEndPercentPosition { get; set; }
public ProgressBarShowCase()
{
InitializeComponent();

View File

@ -43,7 +43,7 @@ public partial class ProgressBar : AbstractLineProgress
if (Orientation == Orientation.Horizontal) {
targetHeight = StrokeThickness;
if (!PercentPosition.IsInner && ShowProgressInfo) {
targetHeight += _percentageLabel!.DesiredSize.Height;
targetHeight += _percentageLabel!.DesiredSize.Height + _lineProgressPadding;
}
targetWidth = availableSize.Width;
@ -63,7 +63,7 @@ public partial class ProgressBar : AbstractLineProgress
protected override Size ArrangeOverride(Size finalSize)
{
if (ShowProgressInfo) {
var extraInfoRect = GetExtraInfoRect(new Rect(new Point(0, 0), finalSize));
var extraInfoRect = GetExtraInfoRect(new Rect(new Point(0, 0), DesiredSize));
if (_percentageLabel!.IsVisible) {
_percentageLabel.Arrange(extraInfoRect);
}
@ -243,6 +243,7 @@ public partial class ProgressBar : AbstractLineProgress
protected override Rect GetProgressBarRect(Rect controlRect)
{
var contentRect = new Rect(new Point(0, 0), controlRect.Size.Deflate(Margin));
double deflateLeft = 0;
double deflateTop = 0;
double deflateRight = 0;
@ -268,7 +269,7 @@ public partial class ProgressBar : AbstractLineProgress
var percentLabelWidth = _extraInfoSize.Width;
var percentLabelHeight = _extraInfoSize.Height;
if (PercentPosition.Alignment == LinePercentAlignment.Start) {
deflateTop = percentLabelHeight + _lineExtraInfoMargin;;
deflateTop = percentLabelHeight + _lineExtraInfoMargin;
} else if (PercentPosition.Alignment == LinePercentAlignment.Center) {
deflateRight = percentLabelWidth;
} else if (PercentPosition.Alignment == LinePercentAlignment.End) {
@ -278,7 +279,7 @@ public partial class ProgressBar : AbstractLineProgress
}
}
var deflatedControlRect = controlRect.Deflate(new Thickness(deflateLeft, deflateTop, deflateRight, deflateBottom));
var deflatedControlRect = contentRect.Deflate(new Thickness(deflateLeft, deflateTop, deflateRight, deflateBottom));
if (Orientation == Orientation.Horizontal) {
return new Rect(new Point(deflatedControlRect.X, (deflatedControlRect.Height - strokeThickness) / 2), new Size(deflatedControlRect.Width, strokeThickness));
}
@ -287,6 +288,7 @@ public partial class ProgressBar : AbstractLineProgress
protected override Rect GetExtraInfoRect(Rect controlRect)
{
var contentRect = new Rect(new Point(0, 0), controlRect.Size.Deflate(Margin));
double offsetX = 0;
double offsetY = 0;
double targetWidth = 0;
@ -300,7 +302,7 @@ public partial class ProgressBar : AbstractLineProgress
if (Orientation == Orientation.Horizontal) {
if (ShowProgressInfo) {
if (PercentPosition.IsInner) {
var grooveRect = GetProgressBarRect(controlRect);
var grooveRect = GetProgressBarRect(contentRect);
offsetY = grooveRect.Y + (grooveRect.Height - targetHeight) / 2;
var range = grooveRect.Width;
var deflateValue = range * (1 - Value / (Maximum - Minimum));
@ -315,13 +317,13 @@ public partial class ProgressBar : AbstractLineProgress
} else {
if (PercentPosition.Alignment == LinePercentAlignment.Start) {
offsetX = 0;
offsetY = (controlRect.Height - targetHeight) / 2;
offsetY = (contentRect.Height - targetHeight) / 2;
} else if (PercentPosition.Alignment == LinePercentAlignment.Center) {
offsetX = (controlRect.Width - targetWidth) / 2;
offsetY = controlRect.Bottom - targetHeight + _lineProgressPadding;
offsetX = (contentRect.Width - targetWidth) / 2;
offsetY = contentRect.Bottom - targetHeight + _lineProgressPadding;
} else if (PercentPosition.Alignment == LinePercentAlignment.End) {
offsetX = controlRect.Right - targetWidth;
offsetY = (controlRect.Height - targetHeight) / 2;
offsetX = contentRect.Right - targetWidth;
offsetY = (contentRect.Height - targetHeight) / 2;
}
}
}

View File

@ -293,16 +293,21 @@ public class StepsProgressBar : AbstractLineProgress
if (Orientation == Orientation.Horizontal) {
targetWidth = chunkWidth * Steps + DEFAULT_CHUNK_SPACE * (Steps - 1);
if (ShowProgressInfo) {
targetWidth += _extraInfoSize.Width + _lineExtraInfoMargin;
if (PercentPosition == LinePercentAlignment.Center) {
chunkHeight += _extraInfoSize.Height + _lineProgressPadding;
} else {
targetWidth += _extraInfoSize.Width + _lineExtraInfoMargin;
}
}
targetHeight = Math.Max(chunkHeight, MinHeight);
} else {
targetHeight = chunkHeight * Steps + DEFAULT_CHUNK_SPACE * (Steps - 1);
if (ShowProgressInfo) {
targetHeight += _extraInfoSize.Height;
targetHeight += _extraInfoSize.Height + _lineExtraInfoMargin;
}
targetWidth = Math.Max(chunkWidth, MinWidth);
}
return new Size(targetWidth, targetHeight);
}
@ -361,7 +366,7 @@ public class StepsProgressBar : AbstractLineProgress
double deflateRight = 0;
double deflateBottom = 0;
var strokeThickness = StrokeThickness;
var contentRect = controlRect.Deflate(Margin);
var contentRect = new Rect(new Point(0, 0), controlRect.Size.Deflate(Margin));
if (Orientation == Orientation.Horizontal) {
if (ShowProgressInfo) {
var percentLabelWidth = _extraInfoSize.Width;
@ -390,14 +395,14 @@ public class StepsProgressBar : AbstractLineProgress
var deflatedControlRect = contentRect.Deflate(new Thickness(deflateLeft, deflateTop, deflateRight, deflateBottom));
if (Orientation == Orientation.Horizontal) {
return new Rect(new Point(0, (deflatedControlRect.Height - strokeThickness) / 2), new Size(deflatedControlRect.Width, strokeThickness));
return new Rect(new Point(deflatedControlRect.X, (deflatedControlRect.Height - strokeThickness) / 2), new Size(deflatedControlRect.Width, strokeThickness));
}
return new Rect(new Point((deflatedControlRect.Width - strokeThickness) / 2, 0), new Size(strokeThickness, deflatedControlRect.Height));
return new Rect(new Point((deflatedControlRect.Width - strokeThickness) / 2, deflatedControlRect.Y), new Size(strokeThickness, deflatedControlRect.Height));
}
protected override Rect GetExtraInfoRect(Rect controlRect)
{
var contentRect = controlRect.Deflate(Margin);
var contentRect = new Rect(new Point(0, 0), controlRect.Size.Deflate(Margin));
double offsetX = 0;
double offsetY = 0;
double targetWidth = 0;