如何正确调整用户控件的大小？

• 为了解决尺寸问题，我建议巧妙地将画布尺寸绑定到用户控件。
• 为了解决当一条曲线叠加在另一条曲线上时显示出不同颜色的轮廓的问题，我建议使用两条ArcSegment简单地相互延续而不是相互重叠的曲线。
• 为了避免在中间画一个圆圈，我建议使用Stroke而不是填充。同时，中心将是透明的，如果使用彩色背景，这会很方便。
• Arrange/Measure一般来说，有机会不碰最好不要碰。
• ViewBox可以使计算点的坐标变得更容易，但是您必须四处跳舞，Stroke以便它根据当前的缩放比例与像素大小相匹配ViewBox。试想一下，您设置了 10 个像素，但看到的是 20，或者例如 5。在当前的设计中，您可以以像素为单位设置条带的高度、宽度和厚度，这看起来很合乎逻辑。

例子

<UserControl x:Class="WpfAppProgressRing.ProgressRing"
             xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
             xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
             xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
             xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
             xmlns:local="clr-namespace:WpfAppProgressRing"
             mc:Ignorable="d" 
             d:DesignHeight="100" d:DesignWidth="100"
             x:Name="Ring">
    <UserControl.Resources>
        <local:MinConverter x:Key="MinConverter"/>
        <Style TargetType="{x:Type local:ProgressRing}">
            <Setter Property="Template">
                <Setter.Value>
                    <ControlTemplate TargetType="{x:Type local:ProgressRing}">
                        <Canvas MinWidth="{TemplateBinding MinWidth}" MinHeight="{TemplateBinding MinHeight}" MaxWidth="{TemplateBinding MaxWidth}" MaxHeight="{TemplateBinding MaxHeight}">
                            <Canvas.Width>
                                <MultiBinding Converter="{StaticResource MinConverter}">
                                    <Binding Path="ActualWidth" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="ActualHeight" RelativeSource="{RelativeSource TemplatedParent}"/>
                                </MultiBinding>
                            </Canvas.Width>
                            <Canvas.Height>
                                <MultiBinding Converter="{StaticResource MinConverter}">
                                    <Binding Path="ActualWidth" RelativeSource="{RelativeSource TemplatedParent}"/>
                                    <Binding Path="ActualHeight" RelativeSource="{RelativeSource TemplatedParent}"/>
                                </MultiBinding>
                            </Canvas.Height>
                            <Path Stroke="{TemplateBinding Background}" StrokeThickness="{TemplateBinding Stroke}">
                                <Path.Data>
                                    <PathGeometry>
                                        <PathFigure StartPoint="{Binding ProgressPoint, ElementName=Ring}">
                                            <ArcSegment Size="{Binding ArcSize, ElementName=Ring}" IsLargeArc="{Binding BackgroundLarge, ElementName=Ring}" SweepDirection="Clockwise" Point="{Binding StartPoint, ElementName=Ring}" />
                                        </PathFigure>
                                    </PathGeometry>
                                </Path.Data>
                            </Path>
                            <Path Stroke="{TemplateBinding Foreground}" StrokeThickness="{TemplateBinding Stroke}">
                                <Path.Data>
                                    <PathGeometry>
                                        <PathFigure StartPoint="{Binding StartPoint, ElementName=Ring}" >
                                            <ArcSegment Size="{Binding ArcSize, ElementName=Ring}" IsLargeArc="{Binding ForegroundLarge, ElementName=Ring}" SweepDirection="Clockwise" Point="{Binding ProgressPoint, ElementName=Ring}" />
                                        </PathFigure>
                                    </PathGeometry>
                                </Path.Data>
                            </Path>
                        </Canvas>
                    </ControlTemplate>
                </Setter.Value>
            </Setter>
        </Style>
    </UserControl.Resources>
</UserControl>

一切都是在DP上完成的，所以我很少使用它x:Name。

正如你所看到的，我使用这样的转换器：

public class MinConverter : IMultiValueConverter
{
    public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture)
    {
        if (values.Length == 2 && values[0] is double width && values[1] is double height)
            return Math.Min(width, height);
        return default(double);
    }

    public object[] ConvertBack(object value, Type[] targetTypes, object parameter, CultureInfo culture)
    {
        throw new NotSupportedException();
    }
}

这是代码本身，所有数学都减少到最低限度

