wpf中的ed:Arc控件进度条两端圆角

在 WPF 中，可以使用 ed:Arc 控件来绘制圆弧进度条，并设置两端圆角。具体步骤如下：

1. 引入 ed:Arc 命名空间：

xmlns:ed="http://schemas.efxui.com/xaml"

2. 在 XAML 中使用 ed:Arc 控件，并设置 StrokeStartLineCap 和 StrokeEndLineCap 属性为 Round：

<ed:Arc Stroke="Gray" StrokeThickness="10" StrokeStartLineCap="Round" StrokeEndLineCap="Round"
        ArcThickness="10" ArcStart="90" ArcEnd="{Binding Progress}" />

其中，StrokeStartLineCap 和 StrokeEndLineCap 属性设置线条端点的形状，ArcThickness 属性设置圆弧的宽度，ArcStart 和 ArcEnd 属性设置圆弧的起点和终点。

3. 在 ViewModel 中定义 Progress 属性，并使用 Timer 定时更新进度：

public class MainWindowViewModel : INotifyPropertyChanged
{
    private int _progress;
    private Timer _timer;

    public int Progress
    {
        get => _progress;
        set
        {
            if (_progress != value)
            {
                _progress = value;
                OnPropertyChanged(nameof(Progress));
            }
        }
    }

    public MainWindowViewModel()
    {
        _timer = new Timer(100);
        _timer.Elapsed += (sender, e) =>
        {
            Progress += 5;
            if (Progress > 360)
            {
                Progress = 0;
            }
        };
        _timer.Start();
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}

完整代码示例：

MainWindow.xaml：

<Window x:Class="WpfApp1.MainWindow"
        xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
        xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
        xmlns:ed="http://schemas.efxui.com/xaml"
        Title="MainWindow" Height="200" Width="200">
    <Grid>
        <Grid.RowDefinitions>
            <RowDefinition Height="Auto" />
            <RowDefinition Height="*" />
        </Grid.RowDefinitions>
        <TextBlock Text="Progress:" Margin="5" />
        <ed:Arc Grid.Row="1" Stroke="Gray" StrokeThickness="10" StrokeStartLineCap="Round" StrokeEndLineCap="Round"
                ArcThickness="10" ArcStart="90" ArcEnd="{Binding Progress}" />
    </Grid>
</Window>

MainWindow.xaml.cs：

public partial class MainWindow : Window
{
    public MainWindow()
    {
        InitializeComponent();
        DataContext = new MainWindowViewModel();
    }
}

MainWindowViewModel.cs：

public class MainWindowViewModel : INotifyPropertyChanged
{
    private int _progress;
    private Timer _timer;

    public int Progress
    {
        get => _progress;
        set
        {
            if (_progress != value)
            {
                _progress = value;
                OnPropertyChanged(nameof(Progress));
            }
        }
    }

    public MainWindowViewModel()
    {
        _timer = new Timer(100);
        _timer.Elapsed += (sender, e) =>
        {
            Progress += 5;
            if (Progress > 360)
            {
                Progress = 0;
            }
        };
        _timer.Start();
    }

    public event PropertyChangedEventHandler PropertyChanged;

    protected void OnPropertyChanged(string propertyName)
    {
        PropertyChanged?.Invoke(this, new PropertyChangedEventArgs(propertyName));
    }
}