时间:2021-05-21
本文实例为大家分享了Android雷达扫描效果的具体代码,供大家参考,具体内容如下
效果图
知识点提要
ShaderView3
package com.example.apple.shaderdemo;import android.content.Context;import android.graphics.Bitmap;import android.graphics.BitmapFactory;import android.graphics.BitmapShader;import android.graphics.Canvas;import android.graphics.Color;import android.graphics.Matrix;import android.graphics.Paint;import android.graphics.Shader;import android.graphics.SweepGradient;import android.support.annotation.Nullable;import android.util.AttributeSet;import android.view.View;/** * Created by apple on 2017/5/23. * 女神面部扫描 */public class ShaderView3 extends View { /** * 绘制扫描圈的笔 */ private Paint mSweepPaint; /** * 绘制女神bitmap的笔 */ private Paint mBitmapPaint; /** * 这个自定义View的宽度,就是你在xml布局里面设置的宽度(目前不支持) */ private int mWidth; /** * 女神图片 */ private Bitmap mBitmap; /** * 雷达扫描旋转角度 */ private int degrees = 0; /** * 用于控制扫描圈的矩阵 */ Matrix mSweepMatrix = new Matrix(); /** * 用于控制女神Bitmap的矩阵 */ Matrix mBitmapMatrix = new Matrix(); /** * 着色器---生成扫描圈 */ private SweepGradient mSweepGradient; /** * 图片着色器 */ private BitmapShader mBitmapShader; private float mScale; public ShaderView3(Context context) { super(context); init(); } public ShaderView3(Context context, @Nullable AttributeSet attrs) { super(context, attrs); init(); } /** * 属性动画,必须有setXxx方法,才可以针对这个属性实现动画 * * @param degrees */ public void setDegrees(int degrees) { this.degrees = degrees; postInvalidate();//在主线程里执行OnDraw } private void init() {// 1.准备好画笔 mSweepPaint = new Paint(); mBitmapPaint = new Paint();// 2.图片着色器 mBitmap = BitmapFactory.decodeResource(getResources(), R.drawable.ccc); mBitmapShader = new BitmapShader(mBitmap, Shader.TileMode.CLAMP, Shader.TileMode.CLAMP);// 3.将图片着色器设置给画笔 mBitmapPaint.setShader(mBitmapShader); } @Override protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) { super.onMeasure(widthMeasureSpec, heightMeasureSpec);// 获取这个自定义view的宽高,注意在onMeasure里获取,在构造函数里得到的是0 mWidth = getMeasuredWidth();// 根据你所设置的view的尺寸和bitmap的尺寸计算一个缩放比例,否则的话,得到的图片是一个局部,而不是一整张图片 mScale = (float) mWidth / (float) mBitmap.getWidth();// 4.梯度扫描着色器 mSweepGradient = new SweepGradient(mWidth / 2, mWidth / 2, new int[]{Color.argb(200, 200, 0, 0), Color.argb(10, 30, 0, 0)}, null);// 5.将梯度扫描着色器设置给另外一支画笔 mSweepPaint.setShader(mSweepGradient); } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas);// 迫不得已的时候,才在onDraw方法写代码,能提前准备的要在之前去准备,// 不要写在onDraw里面,因为onDraw会不停地刷新绘制,写的代码越多,越影响效率// 将图片缩放至你指定的自定义View的宽高 mBitmapMatrix.setScale(mScale, mScale); mBitmapShader.setLocalMatrix(mBitmapMatrix);// 设置扫描圈旋转角度 mSweepMatrix.setRotate(degrees, mWidth / 2, mWidth / 2); mSweepGradient.setLocalMatrix(mSweepMatrix);// 5. 使用设置好图片着色器的画笔,画圆,先画出下层的女神图片,在画出上层的扫描图片 canvas.drawCircle(mWidth / 2, mWidth / 2, mWidth / 2, mBitmapPaint); canvas.drawCircle(mWidth / 2, mWidth / 2, mWidth / 2, mSweepPaint); }}外部调用
package com.example.apple.shaderdemo;import android.animation.ObjectAnimator;import android.animation.ValueAnimator;import android.os.Bundle;import android.support.v7.app.AppCompatActivity;import android.view.View;import android.view.animation.LinearInterpolator;public class MainActivity extends AppCompatActivity { private ShaderView3 mShaderView; int degrees = 0; @Override protected void onCreate(Bundle savedInstanceState) { super.onCreate(savedInstanceState); setContentView(R.layout.activity_main); mShaderView = (ShaderView3) findViewById(R.id.sv); mShaderView.setOnClickListener(new View.OnClickListener() { @Override public void onClick(View v) { ObjectAnimator degrees = ObjectAnimator.ofInt(mShaderView, "degrees", 0, 360); degrees.setInterpolator(new LinearInterpolator()); degrees.setDuration(10000); degrees.setRepeatCount(ValueAnimator.INFINITE); degrees.start(); } }); }}XML布局
<?xml version="1.0" encoding="utf-8"?><LinearLayout 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:layout_width="match_parent" android:layout_height="match_parent" tools:context="com.example.apple.shaderdemo.MainActivity"> <com.example.apple.shaderdemo.ShaderView3 android:id="@+id/sv" android:layout_width="300dp" android:layout_height="300dp" /></LinearLayout>以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。
声明:本页内容来源网络,仅供用户参考;我单位不保证亦不表示资料全面及准确无误,也不保证亦不表示这些资料为最新信息,如因任何原因,本网内容或者用户因倚赖本网内容造成任何损失或损害,我单位将不会负任何法律责任。如涉及版权问题,请提交至online#300.cn邮箱联系删除。
本文实例讲述了Android编程简单实现雷达扫描效果。分享给大家供大家参考,具体如下:在eoe看到有一篇关于雷达扫描的文章,然后看了下,很简单,但是觉得还有很多
iOS雷达效果这段时间新app开始了,有个产品需求是做一个类似如下效果的雷达图:中间的图片是用户头像,然后需要展示一个雷达扫描的效果。分析下雷达图的大致构成:底
如何制作出类似雷达扫描的效果,具体方法如下一、效果图二、实现思路1、自定义控件RadarView用来画雷达的效果图,可以自定义属性包括backgroundCol
iphone12激光雷达扫描仪有什么用?在iPhone12系列手机发布之后,大家都知道iPhone12Pro手机有一个激光雷达扫描仪功能,那这个激光雷达扫描仪有
通过css3实现炫酷的雷达扫描图:直接上代码://index.html雷达扫描图//index.css*{box-sizing:border-box;}html