android 自定义红心,Android自定义View实现抖音飘动红心效果
本文实例为大家分享了Android自定义View实现抖音飘动红心效果的具体代码,供大家参考,具体内容如下
自定义View——抖音飘动红心
效果展示
动画效果
使用自定义view完成红心飘动效果
View实现
动画:属性动画(位移+缩放+透明度+旋转)
+
随机数:(属性动画参数+颜色选取)
View
/**
* 飘心效果
* 1.创建ImageView
* 2.ImageView执行组合动画
* 3.动画执行完成后销毁View
*/
public class FlyHeartView extends RelativeLayout {
private int defoutWidth = 200;//默认控件宽度
private long mDuration = 3000;//默认动画时间
//颜色集合 从中获取颜色
private int[] color = {
0xFFFF34B3, 0xFF9ACD32, 0xFF9400D3, 0xFFEE9A00,
0xFFFFB6C1, 0xFFDA70D6, 0xFF8B008B, 0xFF4B0082,
0xFF483D8B, 0xFF1E90FF, 0xFF00BFFF, 0xFF00FF7F
};
public FlyHeartView(Context context) {
super(context);
initFrameLayout();
}
public FlyHeartView(Context context, AttributeSet attrs) {
super(context, attrs);
initFrameLayout();
}
private void initFrameLayout() {
ViewGroup.LayoutParams params = new ViewGroup.LayoutParams(defoutWidth, ViewGroup.LayoutParams.WRAP_CONTENT);
setLayoutParams(params);
}
/**
* 创建一个心形的view视图
*/
private ImageView createHeartView() {
ImageView heartIv = new ImageView(getContext());
LayoutParams params = new LayoutParams(defoutWidth / 2, defoutWidth / 2);
//控件位置
params.addRule(RelativeLayout.ALIGN_PARENT_BOTTOM);
params.addRule(RelativeLayout.CENTER_HORIZONTAL);
heartIv.setLayoutParams(params);
heartIv.setImageResource(R.mipmap.ic_heart);
//改变颜色
heartIv.setImageTintList(ColorStateList.valueOf(color[(int) (color.length * Math.random())]));
return heartIv;
}
/**
* 执行动画
* 在展示调用该方法
*/
public void startFly() {
final ImageView heartIv = createHeartView();
addView(heartIv);
AnimatorSet animatorSet = new AnimatorSet();
animatorSet.play(createTranslationX(heartIv))
.with(createTranslationY(heartIv))
.with(createScale(heartIv))
.with(createRotation(heartIv))
.with(createAlpha(heartIv));
//执行动画
animatorSet.start();
//销毁view
animatorSet.addListener(new AnimatorListenerAdapter() {
@Override
public void onAnimationEnd(Animator animation) {
super.onAnimationEnd(animation);
removeView(heartIv);
}
});
}
/**
* 横向正弦位移动画
*
* @return
*/
private Animator createTranslationX(View view) {
ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationX", 0, (float) (defoutWidth * Math.random() / 4));
animator.setDuration(mDuration);
//CycleInterpolator cycles 正弦曲线数
animator.setInterpolator(new CycleInterpolator((float) (3 * Math.random())));
return animator;
}
/**
* 纵向加速位移动画
*
* @return
*/
private Animator createTranslationY(View view) {
ObjectAnimator animator = ObjectAnimator.ofFloat(view, "translationY", 0, -1000);
animator.setDuration(mDuration);
animator.setInterpolator(new AccelerateInterpolator());
return animator;
}
/**
* 加速放大动画
*
* @return
*/
private Animator createScale(View view) {
ObjectAnimator animatorX = ObjectAnimator.ofFloat(view, "scaleX", 1, 1.5f);
ObjectAnimator animatorY = ObjectAnimator.ofFloat(view, "scaleY", 1, 1.5f);
AnimatorSet animatorSet = new AnimatorSet();
animatorSet.setDuration(mDuration);
animatorSet.setInterpolator(new AccelerateInterpolator());
animatorSet.play(animatorX).with(animatorY);
return animatorSet;
}
/**
* 透明度动画
*
* @return
*/
private Animator createAlpha(View view) {
ObjectAnimator animator = ObjectAnimator.ofFloat(view, "alpha", 1, 0.1f);
animator.setDuration(mDuration);
animator.setInterpolator(new AccelerateInterpolator());
return animator;
}
/**
* 旋转动画
*
* @return
*/
private Animator createRotation(View view) {
ObjectAnimator animator = ObjectAnimator.ofFloat(view, "rotation", 0, (float) (25f * Math.random()));
animator.setDuration(mDuration);
animator.setInterpolator(new CycleInterpolator((float) (6 * Math.random())));
return animator;
}
}
最后在MainActivity中调用FlyHeartView 的startFly()方法就能实现点击飘心效果。
以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
android 自定义红心,Android自定义View实现抖音飘动红心效果相关推荐
- Android 抖音爱心动画,Android自定义View实现抖音飘动红心效果
本文实例为大家分享了Android自定义View实现抖音飘动红心效果的具体代码,供大家参考,具体内容如下 自定义View--抖音飘动红心 效果展示 动画效果 使用自定义view完成红心飘动效果 Vie ...
- 自定义View:仿抖音直播点赞效果
目录 一.效果图 1.第一版本:在屏幕底部开始显示 2.第二版本:点击任意位置都可以显示 3.第三版本:给任意控件添加点赞效果 二.代码 1.第一版本代码 源码: 示例: 2.第二版本代码 源码(主要 ...
- 【自定义View】抖音网红文字时钟-上篇
源码地址 抖音网红文字时钟-TextClockView 起源 周末在家刷抖音的时候看到了这款网红时钟,都是Android平台的,想来何不自己实现一把.看抖音里大家发的视频,这款时钟基本分两类,一类是展 ...
- Android 使用ViewPager2+ExoPlayer+VideoCache 实现仿抖音视频翻页播放
1. 实现效果 效果图中,视频没有铺满 是因为使用了ExoPlayer的RESIZE_MODE_FIT模式, 虽然使用RESIZE_MODE_FILL模式可以填充整个父布局,但是本Demo中使用的视频 ...
- Android仿抖音双击点赞动画,Android仿抖音点击效果
原标题:Android仿抖音点击效果 作者丨wish_xy https://www.jianshu.com/p/1d17c38a3db1 学习自定义view,想找点东西耍一下,刚好看到抖音的点赞效果不 ...
- Android 利用ConstraintLayout 实现仿抖音点赞动画效果
正好在做一个和抖音差不多的APP,目前在刚启动阶段,先从实现一个抖音的点赞动画开始...爱心是从阿里的矢量图标库下载的一个爱心的Png图片,不是使用贝塞尔曲线画的...原因是我不会贝塞尔曲线(其实就是 ...
- 微信小程序实现抖音切换视频效果
微信小程序实现抖音切换视频效果 思路: 使用微信小程序的swiper组件,使其竖向滑动 分页加载,每次加载3个视频,当滑动到只剩1个视频时加载下一页 问题: 加载多个视频时,多个视频会同时播放 效果图 ...
- 仿抖音短视频源码,高仿抖音双击点赞效果之双击的问题
仿抖音短视频源码中,实现仿抖音的双击点赞效果,相关代码如下: public class MyView extends View {private GestureDetector gestureDete ...
- html5仿抖音切换效果,仿抖音视频滑动效果
更新记录 1.6.2(2020-06-04) 优化css3动画效果 1.6.1(2020-05-23) 1.修复串音 2.新增进度条 3.新增弹幕 查看更多 scroll-video uniapp仿抖 ...
最新文章
- 清华《摸鱼学导论》开课啦!1000多学子在线摸鱼,开课老师为大一新生
- C语言经典例19-完数
- 【Android】init.rc
- 红宝石服务器文件,使用红宝石MAMP作为本地服务器访问SQL语句
- 互联网晚报 | 3月11日 星期五 |​ ​​商汤科技在深圳成立新公司,;微信支付电子小票上线...
- 公众平台小程序文档和工具
- SCCM2007系列教程之七软件的分发
- 【Python】从0到1:30行代码制作表白窗口!(可直接copy + 运行哦~)
- fiddler抓包HTTPS请求
- 2号团队-团队任务5:项目总结会
- 交互技术基础(复习)
- 爬楼梯java(leetcode70)
- amcharts的使用
- 如何使用视频压缩软件,压缩视频大小 ?
- android 远吗编译 刷机 小米,小米10/小米10 Pro系统源代码现已开源,能刷机才是为发烧而生...
- PHP拆分粘连的英文单词,英语单词拆分技巧
- 相机上的这个自定义功能太好用了
- :hover的几种选择用法
- MAX40026 280ps高速比较器
- 短信验证(手机号注册,绑定手机号获取验证码)
热门文章
- 数据类型之字节与字符的区别
- LMS算法实现自适应滤波器
- 【求助】AttachThreadInput 返回值为0,GetLastError取得的错误码为5(访问拒绝),怎么解决啊
- windowbuilder安装过程及常见问题解决
- 直播电商源码,通过vue实现直播聊天
- 人脸识别批量生成一寸登记照 I.D. Photo
- 英雄联盟总结之网络框架(笔记分享)
- ps去除图片中间部分并拼合
- 用计算机处理公文,2016年事业单位考试指导:计算机公文处理中的流程及要点...
- Solidify实现一个智能合约12(字典/映射)