Android仿微信雷达扫描效果的实现方法

本文主要给大家介绍的是关于Android实现微信雷达扫描效果的相关内容,分享出来供大家参考学习,下面来看看详细的介绍:

废话不多说 先上图(用AS录制的 转换工具不是很好 所以看得效果不是很好)

效果图

示例代码

Activity 代码

public class ShapeDrawableActivity extends AppCompatActivity { private ImageView ivLightbeam; private ObjectAnimator radarScanAnim; // 扫描动画 private int width; private int height; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_shape_drawable); ivLightbeam = (ImageView) findViewById(R.id.ivLightbeam); } @Override protected void onResume() { super.onResume(); startScan(); } @Override public void onWindowFocusChanged(boolean hasFocus) { super.onWindowFocusChanged(hasFocus); if (height == 0 || width == 0) { //获取屏幕长、宽 width = ScreenUtils.getScreenWidth(this); height = ScreenUtils.getScreenHeight(this); //根据屏幕长、宽计算扫描圆的直径 int diameter = (int) Math.sqrt(Math.pow(height, 2) + Math.pow(width, 2)); //修改光束的大小,使光束可以扫描到整个屏幕 FrameLayout.LayoutParams layoutParams = new FrameLayout.LayoutParams(diameter, diameter); ivLightbeam.setLayoutParams(layoutParams); //将扫描光束的中心移至屏幕内容中心 int offsetX = (width - diameter) / 2; int offsetY = (height - diameter) / 2 + ScreenUtils.getStatusHeight(this) / 2; ivLightbeam.setX(offsetX); ivLightbeam.setY(offsetY); } } @Override protected void onPause() { super.onPause(); stopScan(); } // 开始扫描 private void startScan() { radarScanAnim = ObjectAnimator.ofFloat(ivLightbeam, "rotation", 0f, 360f); radarScanAnim.setDuration(2000); //2秒扫描一圈 radarScanAnim.setInterpolator(new LinearInterpolator()); radarScanAnim.setRepeatCount(ObjectAnimator.INFINITE);//循环扫描 ivLightbeam.setVisibility(View.VISIBLE); radarScanAnim.start(); } // 停止扫描 private void stopScan() { ivLightbeam.setVisibility(View.GONE); radarScanAnim.end(); } }

Activity 布局文件

<FrameLayout xmlns:android="http://schemas.android.com/apk/res/android" xmlns:tools="http://schemas.android.com/tools" android:layout_width="match_parent" android:layout_height="match_parent" android:background="#FA000000" android:clipToPadding="false" android:fitsSystemWindows="true"> <ImageView android:id="@+id/ivWave" android:layout_width="match_parent" android:layout_height="match_parent" android:layout_margin="5dp" android:src="@drawable/wave" /> <ImageView android:id="@+id/ivLightbeam" android:layout_width="match_parent" android:layout_height="match_parent" android:src="@drawable/light_beam" /> </FrameLayout>

绘制扫描光束

<shape xmlns:android="http://schemas.android.com/apk/res/android" android:shape="oval"> <size android:width="500dp" android:height="500dp" /> <gradient android:endColor="#AAAAAAAA" android:startColor="#00000000" android:type="sweep" /> </shape>

绘制雷达波纹

<layer-list xmlns:android="http://schemas.android.com/apk/res/android"> <item> <!--最外层圆圈--> <shape android:shape="oval"> <solid android:color="#10FFFFFF" /> <size android:width="600dp" android:height="600dp" /> <stroke android:color="#10B8B8B8" android:dashWidth="1dp" /> </shape> </item> <item android:bottom="100dp" android:left="100dp" android:right="100dp" android:top="100dp"> <!--最中间层圆圈--> <shape android:shape="oval"> <solid android:color="#1CFFFFFF" /> <stroke android:color="#1CB8B8B8" android:dashWidth="1dp" /> </shape> </item> <item android:bottom="200dp" android:left="200dp" android:right="200dp" android:top="200dp"> <!--最中心圆圈--> <shape android:shape="oval"> <solid android:color="#2CFFFFFF" /> <stroke android:color="#2CB8B8B8" android:dashWidth="1dp" /> </shape> </item> </layer-list>

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对脚本之家的支持。

时间: 2024-10-24 01:20:43

Android仿微信雷达扫描效果的实现方法的相关文章

Android仿微信雷达辐射搜索好友(逻辑清晰实现简单)_Android

不知不觉这个春节也已经过完了,遗憾家里没网,没能及时给大家送上祝福,今天回到深圳,明天就要上班了,小伙伴们是不是和我一样呢?今天讲的是一个大家都见过的动画,雷达搜索好友嘛,原理也十分的简单,你看完我的分析,也会觉得很简单了,国际惯例,无图无真相,我们先看看效果图,对了,真 测试机送人了,所讲这段时间应该一直用模拟器显示吧! 仿微信雷达扫描,仿安卓微信.云播雷达扫描动画效果点击中间的黑色圆圈开始扫描动画,再次点击复位,需要这种效果的朋友可以自己下载看一下. 效果图如下所示: 这个界面相信大家都认识

Android仿微信雷达辐射搜索好友(逻辑清晰实现简单)

不知不觉这个春节也已经过完了,遗憾家里没网,没能及时给大家送上祝福,今天回到深圳,明天就要上班了,小伙伴们是不是和我一样呢?今天讲的是一个大家都见过的动画,雷达搜索好友嘛,原理也十分的简单,你看完我的分析,也会觉得很简单了,国际惯例,无图无真相,我们先看看效果图,对了,真 测试机送人了,所讲这段时间应该一直用模拟器显示吧! 仿微信雷达扫描,仿安卓微信.云播雷达扫描动画效果点击中间的黑色圆圈开始扫描动画,再次点击复位,需要这种效果的朋友可以自己下载看一下. 效果图如下所示: 这个界面相信大家都认识

Android仿微信底部菜单栏效果

前言 在市面上,大多数的APP都需要通过底部菜单栏来将程序的功能进行分类整理,通常都是分为3-5个大模块,从而正确有效地引导用户去使用我们的APP.实现底部菜单栏的方法也有很多种. 1.仿微信底部菜单栏(ViewPager+ImagerView+TextView) ......(其他方式后续会补充) 效果预览 首先来个开胃菜,看看实现效果: 先贴出项目所需的资源文件,这些可随个人自由更改颜色和文字 colors.xml <color name="bg_line_light_gray&quo

Android动画之雷达扫描效果

我们首先看一下效果图,有个整体的印象 好了,为了便于理解,这里就按照动画所见内容依次展开来说 准备 这里决定采用canvas(画布)和paint(画笔)实现了这个简单动画控件. 由图片可以看到有两条交叉的十字线.几个圆圈和一些白点,那么首先定义一下所需的画笔,画布及一些数据 setBackgroundColor(Color.TRANSPARENT); //宽度=5,抗锯齿,描边效果的白色画笔 mPaintLine = new Paint(); mPaintLine.setStrokeWidth(

android 仿微信聊天气泡效果实现思路_Android

微信聊天窗口的信息效果类似iphone上的短信效果,以气泡的形式展现,在Android上,实现这种效果主要用到ListView和BaseAdapter,配合布局以及相关素材,就可以自己做出这个效果,素材可以下一个微信的APK,然后把后缀名改成zip,直接解压,就可以得到微信里面的所有素材了.首先看一下我实现的效果: 以下是工程目录结构: 接下来就是如何实现这个效果的代码: main.xml,这个是主布局文件,显示listview和上下两部分内容. 复制代码 代码如下: <?xml version

android 仿微信聊天气泡效果实现思路

微信聊天窗口的信息效果类似iphone上的短信效果,以气泡的形式展现,在Android上,实现这种效果主要用到ListView和BaseAdapter,配合布局以及相关素材,就可以自己做出这个效果,素材可以下一个微信的APK,然后把后缀名改成zip,直接解压,就可以得到微信里面的所有素材了.首先看一下我实现的效果: 以下是工程目录结构: 接下来就是如何实现这个效果的代码: main.xml,这个是主布局文件,显示listview和上下两部分内容. 复制代码 代码如下: <?xml version

android仿微信的开门效果

有人已经发过了,我掐头去尾精简了一下     这种效果跟图和布局有很大关系,并不难.  先看布局:  <?xml version="1.0" encoding="utf-8"?> <LinearLayout xmlns:android="http://schemas.android.com/apk/res/android" android:layout_width="fill_parent" android:

Android特效专辑(九)——仿微信雷达搜索好友特效,逻辑清晰实现简单

Android特效专辑(九)--仿微信雷达搜索好友特效,逻辑清晰实现简单 不知不觉这个春节也已经过完了,遗憾家里没网,没能及时给大家送上祝福,今天回到深圳,明天就要上班了,小伙伴们是不是和我一样呢?今天讲的是一个大家都见过的动画,雷达搜索好友嘛,原理也十分的简单,你看完我的分析,也会觉得很简单了,国际惯例,无图无真相,我们先看看效果图,对了,真 测试机送人了,所讲这段时间应该一直用模拟器显示吧! 截图 这个界面相信大家都认识,我们来说下原理,其实就三层 中间是一张图片,然后画四个圆,这个应该简单

华为 动画效果 无效-android 仿微信在application里面设置页面跳转动画的theme 有些机型没有效果

问题描述 android 仿微信在application里面设置页面跳转动画的theme 有些机型没有效果 想做一个仿微信的左右切换动画,根据这篇文章的写法 ,发现,华为p7 系统是4.4.2 上面,根本不起作用,还是手机默认的动画效果,只有在代码里写 override 动画才起作用,求解决方案