android 雷达搜索动画,Android特效专辑(九)——仿微信雷达搜索好友特效,逻辑清晰实现简单...
Android特效专辑(九)——仿微信雷达搜索好友特效,逻辑清晰实现简单
不知不觉这个春节也已经过完了,遗憾家里没网,没能及时给大家送上祝福,今天回到深圳,明天就要上班了,小伙伴们是不是和我一样呢?今天讲的是一个大家都见过的动画,雷达搜索好友嘛,原理也十分的简单,你看完我的分析,也会觉得很简单了,国际惯例,无图无真相,我们先看看效果图,对了,真
测试机送人了,所讲这段时间应该一直用模拟器显示吧!
截图
这个界面相信大家都认识,我们来说下原理,其实就三层
中间是一张图片,然后画四个圆,这个应该简单吧,不会的可以看下Android绘图机制(二)——自定义View绘制形, 圆形, 三角形, 扇形, 椭圆, 曲线,文字和图片的坐标讲解,然后最上面就是一个渐变的圆了,这个圆我们只要让他不停的旋转就可以了,那我们新建一个工程——RadarSearch
layou_main.xml
xmlns:tools="http://schemas.android.com/tools"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="@drawable/photo" >
android:layout_width="match_parent"
android:layout_height="match_parent" />
android:layout_width="wrap_content"
android:layout_height="wrap_content"
android:layout_centerInParent="true"
android:src="@drawable/circle_photo" />
我们新建一个RadarView
RadarView
package com.lgl.radarsearch;
import android.content.Context;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Paint.Style;
import android.graphics.Shader;
import android.graphics.SweepGradient;
import android.os.Handler;
import android.util.AttributeSet;
import android.view.View;
/**
* 雷达搜索
*
* @author LGL
*
*/
public class RadarView extends View {
/**
* 思路:我们首先初始化画笔,并且获取到控件的宽高,在onMeasure()中设置铺满,然后在onDraw()方法中绘制四个静态圆和一个渐变圆,
* 我们通过Matrix矩阵来让他不停的旋转就达到我们想要的效果了
*/
private Paint mPaintLine, mPaintCircle;
private int w, h;
// 动画
private Matrix matrix;
// 旋转角度
private int start;
// Handler定时动画
private Handler handler = new Handler();
private Runnable run = new Runnable() {
@Override
public void run() {
start = start + 1;
matrix = new Matrix();
// 参数:旋转角度,围绕点坐标的x,y坐标点
matrix.postRotate(start, w / 2, h / 2);
// 刷新重绘
RadarView.this.invalidate();
// 继续循环
handler.postDelayed(run, 60);
}
};
public RadarView(Context context, AttributeSet attrs) {
super(context, attrs);
initView();
// 获取高宽
w = context.getResources().getDisplayMetrics().widthPixels;
h = context.getResources().getDisplayMetrics().heightPixels;
// 一致旋转
handler.post(run);
}
private void initView() {
mPaintLine = new Paint();
mPaintLine.setColor(Color.WHITE);
mPaintLine.setAntiAlias(true);
mPaintLine.setStyle(Style.STROKE);
mPaintCircle = new Paint();
mPaintCircle.setColor(Color.RED);
mPaintCircle.setAntiAlias(true);
matrix = new Matrix();
}
/**
* 测量
*
* @author LGL
*/
@Override
protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
// 设置铺满
setMeasuredDimension(w, h);
}
@Override
protected void onDraw(Canvas canvas) {
super.onDraw(canvas);
// 画四个圆形
canvas.drawCircle(w / 2, h / 2, w / 2, mPaintLine);
canvas.drawCircle(w / 2, h / 2, w / 3, mPaintLine);
canvas.drawCircle(w / 2, h / 2, w * 7 / 10, mPaintLine);
canvas.drawCircle(w / 2, h / 2, w / 4, mPaintLine);
// 绘制渐变圆
Shader mShader = new SweepGradient(w / 2, h / 2, Color.TRANSPARENT,
Color.parseColor("#AAAAAAAA"));
// 绘制时渐变
mPaintCircle.setShader(mShader);
// 增加旋转动画,使用矩阵实现
canvas.concat(matrix); // 前置动画
canvas.drawCircle(w / 2, h / 2, w * 7 / 10, mPaintCircle);
}
}
android 雷达搜索动画,Android特效专辑(九)——仿微信雷达搜索好友特效,逻辑清晰实现简单...相关推荐
- android 雷达搜索动画,Android实现微信雷达辐射搜索好友实例(逻辑清晰实现简单)...
Android仿微信雷达扫描,仿安卓微信.云播雷达扫描动画效果点击中间的黑色圆圈开始扫描动画,再次点击复位,需要这种效果的朋友快点收藏了吧. 效果图如下: 这个界面大家肯定都非常熟悉了,下面来说一下原 ...
- android 辐射动画_Android仿微信雷达辐射搜索好友(逻辑清晰实现简单)
不知不觉这个春节也已经过完了,遗憾家里没网,没能及时给大家送上祝福,今天回到深圳,明天就要上班了,小伙伴们是不是和我一样呢?今天讲的是一个大家都见过的动画,雷达搜索好友嘛,原理也十分的简单,你看完我的 ...
- android 字母搜索栏,android仿微信通讯录搜索示例(匹配拼音,字母,索引位置)
前言: 仿微信通讯录搜索功能,通过汉字或拼音首字母找到匹配的联系人并显示匹配的位置 一:先看效果图 字母索引 搜索匹配 二:功能分析 1:汉字转拼音 通讯录汉字转拼音(首个字符当考虑姓氏多音字), 现 ...
- android 通讯录 首字母索引,android仿微信通讯录搜索(匹配拼音,字母,索引位置标记颜色)...
前言: 仿微信通讯录搜索功能,通过汉字或拼音首字母找到匹配的联系人并显示匹配的位置 一:先看效果图 字母索引 搜索匹配 二:功能分析 1:汉字转拼音 通讯录汉字转拼音(首个字符当考虑姓氏多音字), 现 ...
- Android显示九宫图(自定义圆角,仿微信九宫格图)
详细解析Android显示九宫图(自定义圆角,仿微信九宫格图) 这是一个自定义九宫格图片框架,里面有设置圆角大小,还有当图片一张的时候控件自定义的大小,图片的间隔,四张图片的时候图片自定义为两行两列等 ...
- android 直播评论动画,Android自定义View实现直播点赞特效
由于开发的需要,需要开发类似直播点赞特效的需求,于是自定义View来实现这种效果 案例图: 1.自定义View import android.animation.Animator; import an ...
- android 仿搜索动画,Android仿京东顶部搜索框滑动伸缩动画效果
最近使用京东发现,京东顶部的搜索框有一个新的伸缩效果,根据用户的手势滑动,伸缩搜索框.觉得效果还不错,就看了下其他的应用有没有这种伸缩的效果,发现安居客也使用了类似的一种效果,然后就想着实现这样的一种 ...
- android 撒花动画,Android仿QQ聊天撒花特效 很真实
先看看效果图吧 实现这样的效果,你要知道贝塞尔曲线,何谓贝塞尔曲线?先在这里打个问号 下面就直接写了 1.activity_main.xml xmlns:tools="http://sche ...
- android 上下扫描动画,Android扫描雷达动画
很简单的一个组合动画,用好基本动画啥子效果都不怕 老规矩先上图 效果图.gif ok 来 既然往下翻那就看看如何实现的吧 首先效果分为两部分 第一部分中间指针(其实这里就是一张图片) 第二部分就是波纹 ...
- android 语音搜索动画,Android自定义控件实现UC浏览器语音搜索效果
最近项目上要实现语音搜索功能,界面样式要模仿一下UC浏览器的样式,UC浏览器中有一个控件,会随着声音大小浮动,然后寻思偷个懒,百度一下,结果也没有找到类似的,只能自己动手了. 先上图看我实现的效果: ...
最新文章
- Servlet防止页面被客户端缓存
- 服务发现对比:Zookeeper vs. etcd vs. Consul
- 面进了心心念念的国企!以为TM上岸了!干了1年!我却再次选择回到互联网大厂内卷!
- 开启Thread线程只执行一次
- 职业生涯的8种德---非常重要
- FileChannel应用实例——本地文件读数据
- 【LeetCode】LC1672. 最富有客户的资产总量
- oracle 常见操作
- .netCore2.0 依赖注入
- 蓝桥杯第四届初赛-买不到的数目-数论
- python三大结构、顺序结构_Python学习笔记3——三大结构:顺序,分支,循环3
- javascript的拖放(第1部分)
- python 写文件 编码_Python文件写入时的编码问题解决
- wp8 应用推荐photobeamer
- Thinkphp结合phpqrcode生成二维码海报代码
- 第9章 逻辑回归 学习笔记 下
- 靠微信小程序两周获客20万,同城小程序开始爆发
- stm32mp157开发板MIC 接口测试方法
- ArcGIS学习网站
- python游戏开发框架_Python游戏开发:数字华容道
热门文章
- BAT机器学习面试1000题系列
- 干扰管理学习日志4-------信道估计方法 LS(最小二乘)、MMSE(最小均方误差)
- 拼多多直通车有作用?新手为什么不适合开直通车?
- Mysql8.0安装步骤
- edge便捷截取长图
- 动作捕捉用于蛇运动分析及蛇形机器人开发
- WPS删除多余空白页
- 解决High bias 和High variance 的方法
- C# 按拼音/笔划 排序的简单示例(转)
- deep-text-recognition-benchmark 项目训练data.mdb数据集,运行日志中,只显示训练了英文和数字