写在之前:
关于WPF的样式,我也是学习了很多朋友的文章才有了下面的东西,因为时间有些久远 & 备份的链接也都不在了。
所以,究竟是看过哪些文章,也是记不清楚了……
请见谅。
--------------------------------我是害羞的分割线-----------------------------------
旋转小圆圈进度条见效果:
xaml:
<UserControl x:Class="AppHost.ProbarRotate" 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" mc:Ignorable="d" d:DesignHeight="300" d:DesignWidth="300"> <UserControl.Resources> <ResourceDictionary> <Style x:Key="EllipseStyle" TargetType="Ellipse"> <Setter Property="Width" Value="16"/> <Setter Property="Height" Value="16"/> <Setter Property="Stretch" Value="Fill"/> <Setter Property="Fill" Value="#FF2CB6E7"/> </Style> </ResourceDictionary> </UserControl.Resources> <Grid x:Name="LayoutRoot" Background="Transparent" HorizontalAlignment="Center" VerticalAlignment="Center"> <Grid.RenderTransform> <ScaleTransform x:Name="SpinnerScale" ScaleX="1.0" ScaleY="1.0" /> </Grid.RenderTransform> <Canvas RenderTransformOrigin="0.5,0.5" Width="120" Height="120" HorizontalAlignment="Center" VerticalAlignment="Center" > <Ellipse Style="{StaticResource EllipseStyle}" Opacity="1.0" Canvas.Left="14.64" Canvas.Top="14.64" /> <Ellipse Style="{StaticResource EllipseStyle}" Opacity="0.8" Canvas.Left="0" Canvas.Top="50" /> <Ellipse Style="{StaticResource EllipseStyle}" Opacity="0.6" Canvas.Left="14.64" Canvas.Top="85.35" /> <Ellipse Style="{StaticResource EllipseStyle}" Opacity="0.4" Canvas.Left="50" Canvas.Top="100" /> <Ellipse Style="{StaticResource EllipseStyle}" Opacity="0.2" Canvas.Left="85.35" Canvas.Top="85.35" /> <Ellipse Style="{StaticResource EllipseStyle}" Opacity="0.1" Canvas.Left="100" Canvas.Top="50" /> <Canvas.RenderTransform> <RotateTransform x:Name="SpinnerRotate" Angle="0" /> </Canvas.RenderTransform> <Canvas.Triggers> <EventTrigger RoutedEvent="ContentControl.Loaded"> <BeginStoryboard> <Storyboard> <DoubleAnimation Storyboard.TargetName ="SpinnerRotate" Storyboard.TargetProperty ="(RotateTransform.Angle)" From="0" To="360" Duration="0:0:05" RepeatBehavior="Forever" /> </Storyboard> </BeginStoryboard> </EventTrigger> </Canvas.Triggers> </Canvas> </Grid> </UserControl>
使用方法与系列①类似。
时间: 2024-10-17 10:58:45