Android仿微信雷达扫描效果的实现方法
时间：2021-02-03 18:27:29|栏目：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>
总结
