动态改变画刷

  首先设置Fill.GradientOrigin属性,线性渐变有一个起点和一个终点用于定义渐变矢量,而径向渐变有一个椭圆以及一个焦点 (GradientOrigin) 用于定义渐变行为该椭圆定义渐变的终点。然后再设置Fill.GradientStops属性。Ellipse椭圆,设置椭圆填充色径向渐变最后在使用镜像梯度画刷ColorAnimation改变颜色,使用PointAnimatin改变坐标

 

  <Window.Triggers>

        <EventTrigger RoutedEvent="Window.Loaded">

            <EventTrigger.Actions>

                <BeginStoryboard>

                    <Storyboard>

                        <PointAnimation Storyboard.TargetName="ellipse1" 

                                    Storyboard.TargetProperty="Fill.GradientOrigin" 

                                    To="1,1" Duration="0:0:5" />

                        <ColorAnimation Storyboard.TargetName="ellipse1" 

                                    Storyboard.TargetProperty="Fill.GradientStops[0].Color" 

                                    To="Pink" Duration="0:0:5" />

                        <ColorAnimation Storyboard.TargetName="ellipse1" 

                                    Storyboard.TargetProperty="Fill.GradientStops[1].Color" 

                                    To="Gold" Duration="0:0:5" />

                        <ColorAnimation Storyboard.TargetName="ellipse1" 

                                    Storyboard.TargetProperty="Fill.GradientStops[2].Color" 

                                    To="Gray" Duration="0:0:5" />

                    </Storyboard>

                </BeginStoryboard>

            </EventTrigger.Actions>

        </EventTrigger>

    </Window.Triggers>

 

    <Grid>

        <Ellipse Name="ellipse1" Width="150" Height="150">

            <Ellipse.Fill>

                <RadialGradientBrush GradientOrigin="0.1,0.1">

                    <RadialGradientBrush.GradientStops>

                      <GradientStop Offset="0.3" Color="PowderBlue"/>

                        <GradientStop Offset="0.6" Color="Purple"/>

                        <GradientStop Offset="0.9" Color="Gainsboro"/>

                    </RadialGradientBrush.GradientStops>

                </RadialGradientBrush>

            </Ellipse.Fill>

        </Ellipse>

</Grid>

原图:

效果图:

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值