public partial class ProgressRing : UserControl
{
    public static readonly DependencyProperty StrokeProperty = DependencyProperty.Register(nameof(Stroke), typeof(double), typeof(ProgressRing), new PropertyMetadata(10.0, OnStrokeChanged));
    public static readonly DependencyProperty ProgressProperty = DependencyProperty.Register(nameof(Progress), typeof(double), typeof(ProgressRing), new PropertyMetadata(0.0, OnProgressChanged));
    private static readonly DependencyProperty ArcSizeProperty = DependencyProperty.Register(nameof(ArcSize), typeof(Size), typeof(ProgressRing), new PropertyMetadata(new Size()));
    private static readonly DependencyProperty StartPointProperty = DependencyProperty.Register(nameof(StartPoint), typeof(Point), typeof(ProgressRing), new PropertyMetadata(new Point()));
    private static readonly DependencyProperty ProgressPointProperty = DependencyProperty.Register(nameof(ProgressPoint), typeof(Point), typeof(ProgressRing), new PropertyMetadata(new Point()));
    private static readonly DependencyProperty ForegroundLargeProperty = DependencyProperty.Register(nameof(ForegroundLarge), typeof(bool), typeof(ProgressRing), new PropertyMetadata(false));
    private static readonly DependencyProperty BackgroundLargeProperty = DependencyProperty.Register(nameof(BackgroundLarge), typeof(bool), typeof(ProgressRing), new PropertyMetadata(true));

    public double Stroke
    { 
        get => (double)GetValue(StrokeProperty);
        set => SetValue(StrokeProperty, value);
    }

    public double Progress
    {
        get => (double)GetValue(ProgressProperty);
        set => SetValue(ProgressProperty, value);
    }

    private Size ArcSize
    {
        get => (Size)GetValue(ArcSizeProperty);
        set => SetValue(ArcSizeProperty, value);
    }

    private Point StartPoint
    {
        get => (Point)GetValue(StartPointProperty);
        set => SetValue(StartPointProperty, value);
    }

    private Point ProgressPoint
    {
        get => (Point)GetValue(ProgressPointProperty);
        set => SetValue(ProgressPointProperty, value);
    }

    private bool ForegroundLarge
    {
        get => (bool)GetValue(ForegroundLargeProperty);
        set => SetValue(ForegroundLargeProperty, value);
    }

    private bool BackgroundLarge
    {
        get => (bool)GetValue(BackgroundLargeProperty);
        set => SetValue(BackgroundLargeProperty, value);
    }

    public ProgressRing()
    {
        InitializeComponent();
    }

    private void RecalcProgress()
    {
        double size = ArcSize.Width;
        double offset = size + Stroke / 2.0;
        double progress = (Math.Clamp(Progress, 0.0, 99.9999) - 25.0) / 50.0 * Math.PI;
        Point progressPoint = new(Math.Cos(progress) * size + offset, Math.Sin(progress) * size + offset);
        bool switchLarge = progressPoint.X < StartPoint.X;

        ProgressPoint = progressPoint;
        if (ForegroundLarge != switchLarge)
        {
            ForegroundLarge = switchLarge;
            BackgroundLarge = !switchLarge;
        }
    }

    private void RecalcSize(double width, double height)
    {
        double halfSize = Math.Min(width, height) / 2.0;
        double halfStroke = Stroke / 2.0;
        double arcSize = Math.Max(halfSize - halfStroke, 0.0);
        ArcSize = new Size(arcSize, arcSize);
        StartPoint = new Point(halfSize, halfStroke);
        RecalcProgress();
    }

    private static void OnProgressChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        ProgressRing ring = (ProgressRing)d;
        ring.RecalcProgress();
    }

    private static void OnStrokeChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
    {
        ProgressRing ring = (ProgressRing)d;
        double width = ring.ActualWidth;
        double height = ring.ActualHeight;
        if (width > 0 && height > 0)
            ring.RecalcSize(width, height);
    }

    protected override void OnRenderSizeChanged(SizeChangedInfo sizeInfo)
    {
        RecalcSize(sizeInfo.NewSize.Width, sizeInfo.NewSize.Height);
        base.OnRenderSizeChanged(sizeInfo);
    }
}

使用示例

为了简化示例，我将使用 codebyhind 编写它

<Window x:Class="WpfAppProgressRing.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:d="http://schemas.microsoft.com/expression/blend/2008"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        xmlns:local="clr-namespace:WpfAppProgressRing"
        mc:Ignorable="d"
        Title="MainWindow" Height="450" Width="800">
    <Grid>
        <local:ProgressRing Stroke="100" x:Name="ProgressRing" Foreground="Magenta" Background="Cyan" d:Progress="15"/>
    </Grid>
</Window>

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        StartProgress();
    }

    private async void StartProgress()
    {
        double progress = 0.0;
        while (progress < 100.0)
        {
            progress += 0.1;
            ProgressRing.Progress = progress;
            await Task.Delay(10);
        }
    }
}

这就是它的样子

根据宽度和高度的最小值将环尺寸调整为容器尺寸（这就是上面显示的转换器的用途）。

我不装天才，也许私人DP不太好，但是没有选拔通过Children。