点击图片产生水波的动画效果代码展示

Unity Shader-后处理:屏幕水波效果 一.简介 最近在打黑魂,被虐得死去活来,每次都是想砸电脑的节奏,然而还是忍不住想玩,唉。在被虐了千百遍之后,我发现写代码比玩游戏爽....下面步入正题,黑魂的传送技能之前会播放一个帅帅的屏幕特效-屏幕水波,从屏幕中间向四周扩散开来,很有赶脚。下面附上一张截图: 阅读详情

效果展示先:
这里写图片描述

XMl布局中的代码

 <com.example.administrator.gamehleper.widget.ScaleView
            <ImageView
            android:id="@+id/iv_download"
            android:layout_width="48dp"
            android:layout_height="48dp"
             android:src="@mipmap/ic_launcher" />
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:text="每日礼包"
                android:textSize="20dp"
                android:textColor="#FFFFFF"
                android:gravity="center"/>
        </com.example.administrator.gamehleper.widget.ScaleView>

产生都动画效果ScaleView类中的代码:

public class ScaleView extends RelativeLayout {

    private int maxLength;

    private float radiu;

    private float centerX, centerY;

    private Paint paint;

    private float FACTOR=0.1F;

    public ScaleView(Context context, AttributeSet attrs) {
        super(context, attrs);
        paint = new Paint();
        paint.setAntiAlias(true);
        paint.setStyle(Paint.Style.FILL);
        paint.setColor(Color.parseColor("#55ffffff"));
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        //当手指抬起表示确认才执行操作
        if (event.getAction() == MotionEvent.ACTION_UP) {
            radiu = 0;
            maxLength = (int) Math.sqrt(Math.pow(getWidth(), 2) + Math.pow(getHeight(), 2));
            centerX = event.getX();
            centerY = event.getY();
            startScaleAnimation();
            invalidate();
        }
        return true;
    }

    private void startScaleAnimation() {
        ObjectAnimator animator=ObjectAnimator.ofFloat(this,"xxx",0,1).setDuration(300);
        animator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
            @Override
            public void onAnimationUpdate(ValueAnimator animation) {
                float progress= (float) animation.getAnimatedValue();
                updateView(progress);
            }
        });
        animator.start();
    }

    private void updateView(float progress) {
        setPivotX(getWidth()/2);
        setPivotY(getHeight()/2);
        if(progress>=0&&progress<=0.5f){
            setScaleX(1+FACTOR*progress);
            setScaleY(1+FACTOR*progress);
        }else{
            setScaleX(1+FACTOR*(1-progress));
            setScaleY(1+FACTOR*(1-progress));
        }
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        if (radiu > maxLength) {
            return;
        }
        canvas.drawCircle(centerX, centerY, radiu, paint);
        radiu = radiu + 30;
        //防止第一次进入onDraw
        invalidate();
    }
}
一个鼠标点击水波纹理shader 一张图片,通过鼠标点击产生水波纹理,shader比较简单,算法主要在C#那边,多线程优化计算 用下面shader创建一个材质,创建一个面片或Cube并挂上下面C#脚本,设置图片像素,默认是256*256,赋值材质图片纹理,运行,点击鼠标即可看到效果 shader Shader "Zon/WaveTexture" { Properties { _MainTex ("水波纹理", 阅读详情

相关推荐

javascript实现的图片点击水波荡漾效果

javascript实现的图片点击水波荡漾效果 javascript实现的图片点击水波荡漾效果

微信小程序———点击屏幕涟漪效果

