Wpf-自定义控件波纹Button

使用用户控件,继承Button

前端代码

XML 复制代码
<Button x:Class="WpfApp1.SuperButton"
        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:local="clr-namespace:WpfApp1"
        xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
        d:DesignHeight="450" d:DesignWidth="800"
        mc:Ignorable="d">
    <Button.Template>
        <ControlTemplate TargetType="Button">
            <Border BorderBrush="{TemplateBinding BorderBrush}" CornerRadius="5">
                <Border.Style>
                    <Style TargetType="Border">
                        <Style.Triggers>
                            <Trigger Property="IsMouseOver" Value="True">
                                <Setter Property="Effect">
                                    <Setter.Value>
                                        <DropShadowEffect Direction="-90" Opacity="0.5"
                                                          ShadowDepth="1" Color="Gray" />
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                            <Trigger Property="IsMouseOver" Value="False">
                                <Setter Property="Effect">
                                    <Setter.Value>
                                        <DropShadowEffect Direction="0" Opacity="0"
                                                          ShadowDepth="0" />
                                    </Setter.Value>
                                </Setter>
                            </Trigger>
                        </Style.Triggers>
                    </Style>
                </Border.Style>
                <Grid Background="{TemplateBinding Background}"
                      ClipToBounds="True"
                      MouseLeftButtonDown="Grid_MouseLeftButtonDown">
                    <ContentPresenter HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                                      VerticalAlignment="{TemplateBinding VerticalContentAlignment}"
                                      Content="{TemplateBinding Content}" />
                    <Path x:Name="MyPath" Fill="Black">
                        <Path.Data>
                            <EllipseGeometry x:Name="MyEll" RadiusY="{Binding RelativeSource={RelativeSource Mode=Self}, Path=RadiusX}" />
                        </Path.Data>
                    </Path>
                </Grid>
            </Border>
        </ControlTemplate>
    </Button.Template>
</Button>

后端代码

cs 复制代码
    /// <summary>
    /// SuperButton.xaml 的交互逻辑
    /// </summary>
    public partial class SuperButton : Button
    {
        public SuperButton()
        {
            InitializeComponent();
        }

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

        }
    }
相关推荐
c4fx8 分钟前
Delphi5利用DLL实现窗体的重用
开发语言·delphi·dll
鸽芷咕31 分钟前
【Python报错已解决】ModuleNotFoundError: No module named ‘paddle‘
开发语言·python·机器学习·bug·paddle
Jhxbdks41 分钟前
C语言中的一些小知识(二)
c语言·开发语言·笔记
java66666888841 分钟前
如何在Java中实现高效的对象映射:Dozer与MapStruct的比较与优化
java·开发语言
Violet永存42 分钟前
源码分析:LinkedList
java·开发语言
代码雕刻家43 分钟前
数据结构-3.1.栈的基本概念
c语言·开发语言·数据结构
Fan_web1 小时前
JavaScript高级——闭包应用-自定义js模块
开发语言·前端·javascript·css·html
梦想科研社1 小时前
【无人机设计与控制】四旋翼无人机俯仰姿态保持模糊PID控制(带说明报告)
开发语言·算法·数学建模·matlab·无人机
风等雨归期1 小时前
【python】【绘制小程序】动态爱心绘制
开发语言·python·小程序
千穹凌帝1 小时前
SpinalHDL之结构(二)
开发语言·前端·fpga开发