Android 实现水波纹效果

效果图

请添加图片描述

attrs.xml

自定义属性

 <declare-styleable name="RippleAnimationView"><attr name="ripple_anim_color" format="color" /><!--   水波纹填充类型     --><attr name="ripple_anim_type" format="enum"><enum name="fillRipple" value="0" /><enum name="strokeRipple" value="1" /></attr><!--    水波纹的半径    --><attr name="radius" format="integer" /><!--    水波纹边框大小    --><attr name="stroeWidth" format="integer" /></declare-styleable>

RippleAnimationView.java

管理水波纹属性以及动画状态

public class RippleAnimationView extends RelativeLayout {private Paint paint;private int radius;private int strokeWidth;private int rippleColor;private AnimatorSet animatorSet;public RippleAnimationView(Context context) {this(context, null);}public RippleAnimationView(Context context, @Nullable AttributeSet attrs) {this(context, attrs, 0);}public RippleAnimationView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);init(context, attrs);}private void init(Context context, AttributeSet attrs) {paint = new Paint();paint.setAntiAlias(true);TypedArray array = context.obtainStyledAttributes(attrs, R.styleable.RippleAnimationView);// 水波纹填充类型int rippleType = array.getInt(R.styleable.RippleAnimationView_ripple_anim_type, 0);radius = array.getInteger(R.styleable.RippleAnimationView_radius, 54);strokeWidth = array.getInteger(R.styleable.RippleAnimationView_stroeWidth, 2);rippleColor = array.getColor(R.styleable.RippleAnimationView_ripple_anim_color, ContextCompat.getColor(context,R.color.colorAccent));array.recycle();// 设置画笔线宽paint.setStrokeWidth(UIUtils.getInstance().getWidth(strokeWidth));if (rippleType == 0) {paint.setStyle(Paint.Style.FILL);} else {paint.setStyle(Paint.Style.STROKE);}paint.setColor(rippleColor);LayoutParams params = new LayoutParams(UIUtils.getInstance().getWidth(radius + strokeWidth),UIUtils.getInstance().getWidth(radius + strokeWidth));params.addRule(CENTER_IN_PARENT, TRUE);// 缩放系数float maxScale =   UIUtils.getInstance().displayMetricsWidth / (2 * UIUtils.getInstance().getWidth(radius + strokeWidth));// 延迟时间int rippleDuration = 3500;int singleDelay = rippleDuration / 4; // 时间间隔// 动画集合List<Animator> animatorList = new ArrayList<>();// 实例化水波纹viewfor (int i = 0;i<4;i++){RippleCircleView rippleCircleView = new RippleCircleView(this);addView(rippleCircleView,params);// 添加水波纹到集合viewList.add(rippleCircleView);// 初始化属性动画// xObjectAnimator scaleXAnimator = ObjectAnimator.ofFloat(rippleCircleView,"ScaleX",1.0f,maxScale);scaleXAnimator.setRepeatCount(ObjectAnimator.INFINITE);// 无限循环scaleXAnimator.setRepeatMode(ObjectAnimator.RESTART);scaleXAnimator.setStartDelay(i*singleDelay);scaleXAnimator.setDuration(rippleDuration);animatorList.add(scaleXAnimator);// yObjectAnimator scaleYAnimator = ObjectAnimator.ofFloat(rippleCircleView,"ScaleY",1.0f,maxScale);scaleYAnimator.setRepeatCount(ObjectAnimator.INFINITE);// 无限循环scaleYAnimator.setRepeatMode(ObjectAnimator.RESTART);scaleYAnimator.setStartDelay(i*singleDelay);scaleYAnimator.setDuration(rippleDuration);animatorList.add(scaleYAnimator);// alphaObjectAnimator alphaAnimator = ObjectAnimator.ofFloat(rippleCircleView,"Alpha",1.0f,0f);alphaAnimator.setRepeatCount(ObjectAnimator.INFINITE);// 无限循环alphaAnimator.setRepeatMode(ObjectAnimator.RESTART);alphaAnimator.setStartDelay(i*singleDelay);alphaAnimator.setDuration(rippleDuration);animatorList.add(alphaAnimator);}animatorSet = new AnimatorSet();animatorSet.setInterpolator(new AccelerateDecelerateInterpolator()); // 差值器:先加速，后减速animatorSet.playTogether(animatorList);}private boolean animationRunning;private List<RippleCircleView> viewList = new ArrayList<>();/*** 开启动画*/public void startRippleAnimation(){if (!animationRunning){for (RippleCircleView  rippleCircleView: viewList) {rippleCircleView.setVisibility(VISIBLE);}animatorSet.start();animationRunning = true;}}/***  结束动画*/public void stopRippleAnimation(){if (animationRunning){// 逆序播放（从外向内播放动画）Collections.reverse(viewList);for (RippleCircleView  rippleCircleView: viewList) {rippleCircleView.setVisibility(INVISIBLE);}animatorSet.end();animationRunning = false;}}public int getStrokeWidth() {return strokeWidth;}public Paint getPaint() {return paint;}public boolean isAnimationRunning() {return animationRunning;}
}

