WPF开发者QQ群: 340500857 | 微信群 -> 进入公众号主页 加入组织
“ 前言,接着上一篇圆形菜单。”
欢迎转发、分享、点赞、在看,谢谢~。
01
—
效果预览
效果预览(更多效果请下载源码体验):
02
—
代码如下
一、CircularProgressBar.cs代码如下:
using System;
using System.Windows;
using System.Windows.Controls;
using System.Windows.Media.Animation;namespace WpfCircularProgressBar
{public partial class CircularProgressBar : ProgressBar{public CircularProgressBar(){this.ValueChanged += CircularProgressBar_ValueChanged;}void CircularProgressBar_ValueChanged(object sender, RoutedPropertyChangedEventArgs<double> e){CircularProgressBar bar = sender as CircularProgressBar;double currentAngle = bar.Angle;double targetAngle = e.NewValue / bar.Maximum * 359.999;DoubleAnimation anim = new DoubleAnimation(currentAngle, targetAngle, TimeSpan.FromMilliseconds(500));bar.BeginAnimation(CircularProgressBar.AngleProperty, anim, HandoffBehavior.SnapshotAndReplace);}public double Angle{get { return (double)GetValue(AngleProperty); }set { SetValue(AngleProperty, value); }}public static readonly DependencyProperty AngleProperty =DependencyProperty.Register("Angle", typeof(double), typeof(CircularProgressBar), new PropertyMetadata(0.0));public double StrokeThickness{get { return (double)GetValue(StrokeThicknessProperty); }set { SetValue(StrokeThicknessProperty, value); }}public static readonly DependencyProperty StrokeThicknessProperty =DependencyProperty.Register("StrokeThickness", typeof(double), typeof(CircularProgressBar), new PropertyMetadata(10.0));public double BrushStrokeThickness{get { return (double)GetValue(BrushStrokeThicknessProperty); }set { SetValue(BrushStrokeThicknessProperty, value); }}public static readonly DependencyProperty BrushStrokeThicknessProperty =DependencyProperty.Register("BrushStrokeThickness", typeof(double), typeof(CircularProgressBar), new PropertyMetadata(1.0));}
}
二、Style.Xaml代码如下:
<Style TargetType="local:CircularProgressBar"><Setter Property="Maximum" Value="100"/><Setter Property="StrokeThickness" Value="10"/><Setter Property="Foreground" Value="Gray"/><Setter Property="Background" Value="#1FA7FC"/><Setter Property="Width" Value="100"/><Setter Property="Height" Value="100"/><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="local:CircularProgressBar"><Viewbox><Canvas Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"><Path Stroke="{TemplateBinding BorderBrush}"StrokeThickness="{TemplateBinding BrushStrokeThickness}"><Path.Data><PathGeometry><PathFigure StartPoint="50,0"><ArcSegment SweepDirection="Clockwise"Size="50,50"Point="49.999127335374,7.61543361704753E-09"IsLargeArc="True"></ArcSegment></PathFigure></PathGeometry></Path.Data></Path><Path Stroke="{TemplateBinding Background}" StrokeThickness="{TemplateBinding StrokeThickness}"><Path.Data><PathGeometry><PathFigure StartPoint="50,0"><ArcSegment SweepDirection="Clockwise"Size="50,50"Point="{Binding Path=Angle, Converter={StaticResource prConverter}, RelativeSource={RelativeSource FindAncestor, AncestorType=ProgressBar}}"IsLargeArc="{Binding Path=Angle, Converter={StaticResource isLargeConverter}, RelativeSource={RelativeSource FindAncestor, AncestorType=ProgressBar}}"></ArcSegment></PathFigure></PathGeometry></Path.Data></Path><Border Width="{TemplateBinding Width}" Height="{TemplateBinding Height}"><TextBlock Foreground="{TemplateBinding Foreground}" HorizontalAlignment="Center" VerticalAlignment="Center"Text="{Binding Path=Value, StringFormat={}{0}%, RelativeSource={RelativeSource TemplatedParent}}"FontSize="{TemplateBinding FontSize}"/></Border></Canvas></Viewbox></ControlTemplate></Setter.Value></Setter>
</Style>
三、MainWindow.xaml代码如下:
<Window x:Class="WpfCircularProgressBar.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:WpfCircularProgressBar"mc:Ignorable="d"Title="MainWindow" Height="450" Width="800"><Grid><UniformGrid><local:CircularProgressBar Background="#21BA9D"Value="{Binding ElementName=CirularSlider,Path=Value}"BrushStrokeThickness="2"BorderBrush="LightGray"/><local:CircularProgressBar Background="#E14D5F" BorderBrush="#42ABAC" Value="{Binding ElementName=CirularSlider,Path=Value}"BrushStrokeThickness="4"/><local:CircularProgressBar Background="#1FA7FC" BorderBrush="#D6D6D6" Value="{Binding ElementName=CirularSlider,Path=Value}"BrushStrokeThickness="10"StrokeThickness="10"Foreground="Black"/><local:CircularProgressBar Value="{Binding ElementName=CirularSlider,Path=Value}"/><Slider Minimum="0" Maximum="100" x:Name="CirularSlider" IsSnapToTickEnabled="True"VerticalAlignment="Center" Value="10"/><Image Source="gzh.png"/></UniformGrid></Grid>
</Window>
源码地址
github:https://github.com/yanjinhuagood/WPFDevelopers.git
gitee:https://gitee.com/yanjinhua/WPFDevelopers.git
WPF开发者QQ群: 340500857
blogs: https://www.cnblogs.com/yanjinhua
Github:https://github.com/yanjinhuagood
出处:https://www.cnblogs.com/yanjinhua
版权:本作品采用「署名-非商业性使用-相同方式共享 4.0 国际」许可协议进行许可。
转载请著名作者 出处 https://github.com/yanjinhuagood