zoukankan      html  css  js  c++  java
  • WPF按钮实现水波纹效果

    xaml代码如下

    <Button x:Class="UI.btn.ZButton"
                 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" 
                     xmlns:i="http://schemas.microsoft.com/xaml/behaviors" xmlns:btn="clr-namespace:UI.btn"
            d:DesignHeight="450" d:DesignWidth="800" Cursor="Hand">
        <Button.Template>
            <ControlTemplate  TargetType="Button" >
                <Grid ClipToBounds="True" Background="{TemplateBinding Background}" MouseLeftButtonDown="Grid_MouseLeftButtonDown"  >
                    <Border>
                        <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}" VerticalAlignment="{TemplateBinding VerticalContentAlignment}" Content="{TemplateBinding Content}"  >
                        </ContentPresenter>
                    </Border>
                    <Path Fill="Black" x:Name="MyPath">
                        <Path.Data>
                            <EllipseGeometry x:Name="MyEllip" Center="{Binding MyProperty}"   RadiusX="0" RadiusY="{Binding RelativeSource={RelativeSource Mode=Self},Path=RadiusX}">
                            </EllipseGeometry>
                        </Path.Data>
                    </Path>
                </Grid> 
            </ControlTemplate>
        </Button.Template>
    </Button>

    CS代码

    private void Grid_MouseLeftButtonDown(object sender, MouseButtonEventArgs e)
            {
             var target=Template.FindName("MyEllip", this) as EllipseGeometry;
                target.Center = Mouse.GetPosition(this);
                var animation = new DoubleAnimation()
                {
                    From=0,
                    To=150,
                    Duration=new Duration(TimeSpan.FromSeconds(1))
                };
                target.BeginAnimation(EllipseGeometry.RadiusXProperty, animation);
                var animation2 = new DoubleAnimation()
                {
                    From = 0.3,
                    To = 0,
                    Duration = new Duration(TimeSpan.FromSeconds(1))
                };
                var target2= Template.FindName("MyPath",this) as Path;
                target2.BeginAnimation(Path.OpacityProperty, animation2);
            }

  • 相关阅读:
    tab切换与表格展示
    ajax
    api
    slice() 方法
    iframe跳转
    快排序
    【问题排查】cpu占用过高排查
    LOJ6013 负载平衡 [最小费用最大流]
    随机序列 [思维题, 组合数]
    P1777 帮助 [状压dp]
  • 原文地址:https://www.cnblogs.com/zt199510/p/13224906.html
Copyright © 2011-2022 走看看