WPF開發者QQ群：?340500857? | 微信群 -> 進入公眾號主頁?加入組織

?? ? ?由于微信群人數太多入群請添加小編微信號

（yanjinhuawechat）或（W_Feng_aiQ）邀請入群

（需備注WPF開發者）

? PS：有更好的方式歡迎推薦。

01

—

代碼如下

一、創建?RingLoading.cs 繼承?Control代碼如下。

using System.Windows; using System.Windows.Controls;namespace WPFDevelopers.Controls {public class RingLoading : Control{static RingLoading(){DefaultStyleKeyProperty.OverrideMetadata(typeof(RingLoading), new FrameworkPropertyMetadata(typeof(RingLoading)));}public bool IsStart{get { return (bool)GetValue(IsStartProperty); }set { SetValue(IsStartProperty, value); }}public static readonly DependencyProperty IsStartProperty =DependencyProperty.Register("IsStart", typeof(bool), typeof(RingLoading), new PropertyMetadata(default));public double Progress{get { return (double)GetValue(ProgressProperty); }set { SetValue(ProgressProperty, value); }}public static readonly DependencyProperty ProgressProperty =DependencyProperty.Register("Progress", typeof(double), typeof(RingLoading), new PropertyMetadata(default));public double Maximum{get { return (double)GetValue(MaximumProperty); }set { SetValue(MaximumProperty, value); }}public static readonly DependencyProperty MaximumProperty =DependencyProperty.Register("Maximum", typeof(double), typeof(RingLoading), new PropertyMetadata(1d));public string Description{get { return (string)GetValue(DescriptionProperty); }set { SetValue(DescriptionProperty, value); }}public static readonly DependencyProperty DescriptionProperty =DependencyProperty.Register("Description", typeof(string), typeof(RingLoading), new PropertyMetadata(default));} }

二、RingLoading.xaml 代碼如下

<Style TargetType="controls:RingLoading" BasedOn="{StaticResource ControlBasicStyle}"><Setter Property="Template"><Setter.Value><ControlTemplate TargetType="controls:RingLoading"><ControlTemplate.Resources><Storyboard x:Key="PART_Resource_Storyboard" RepeatBehavior="Forever"><DoubleAnimation To="-495" Duration="0:0:1.5" Storyboard.TargetName="PART_Ring1" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"/><DoubleAnimation To="585" Duration="0:0:1.5" Storyboard.TargetName="PART_Ring2" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"/><DoubleAnimation To="-315" Duration="0:0:1.5" Storyboard.TargetName="PART_Ring3" Storyboard.TargetProperty="(UIElement.RenderTransform).(TransformGroup.Children)[2].(RotateTransform.Angle)"/></Storyboard></ControlTemplate.Resources><Grid><Grid.RowDefinitions><RowDefinition Height="*"/><RowDefinition Height="Auto"/></Grid.RowDefinitions><Viewbox HorizontalAlignment="Center" VerticalAlignment="Center" ><Border Padding="10" Width="100" Height="100" ><Grid><Grid x:Name="PART_Ring1" Width="60" Height="60" HorizontalAlignment="Center" VerticalAlignment="Top" RenderTransformOrigin="0.5,0.5"><Grid.RenderTransform><TransformGroup><ScaleTransform/><SkewTransform/><RotateTransform Angle="-135"/><TranslateTransform/></TransformGroup></Grid.RenderTransform><Ellipse Stroke="Red" StrokeThickness="2" StrokeDashArray="23 100" RenderTransformOrigin="0.5,0.5"/><Border Width="10" Height="10" CornerRadius="10" Background="Red" HorizontalAlignment="Right" Margin="0,0,-4,0"><Border.Effect><DropShadowEffect BlurRadius="10" ShadowDepth="0" Color="Red"/></Border.Effect></Border></Grid><Grid x:Name="PART_Ring2" Width="60" Height="60" HorizontalAlignment="Left" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5"><Grid.RenderTransform><TransformGroup><ScaleTransform/><SkewTransform/><RotateTransform Angle="225"/><TranslateTransform/></TransformGroup></Grid.RenderTransform><Ellipse Stroke="Purple" StrokeThickness="2" StrokeDashArray="23 100"/><Border Width="10" Height="10" CornerRadius="10" Background="Purple" VerticalAlignment="Bottom" HorizontalAlignment="Center" Margin="0,0,0,-4"><Border.Effect><DropShadowEffect BlurRadius="10" ShadowDepth="0" Color="Purple"/></Border.Effect></Border></Grid><Grid x:Name="PART_Ring3" Width="60" Height="60" HorizontalAlignment="Right" VerticalAlignment="Bottom" RenderTransformOrigin="0.5,0.5"><Grid.RenderTransform><TransformGroup><ScaleTransform/><SkewTransform/><RotateTransform Angle="45"/><TranslateTransform/></TransformGroup></Grid.RenderTransform><Ellipse Stroke="#0fb8b2" StrokeThickness="2" StrokeDashArray="23 100"/><Border Width="10" Height="10" CornerRadius="10" Background="#0fb8b2" HorizontalAlignment="Right" Margin="0,0,-4,0"><Border.Effect><DropShadowEffect BlurRadius="10" ShadowDepth="0" Color="#0fb8b2"/></Border.Effect></Border></Grid></Grid></Border></Viewbox><StackPanel Grid.Row="1" Grid.ColumnSpan="2" Margin="10"><TextBlock HorizontalAlignment="Center" Text="Loading..." Margin="0,0,0,15"/><TextBlock HorizontalAlignment="Center" Text="{TemplateBinding Description}" Margin="0,0,0,15"/><TextBlock HorizontalAlignment="Center" Text="{TemplateBinding Progress}" FontSize="{StaticResource TitleFontSize}" FontWeight="Bold"/></StackPanel></Grid><ControlTemplate.Triggers><Trigger Property="IsStart" Value="True"><Trigger.EnterActions><BeginStoryboard Storyboard="{StaticResource PART_Resource_Storyboard}" x:Name="PART_BeginStoryboard"/></Trigger.EnterActions><Trigger.ExitActions><StopStoryboard BeginStoryboardName="PART_BeginStoryboard"/></Trigger.ExitActions></Trigger></ControlTemplate.Triggers></ControlTemplate></Setter.Value></Setter> </Style>

02

—

效果預覽

鳴謝素材提供者 - 吳鋒

源碼地址如下

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

掃一掃關注我們，

更多知識早知道！

點擊閱讀原文可跳轉至源代碼

總結

以上是生活随笔為你收集整理的WPF 实现一个酷酷的Loading的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。