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);
}

WPF按钮实现水波纹效果的更多相关文章

  1. jquery ripples水波纹效果( 涟漪效果)

    这个效果是我从bootstrap-material-design上面分离下来的,bootstrap-material-design的一些组件样式我不太不喜欢,但是非常喜欢这个水波纹效果,所以就有了这篇 ...

  2. Android自定义控件-Path之贝赛尔曲线和手势轨迹、水波纹效果

    从这篇开始,我将延续androidGraphics系列文章把图片相关的知识给大家讲完,这一篇先稍微进阶一下,给大家把<android Graphics(二):路径及文字>略去的quadTo ...

  3. Android点击Button水波纹效果

    先上图,看看接下来我要向大家介绍的是个什么东西,例如以下图: 接下来要介绍的就是怎样实现上述图中的波纹效果.这样的效果假设大家没有体验过的话,能够看看百度手机卫士或者360手机卫士,里面的按钮点击效果 ...

  4. 如何使用 HTML5 Canvas 制作水波纹效果

    今天,我们继续分享 JavaScript 实现的效果例子,这篇文章会介绍使用 JavaScript 实现水波纹效果.水波效果以图片为背景,点击图片任意位置都会触发.有时候,我们使用普通的 Javasc ...

  5. 兼容Android的水波纹效果

    Android的水波纹效果只有高版本才有,我们希望自己的应用在低版本用低版本的阴影,高版本用水波纹,这怎么做呢?其实,只要分drawable和drawablev21两个文件夹就好了. 普通情况下的se ...

  6. android自定义控件(4)-自定义水波纹效果

    一.实现单击出现水波纹单圈效果: 照例来说,还是一个自定义控件,观察这个效果,发现应该需要重写onTouchEvent和onDraw方法,通过在onTouchEvent中获取触摸的坐标,然后以这个坐标 ...

  7. 自定义view实现水波纹效果

    水波纹效果: 1.标准正余弦水波纹: 2.非标准圆形液柱水波纹: 虽说都是水波纹,但两者在实现上差异是比较大的,一个通过正余弦函数模拟水波纹效果,另外一个会运用到图像的混合模式(PorterDuffX ...

  8. Android 颜色渲染(七) RadialGradient 环形渲染实现水波纹效果

    利用环形渲染我们可以做到什么? 其实很多都是非常常见的,比如上一篇实现的帮帮糖效果, 彩色的热气球,比如这里要讲到的水波纹效果,或者也可以理解为扩散色渲染效果 首先看一下效果图: 轻触屏幕,即可看到对 ...

  9. 聊聊Android5.0中的水波纹效果

    水波纹效果已经不是什么稀罕的东西了,用过5.0新控件的小伙伴都知道这个效果,可是如果使用一个TextView或者Button或者其它普通控件的话,你是否知道如何给它设置水波纹效果呢?OK,我们今天就来 ...

随机推荐

  1. 精尽Spring Boot源码分析 - 日志系统

    该系列文章是笔者在学习 Spring Boot 过程中总结下来的,里面涉及到相关源码,可能对读者不太友好,请结合我的源码注释 Spring Boot 源码分析 GitHub 地址 进行阅读 Sprin ...

  2. 明明是企业管理软件,CRM系统为何被抵触?

    小编在昨天的文章<CRM系统为什么没有达到预期效果?>中曾说过,CRM客户管理系统没有达到预期效果的其中一个原因是CRM系统的使用率太低,而根本的原因是员工的抵触.明明是企业管理大师,CR ...

  3. 二维动态规划&&二分查找的动态规划&&最长递增子序列&&最长连续递增子序列

    题目描述与背景介绍 背景题目: [674. 最长连续递增序列]https://leetcode-cn.com/problems/longest-continuous-increasing-subseq ...

  4. 想用Electron做个小工具?这个或许是终极版

    故事背景 之前在网上有看到很多小伙伴基于 electron 实现了非常多好用的桌面端工具,比如图床管理工具 PicGo,就专门做图床工具.也有一些其他的类似的小工具,比如 saladict-deskt ...

  5. 前端集合传参,springmvc后端如何接收

    废话不多说,上代码 后端接收对象: class ObjectA{ private String a; private String b; private List<ObjectB> lis ...

  6. charles证书导入系统信任区(Android7.0以上)

    打开charles,跟着下图来,下载好charles的证书 后缀是pem的格式,挺方便的了,burp的证书是der的,还需要再进一步转化成pem,这里就不再多说, 利用openssl来计算出文件名 加 ...

  7. WPF教程五:附加依赖项属性

    附加依赖项属性是一个属性本来不属于对象自己,但是某些特定场景其他的对象要使用该对象在这种场景下的值.这个值只在这个场景下使用.基于这个需求设计出来的属性.这里主要涉及到一个解耦问题.最大的优势是在特定 ...

  8. C语言:地址

    一切都是地址 C语言用变量来存储数据,用函数来定义一段可以重复使用的代码,它们最终都要放到内存中才能供 CPU 使用.数据和代码都以二进制的形式存储在内存中,计算机无法从格式上区分某块内存到底存储的是 ...

  9. ADB命令 连接WIFI检测序列号

    利用ADB 电脑与手机相连 查看序列号: adb shell  getprop ro.serialno 查看机器的SN号 adb shell getprop 查看机器的全部信息参数 查看IP地址: a ...

  10. Nacos 2.0源码分析-拦截器机制

    温馨提示: 本文内容基于个人学习Nacos 2.0.1版本代码总结而来,因个人理解差异,不保证完全正确.如有理解错误之处欢迎各位拍砖指正,相互学习:转载请注明出处. Nacos服务端在处理健康检查和心 ...