js中 containerTap: function (res) { console.log(res.touches[0]); var x = res.touches[0].pageX; var y = res.touches[0].pageY + 85; this.setData({ rippleStyle: '' }); th...

Fighting社火底子 4505

jQuery实现点击水纹波动动画

今天要为大家绍一款由jquery实现的鼠标单击出现水波特效。用鼠标点击页面,你可以看到页面不断出面水波纹效果。然后水波纹渐渐消失。效果非常不错

android水波纹点击动画,android 控件点击水波纹效果的几种方案

目前我所知道的至少有三种可以实现点击水波纹的效果第一种:安卓自带的方法在安卓中有自带的一种属性,可以实现水波纹的效果,就是在所需要点击的控件属性加上如下代码:android:background="?attr/selectableItemBackground"这种水波纹效果只适用于5.0以后的安卓系统第二种:编写ripple文件在res文件先创建drawable-v21文件夹,并在文件夹下创建ri...

weixin_42126274的博客 1551

jQuery水纹波动动画效果特效代码

jQuery水纹波动动画效果代码是一款类似水滴滴下的瞬间水波纹波动jQuery特效。

CSS3实现水波浪浮动特效特效代码

CSS3实现水波浪浮动特效是一款效果逼真的水波纹动画效果下载。

水波动画的实现

CAMediaTimingFunction *defaultCurve = [CAMediaTimingFunction functionWithName:kCAMediaTimingFunctionDefault];          CAAnimationGroup *animationGroup = [CAAnimationGroup animation];     animati

majiakun1的专栏 1634

C# Socket网络通信UDP(关键字:Socket)

简单Socket-Udp通信 在本文中涉及到通信,仅做简单的通信(服务端接受消息,由客户端发出消息) 如有需要,根据需求可直接copy使用 关键字Socket 需要引用命名空间: using System.Net; using System.Net.Sockets; 服务端: using System; using System.Net; using System.Net.Sockets; u...

MelanceXin的博客 3885

Android点击水波纹扩散效果整理(附带一个自定义的水波纹效果控件)

很久很久没有写博客了,说来也有点惭愧。正好最近整理自己的项目工程目录,看到一些值得分享的控件,在之后的几篇博客中准备把它们陆续搬运上来。 这篇博客准备整理一下Android Material Design自带的点击水波纹扩散的效果。话不多说,开始正题。 水波纹效果分为两种:有界水波纹和无界水波纹。都通过系统自带的动画文件实现。 有界水波纹: 有界水波纹通过系统自带的动画文件selectableItemBackground实现只要将其设置为控件的背景即可。简单写几句代码: &...

Sure_Min的博客 6314

多摄像头同步技术:帧同步信号在Sensor与解串器间的传递机制

本文深入探讨了多摄像头系统中帧同步信号的两种核心传递机制:由解串器统一发号施令或由主Sensor作为“带头大哥”。文章对比了两种方案在同步精度、硬件复杂度、成本及适用场景上的差异,并提供了实战配置要点与调试心法,为车载环视、ADAS及工业检测等应用提供关键的技术选型与实施指导。

weixin_29193359的博客 434

手把手教你解决COLMAP编译中的Ceres CUDA支持问题(附详细配置步骤)

本文详细解析了COLMAP编译中Ceres CUDA支持问题的完整解决方案,包括环境准备、Ceres Solver的CUDA编译配置、COLMAP的CUDA集成配置等关键步骤。通过优化CMake参数和解决常见错误,帮助技术人员充分利用GPU加速优势,提升三维重建效率。

vodka的博客 858

网页展示水波纹效果 css水波效果

网页展示水波纹效果 预览 思路 在页面底部展示多张水波的图片,然后让每张水波以不同的方向和速度进行移动,并给不同的水波设置不同的透明度。 代码 HTML <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" co...

一碗单炒饭的专栏 3738

OctoMag: An Electromagnetic System for 5-DOF Wireless Micromanipulation

电磁线圈组驱动经典系统,可以作为参考。 OctoMag: 用于5自由度无线微操作的一个电磁铁系统 OctoMag: An Electromagnetic System for 5-DOF Wireless Micromanipulation [1] Paper Link Authors: J. J. Abbott, etc. 2010, TRO IEEE Transactions on Robot...

XU Yangxin的博客 1665

使用CSS实现逼真的水波纹点击效果

这篇文章特别介绍如何使用CSS来完成水波纹的效果。div的层层叠叠虽然webkit具有遮罩的能力(webkit mask),不过webkit虽然强大,但在跨浏览器上总是它的罩门,况且在性能上也是往往会造成困扰(这也是为什么chrome要这么吃资源了),因此撇开webkit不谈,我们该用什么方法,才可以做出水波纹的效果呢?答案就是用“叠”的方式,这个水波纹效果的原理其实就是用六个div叠在一起,接着...

weixin_34088838的博客 3860

【GlobalMapper精品教程】073:像素到点(Pixels-to-Points)从无人机图像轻松生成点云

Global Mapper v19引入的新的像素到点工具使用摄影测量原理,从重叠图像生成高密度点云、正射影像及三维模型。它使LiDAR模块成为已经功能很强大的的必备Global Mapper扩展功能。打开GlobalmapperV25.1中文版,点击【Lidar分析】→【像素到点云】,如下所示:V25之前的版本点击工具条上的【像素到点】工具:打开工具,可以【使用向导选】,或者选择【使用主窗口】,都很简单。

智慧空间实验室 1972

Android 12 大屏时底下显示任务栏以及虚拟按键靠右问题

Android 12 点大屏时,底下导航栏变成显示任务栏,虚拟按键靠右的分析以及修改

Android系统开发笔记 4686

android 点击图片动画,Android实用小特效 图片点击放大、水波纹动画和旋转图片...

代码分享->一、小图片点击放大~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~1.实现效果图2.实现代码android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout...

weixin_29383429的博客 550

uniapp - 详细手机端h5网页调用手机摄像头进行二维码识别扫描,在uniapp的H5移动端微信网页平台中,在浏览器中调用手机扫码功能详细教程,识别二维码并获取扫描结果(完整示例源码,一键复制即用

uniapp,h5,手机端网页,H5手机网页,uniapp开发h5实现扫码功能,uniapp微信h5网页扫码sdk使用教程,uniapp h5网页如何实现浏览器扫码,uniapp扫码功能怎么兼容h5_uniapph5怎么做扫码功能,uniapp的手机网页如何实现扫二维码一维码,浏览器H5实现js扫码,H5调用摄像头和扫一扫功能,亲测可用,H5调用本地摄像头实现扫一扫,uni-h5项目解决扫码功能,uniapp实现微信H5扫码,解决uniapp在H5端使用不能扫码问题,uni-app的h5扫码(二维码、条形码

✅ 精选推荐文章 1万+

html制作点击效果,使用 HTML5 Canvas 制作水波纹效果点击图片就会触发

今天,我们继续分享 JavaScript 实现的效果例子,这篇文章会介绍使用 JavaScript 实现水波纹效果。水波效果以图片为背景,点击图片任意位置都会触发。有时候,我们使用普通的 Javascript 就可以创建一个很有趣的解决功能。源码下载Step 1. HTML和以前一样,首先是 HTML 代码:复制代码代码如下:Water drops effectWater drops effect...

weixin_35059431的博客 641

keil工程After Build/Rebuild添加带参.exe实现全流程(2):带参调用.exe的几种方法

keil工程After Build/Rebuild添加带参.exe实现全流程(2):带参调用.exe的几种方法。

kevin1499的博客 1617

OV9734 DATASHEET,完整规格书

OV9734完整规格书,包括电气参数,尺寸规格,寄存器配置表等

Android实现旋转、扩散、水波纹效果动画

先上图 可以将这种效果分为3个动画:1、旋转,2、扩散,3、水波纹效果 1、旋转 首先先确定角度,6个小球占满360°,因此每个小球之间相隔60°。将2π作为圆的一圈,那么可以确定相隔的角度为: float angle = (float) (Math.PI * 2 / mCircleColors.length); 由勾股定理可知: x = r * cos(angle) y = r * sin(a...

weixin_45253393的博客 3326

Devexpress16.2.6破解工具

Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具Devexpress16.2.6破解工具

Android水波纹效果

Android水波纹加载效果

进击的小怪兽 2319

文档:亲测可用解决vnc灰屏,黑屏,鼠标大黑叉情况

主要解决vnc-viewer灰屏,黑屏,鼠标大黑叉等现象,详细见文档。

android 实现点击水波纹,Android 水波纹点击效果(Ripple Effect)

上周Android发布了Android M的Preview版本.但想必Android5.0很多炫酷效果,多数开发者还没有使用过,那更不要说广大用户了.本文介绍的是Android5.0中其中一个炫酷的效果,点击水波纹扩散效果(Ripple Effect).以下介绍的实现方式都是调用Android5.0的新API,并非自定义实现,所以支持在Android5.0的设备.而大家想兼容低系统版本的话,就需要...

weixin_35381077的博客 3123

IOS 实现点击按钮水波纹效果

#import "ViewController.h" @interface ViewController () @end @implementation ViewController - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loa...

weixin_34009794的博客 981

按钮点击水波纹效果【ripple】

水波纹效果已经不是什么稀罕的东西了,用过5.0新控件的小伙伴都知道这个效果,可是如果使用一个TextView或者Button或者其它普通控件的话,你是否知道如何给它设置水波纹效果呢?OK,我们今天就来看看这个水波纹效果的实现。水波纹效果的实现有系统自带属性可以实现,我们也可以自定义实现效果。 1.系统自带水波纹实现方式 有界水波纹 水波纹效果大致上可以分为两种,一种是有界的,一种无界,我们先来...

fengyeNom1的博客 1097

Flutter中为图片设置波纹点击效果

flutter开发中,为图片添加水波纹点击事件

代码小疯子 1994
上一篇: 自定义Android标题栏TitleBar布局
下一篇: 自定义书签导航
Allen-华
博客等级 码龄11年 10粉丝 33原创
评论
成就一亿技术人!
拼手气红包6.0元
还能输入1000个字符
 
 条评论被折叠 查看
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明:

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

余额充值