Silverlight 自定义 BusyIndicator

最新推荐文章于 2022-08-29 20:28:13 发布

原创最新推荐文章于 2022-08-29 20:28:13 发布 · 1.1k 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#silverlight #class

silverlight 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一个使用 WPF 实现的动画效果案例，通过定义一系列旋转和透明度变化的路径图形来创建视觉上的动态效果。这些路径图形围绕一个中心点旋转，并通过不同的开始时间和透明度动画实现渐变显示的效果。

<UserControl x:Class="Test.MainPage"
    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"
    mc:Ignorable="d"
    xmlns:sys="clr-namespace:System;assembly=mscorlib"
    d:DesignHeight="300" d:DesignWidth="400">
    <UserControl.Resources>
        <sys:String x:Key="data">M 0,0 L-2,0 L -2,-0 L0,-10 L 2,-10 L 2,0 Z</sys:String>
        <Storyboard x:Name="Storyboard1">
            <DoubleAnimation BeginTime="0:0:0"  Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p1"/>
            <DoubleAnimation BeginTime="0:0:0.8" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p2"/>
            <DoubleAnimation BeginTime="0:0:0.16" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p3" />
            <DoubleAnimation BeginTime="0:0:0.24" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p4" />
            <DoubleAnimation BeginTime="0:0:0.32" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p5" />
            <DoubleAnimation BeginTime="0:0:0.40" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p6" />
            <DoubleAnimation BeginTime="0:0:0.48" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p7" />
            <DoubleAnimation BeginTime="0:0:0.56" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p8" />
            <DoubleAnimation BeginTime="0:0:0.64" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p9" />
            <DoubleAnimation BeginTime="0:0:0.72" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p10" />
            <DoubleAnimation BeginTime="0:0:0.80" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p11" />
            <DoubleAnimation BeginTime="0:0:0.88" Duration="0:0:1" RepeatBehavior="Forever"   From="1" To="0.2"  Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="p12" />
        </Storyboard>
    </UserControl.Resources>
    <Grid x:Name="LayoutRoot" Background="White" Margin="100">

 void MainPage_Loaded(object sender, RoutedEventArgs e)
        {
            Storyboard1.Begin();
        }
        <Path x:Name="p1" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="0"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p2" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="30"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p3" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="60"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p4" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="90"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p5" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="120"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p6" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="150"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p7" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="180"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p8" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="210"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p9" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Opacity="0.2" Fill="Black">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="240"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p10" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="270"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p11" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="300"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
        <Path x:Name="p12" Data="{Binding Source={StaticResource data}}" Stroke="Gray" Fill="Black" Opacity="0.2">
            <Path.RenderTransform>
                <TransformGroup>
                    <TranslateTransform Y="-8"/>
                    <RotateTransform Angle="330"/>
                </TransformGroup>
            </Path.RenderTransform>
        </Path>
    </Grid>
 
</UserControl>