RippleCircleView.java

绘制水波纹

public class RippleCircleView extends View {private RippleAnimationView rippleAnimationView;public RippleCircleView(RippleAnimationView rippleAnimationView) {this(rippleAnimationView.getContext(),null);this.rippleAnimationView = rippleAnimationView;// 一开始隐藏this.setVisibility(INVISIBLE);}public RippleCircleView(Context context, @Nullable AttributeSet attrs) {super(context, attrs);}public RippleCircleView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {super(context, attrs, defStyleAttr);}@Overrideprotected void onDraw(Canvas canvas) {int radius = Math.min(getWidth(),getHeight()) / 2;// 画圆canvas.drawCircle(radius,radius,radius - rippleAnimationView.getStrokeWidth(),rippleAnimationView.getPaint());}
}

使用水波纹动画

<com.wangyi.course.lession4.RippleAnimationView xmlns:android="http://schemas.android.com/apk/res/android"xmlns:app="http://schemas.android.com/apk/res-auto"xmlns:tools="http://schemas.android.com/tools"android:id="@+id/ripple_view"android:layout_width="match_parent"android:layout_height="match_parent"app:ripple_anim_color="#c0362e"app:stroeWidth="18"app:ripple_anim_type="strokeRipple"app:radius="150"><ImageViewandroid:id="@+id/iv_play"android:layout_width="wrap_content"android:layout_height="wrap_content"android:layout_centerHorizontal="true"android:layout_centerVertical="true"android:src="@drawable/ic_play"/>
</com.wangyi.course.lession4.RippleAnimationView>

