先看效果图

1.界面代码

<UserControl x:Class="LensAgingTest.CycleProcessBar1"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:LensAgingTest"mc:Ignorable="d" d:DesignHeight="450" d:DesignWidth="800"><Grid><Viewbox><Grid Width="34" Height="34"><Path Name="myCycleProcessBar" Data="M17,3 A14,14 0 1 0 17.001,3 " Stroke="LightGray" StrokeThickness="3" Height="34" Width="34" VerticalAlignment="Center" HorizontalAlignment="Center"/><Path Name="myCycleProcessBar1" Data="M17,3 A14,14 0 0 1 16,3 " Stroke="Green" StrokeThickness="3" Height="34" Width="34" VerticalAlignment="Center" HorizontalAlignment="Center"></Path><Label Name="lbValue" Content="50%" HorizontalAlignment="Center" VerticalAlignment="Center" FontSize="9" /></Grid></Viewbox></Grid>
</UserControl>

2.后台代码

using System;
using System.Collections.Generic;
using System.Linq;
using System.Text;
using System.Threading.Tasks;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Data;
using System.Windows.Documents;
using System.Windows.Input;
using System.Windows.Media;
using System.Windows.Media.Imaging;
using System.Windows.Navigation;
using System.Windows.Shapes;namespace LensAgingTest
{/// <summary>/// CycleProcessBar1.xaml 的交互逻辑/// </summary>public partial class CycleProcessBar1 : UserControl{public CycleProcessBar1(){InitializeComponent();}public double CurrentValue1{set { SetValue(value); }}/// <summary>/// 设置百分百，输入小数，自动乘100/// </summary>/// <param name="percentValue"></param>private void SetValue(double percentValue){/*****************************************方形矩阵边长为34，半长为17环形半径为14，所以距离边框3个像素环形描边3个像素******************************************/double angel = percentValue * 360; //角度double radius = 14; //环形半径//起始点double leftStart = 17;double topStart = 3;//结束点double endLeft = 0;double endTop = 0;//数字显示lbValue.Content = (percentValue * 100).ToString("0") + "%";/************************************************ 整个环形进度条使用Path来绘制，采用三角函数来计算* 环形根据角度来分别绘制，以90度划分，方便计算比例***********************************************/bool isLagreCircle = false; //是否优势弧，即大于180度的弧形//小于90度if (angel <= 90){/*******************   ** * ra* * * * * * * * **********************/double ra = (90 - angel) * Math.PI / 180; //弧度endLeft = leftStart + Math.Cos(ra) * radius; //余弦横坐标endTop = topStart + radius - Math.Sin(ra) * radius; //正弦纵坐标}else if (angel <= 180){/*******************  * * * * * * * * * ** * ra*  **   *******************/double ra = (angel - 90) * Math.PI / 180; //弧度endLeft = leftStart + Math.Cos(ra) * radius; //余弦横坐标endTop = topStart + radius + Math.Sin(ra) * radius;//正弦纵坐标}else if (angel <= 270){/*******************  * * * * * * * * * ** **ra**   *******************/isLagreCircle = true; //优势弧double ra = (angel - 180) * Math.PI / 180;endLeft = leftStart - Math.Sin(ra) * radius;endTop = topStart + radius + Math.Cos(ra) * radius;}else if (angel < 360){/******************   **  *  ra * * * * * * * * * * **********************/isLagreCircle = true; //优势弧double ra = (angel - 270) * Math.PI / 180;endLeft = leftStart - Math.Cos(ra) * radius;endTop = topStart + radius - Math.Sin(ra) * radius;}else{isLagreCircle = true; //优势弧endLeft = leftStart - 0.001; //不与起点在同一点，避免重叠绘制出非环形endTop = topStart;}Point arcEndPt = new Point(endLeft, endTop); //结束点Size arcSize = new Size(radius, radius);SweepDirection direction = SweepDirection.Clockwise; //顺时针弧形//弧形ArcSegment arcsegment = new ArcSegment(arcEndPt, arcSize, 0, isLagreCircle, direction, true);//形状集合PathSegmentCollection pathsegmentCollection = new PathSegmentCollection();pathsegmentCollection.Add(arcsegment);//路径描述PathFigure pathFigure = new PathFigure();pathFigure.StartPoint = new Point(leftStart, topStart); //起始地址pathFigure.Segments = pathsegmentCollection;//路径描述集合PathFigureCollection pathFigureCollection = new PathFigureCollection();pathFigureCollection.Add(pathFigure);//复杂形状PathGeometry pathGeometry = new PathGeometry();pathGeometry.Figures = pathFigureCollection;//Data赋值//myCycleProcessBar.Data = pathGeometry;myCycleProcessBar1.Data = pathGeometry;//达到100%则闭合整个if (angel == 360)myCycleProcessBar1.Data = Geometry.Parse(myCycleProcessBar1.Data.ToString() + " z");}}
}