 RippleAnimationView rippleAnimationView = findViewById(R.id.ripple_view);findViewById(R.id.iv_play).setOnClickListener(new View.OnClickListener() {@Overridepublic void onClick(View v) {if (rippleAnimationView.isAnimationRunning()) {rippleAnimationView.stopRippleAnimation();} else {rippleAnimationView.startRippleAnimation();}}});

本文来自互联网用户投稿，该文观点仅代表作者本人，不代表本站立场。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如若转载，请注明出处：http://www.rhkb.cn/news/45521.html

如若内容造成侵权/违法违规/事实不符，请联系长河编程网进行投诉反馈email:809451989@qq.com，一经查实，立即删除！

相关文章

Android案例手册 - 定位点圆形水波纹和椭圆水波纹

Android案例手册 - 定位点圆形水波纹和椭圆水波纹

往期文章分享 点击跳转>《导航贴》- Unity手册&#xff0c;系统实战学习点击跳转>《导航贴》- Android手册&#xff0c;重温移动开发 本文约18千字&#xff0c;新手阅读需要18分钟&#xff0c;复习需要6分钟 【收藏随时查阅不再迷路】 &#x1f449;关于作者 众所周知&am…
阅读更多...
聊聊Android5.0中的水波纹效果

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

水波纹效果已经不是什么稀罕的东西了&#xff0c;用过5.0新控件的小伙伴都知道这个效果&#xff0c;可是如果使用一个TextView或者Button或者其它普通控件的话&#xff0c;你是否知道如何给它设置水波纹效果呢&#xff1f;OK&#xff0c;我们今天就来看看这个水波纹效果的实现。…
阅读更多...
Android开发中的水波纹效果实现

Android开发中的水波纹效果实现

编写不易&#xff0c;如有转载&#xff0c;请声明出处&#xff1a;http://blog.csdn.net/zxc514257857/article/details/73200900 前言 android中的水波纹效果是5.0以后即API Level 21以后出现的&#xff0c;因此minSdkVersion必须设置在21及以上才可以使用此效果 Demo效果展示…
阅读更多...
Android点击水波纹扩散效果整理（附带一个自定义的水波纹效果控件）

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

很久很久没有写博客了&#xff0c;说来也有点惭愧。正好最近整理自己的项目工程目录&#xff0c;看到一些值得分享的控件&#xff0c;准备在之后的几篇博客中准备把它们陆续搬运上来。 这篇博客准备整理一下Android Material Design自带的点击水波纹扩散的效果。话不多说&#…
阅读更多...
android 按钮水波纹效果【背景色】

android 按钮水波纹效果【背景色】

两种方式实现&#xff1a; 第一种&#xff1a;Material自带水波纹 通过如下代码设置波纹的背景&#xff1a; android:background"?android:attr/selectableItemBackground"波纹有边界【一般这种好看点&#xff0c;大多数也都是这种】 android:foreground"?…
阅读更多...
Android 水波纹扩散效果

Android 水波纹扩散效果

项目地址下载&#xff1a;https://github.com/LiuJunb/RippleImageView 1.效果图&#xff1a; 2.使用方法&#xff1a; 在xml里使用RippleImageView自定义控件&#xff1a; xmlns:app"http://schemas.android.com/apk/res-auto"<com.army.rippleimage.RippleIma…
阅读更多...
Android 自定义view实现水波纹效果

Android 自定义view实现水波纹效果

http://blog.csdn.net/tianjian4592/article/details/44222565 在实际的开发中&#xff0c;很多时候还会遇到相对比较复杂的需求&#xff0c;比如产品妹纸或UI妹纸在哪看了个让人兴奋的效果&#xff0c;兴致高昂的来找你&#xff0c;看了之后目的很明确&#xff0c;当然就是希望…
阅读更多...
Android点击Button水波纹效果

Android点击Button水波纹效果

先上图&#xff0c;看看接下来我要向大家介绍的是个什么东西&#xff0c;如下图&#xff1a; 接下来要介绍的就是如何实现上述图中的波纹效果&#xff0c;这种效果如果大家没有体验过的话&#xff0c;可以看看百度手机卫士或者360手机卫士&#xff0c;里面的按钮点击效果都是…
阅读更多...
unity 实现水的波纹效果

unity 实现水的波纹效果

之前的实现过这个效果&#xff0c;可惜没有记笔记&#xff0c;所以现在有点遗忘&#xff0c;连多个波纹一起在水面上实现的效果都忘记了&#xff0c;所以&#xff0c;查看了下之前实现的代码&#xff0c;现在再记一下笔记。 基础的波纹效果 要实现波纹&#xff0c;首先要知道…
阅读更多...
Android水波纹效果

Android水波纹效果

日常的Android开发中可能大家都见过类似这种水波纹展开的效果&#xff0c;比如加载一张图片的时候使用水波纹加载&#xff0c;其实这种实现非常简单。因为Google已经为我们提供了一个非常方便地工具类 ViewAnimationUtils 它的实现非常简单&#xff0c;就这个类&#xff0c;其…
阅读更多...
自定义view实现水波纹效果

自定义view实现水波纹效果

我正在参加 CSDN 2015博客之星评选 感恩分享活动&#xff0c;如果觉得文章还不错&#xff0c;请投个票鼓励下吧&#xff1a;http://vote.blog.csdn.net/blogstar2015/candidate?usernametianjian4592 在实际的开发中&#xff0c;很多时候还会遇到相对比较复杂的需求&#xf…
阅读更多...
Android L中水波纹点击效果的实现

Android L中水波纹点击效果的实现

博主参加了2014 CSDN博客之星评选&#xff0c;帮我投一票吧。 点击给我投票 前言 前段时间android L&#xff08;android 5.0&#xff09;出来了&#xff0c;界面上做了一些改动&#xff0c;主要是添加了若干动画和一些新的控件&#xff0c;相信大家对view的点击效果-水波纹很…
阅读更多...
科技云报道：垂直大模型竞争，能突破数据“卡点”吗？

科技云报道：垂直大模型竞争，能突破数据“卡点”吗？

科技云报道原创。 AI大模型火遍全球&#xff0c;中国产业也激发了对人工智能应用的新热情。 随着各大厂商参与竞逐&#xff0c;市场正在分化为通用与垂直两大路径&#xff0c;两者在参数级别、应用场景、商业模式等方面差异已逐步显现。 企业涌入垂直大模型赛道 通用AI大模型…
阅读更多...
【人工智能】论未来人工智能的大模型生态：重塑技术前景与应用

【人工智能】论未来人工智能的大模型生态：重塑技术前景与应用

目录 未来人工智能大模型生态：重塑技术前景与应用 引言 OpenAI 的 AGI 愿景
阅读更多...
创造之境：Stable Diffusion + chatGPT下的自动绘图探索

创造之境：Stable Diffusion + chatGPT下的自动绘图探索

什么是Stable Diffusion Stable Diffusion 是在2022年发布的深度学习文本到图像生成模型。它主要用于根据文字的描述生成详细图像&#xff0c;尽管它也可以应用于其他任务&#xff0c;如内插绘制、外插绘制&#xff0c;以及在提示词&#xff08;英语&#xff09;指导下生成图生…
阅读更多...
工具 | ChatPDF：与PDF对话！

工具 | ChatPDF：与PDF对话！

工具 | ChatPDF&#xff1a;与PDF对话&#xff01; 本文首发微信公众号&#xff1a;全副武装的大师兄 ChatPDF是什么&#xff1f; 它是一个在不到一周时间里&#xff0c;就让10万份PDF学会了聊天的应用&#xff01;无需注册&#xff0c;登录&#xff0c;通过上传PDF文件到Ch…
阅读更多...
微信公众号 接口配置

微信公众号 接口配置

1、登录微信公众平台-->设置与开发-->基本配置页面&#xff0c;打开服务器配置 2、在网站后台添加两个接口get请求验证和post请求消息转发&#xff0c;url为上图填写的url&#xff0c; RestController RequestMapping("/officialAccount/") public class Offic…
阅读更多...
亚马逊评论和销量的关系都有哪些呢？

亚马逊评论和销量的关系都有哪些呢？

评论和销量的关系非常密切。当然不是评论越多越好&#xff0c;更合理的评论对产品的关键词排名帮助更大。就连亚马逊也会推荐一些资源&#xff0c;所以推荐和曝光越多&#xff0c;销量也会增加越多。这也是为什么卖家都在努力增加Review数量&#xff0c;甚至花钱找人做评测还免…
阅读更多...
亚马逊评论的类型有哪些？都该怎么操作呢？

亚马逊评论的类型有哪些？都该怎么操作呢？

亚马逊评论对于亚马逊卖家店铺来说很重要的&#xff0c;评论又多又好的产品自然更受欢迎&#xff0c;但是评论肯定不只一种&#xff0c;那么亚马逊评论的类型有哪些&#xff1f;都该怎么操作呢&#xff1f; 亚马逊评论分为以下几种&#xff1a; 1、直评 直评是买家可以不用购…
阅读更多...
视频会议解决方案-最新全套文件

视频会议解决方案-最新全套文件

视频会议解决方案-最新全套文件 一、建设背景二、建设思路业务挑战 三、建设方案四、获取 - 视频会议全套最新解决方案合集 一、建设背景 随着中国经济的迅速发展&#xff0c;很多企业的发展也进入快车道&#xff0c;分支机构越来越多&#xff0c;形成了遍布全国范围甚至全球范…
阅读更多...
最新文章
推荐文章

Copyright @ 2022~2023