//activity
text_handler = (TextView) findViewById(R.id.text_handler); SpreadView rview=(SpreadView)findViewById(R.id.spreadView); rview.setCoreImage(R.drawable.headx);
//自定义view的方法
public class SpreadView extends View { /** 圆圈中心图片 */ private Bitmap mBitmap; private Paint centerPaint; //中心圆paint private int radius = 100; //中心圆半径 private Paint spreadPaint; //扩散圆paint private float centerX;//圆心x private float centerY;//圆心y private int distance = 5; //每次圆递增间距 private int maxRadius = 80; //最大圆半径 private int delayMilliseconds = 33;//扩散延迟间隔,越大扩散越慢 private List<Integer> spreadRadius = new ArrayList<>();//扩散圆层级数,元素为扩散的距离 private List<Integer> alphas = new ArrayList<>();//对应每层圆的透明度 private int centerColor; public SpreadView(Context context) { this(context, null, 0); } public SpreadView(Context context, @Nullable AttributeSet attrs) { this(context, attrs, 0); } public SpreadView(Context context, @Nullable AttributeSet attrs, int defStyleAttr) { super(context, attrs, defStyleAttr); TypedArray a = context.obtainStyledAttributes(attrs, R.styleable.SpreadView, defStyleAttr, 0); radius = a.getInt(R.styleable.SpreadView_spread_radius, radius); maxRadius = a.getInt(R.styleable.SpreadView_spread_max_radius, maxRadius); centerColor = a.getColor(R.styleable.SpreadView_spread_center_color, ContextCompat.getColor(context, R.color.colorAccent)); int spreadColor = a.getColor(R.styleable.SpreadView_spread_spread_color, ContextCompat.getColor(context, R.color.colorAccent)); distance = a.getInt(R.styleable.SpreadView_spread_distance, distance); a.recycle(); centerPaint = new Paint(); //centerPaint.setColor(centerColor); //centerPaint.setAntiAlias(true); //最开始不透明且扩散距离为0 alphas.add(255); spreadRadius.add(0); spreadPaint = new Paint(); spreadPaint.setAntiAlias(true); spreadPaint.setAlpha(255); spreadPaint.setColor(spreadColor); } @Override protected void onSizeChanged(int w, int h, int oldw, int oldh) { super.onSizeChanged(w, h, oldw, oldh); //圆心位置 centerX = w / 2; centerY = h / 3; } @Override protected void onDraw(Canvas canvas) { super.onDraw(canvas); for (int i = 0; i < spreadRadius.size(); i++) { int alpha = alphas.get(i); spreadPaint.setAlpha(alpha); int width = spreadRadius.get(i); //绘制扩散的圆 canvas.drawCircle(centerX, centerY, radius + width, spreadPaint); //每次扩散圆半径递增,圆透明度递减 if (alpha > 0 && width < 300) { alpha = alpha - distance > 0 ? alpha - distance : 1; alphas.set(i, alpha); spreadRadius.set(i, width + distance); } } //当最外层扩散圆半径达到最大半径时添加新扩散圆 if (spreadRadius.get(spreadRadius.size() - 1) > maxRadius) { spreadRadius.add(0); alphas.add(255); } //超过8个扩散圆,删除最先绘制的圆,即最外层的圆 if (spreadRadius.size() >= 8) { alphas.remove(0); spreadRadius.remove(0); } //中间的圆 这地方加载图片 canvas.drawCircle(centerX, centerY, radius, centerPaint); centerPaint.setAlpha(255); centerPaint.setColor(centerColor); //canvas.drawCircle(getWidth() / 2, getHeight() / 2, radius, centerPaint); if(mBitmap != null){ canvas.drawBitmap(mBitmap, getWidth() / 2 - mBitmap.getWidth() / 2 , getHeight() / 3 - mBitmap.getHeight() / 3, centerPaint); Log.d("/centerX", String.valueOf(centerX)); Log.d("/centerY", String.valueOf(centerY)); Log.d("/getWidth()/2", String.valueOf(getWidth() / 2)); Log.d("/getHeight()/3", String.valueOf(getHeight() / 3)); Log.d("/mBitmap", String.valueOf(mBitmap)); Log.d("//mBitmap.getWidth()/2", String.valueOf(mBitmap.getWidth() / 2)); Log.d("//mBitmap.getHeight()/3", String.valueOf(mBitmap.getHeight() / 3)); } //TODO 可以在中间圆绘制文字或者图片 //延迟更新,达到扩散视觉差效果 postInvalidateDelayed(delayMilliseconds); } /** * 设置中心圆图片 */ public void setCoreImage(int imageId){ mBitmap = BitmapFactory.decodeResource(getResources(), imageId); } }
<com.video.demo.SpreadView android:id="@+id/spreadView" android:layout_width="wrap_content" android:layout_height="wrap_content" app:spread_center_color="#9326FF" app:spread_delay_milliseconds="35" app:spread_distance="5" app:spread_max_radius="50" app:spread_radius="50" app:spread_spread_color="#9326FF" />
//styles
<declare-styleable name="SpreadView"> <!--中心圆颜色--> <attr name="spread_center_color" format="color" /> <!--中心圆半径--> <attr name="spread_radius" format="integer" /> <!--扩散圆颜色--> <attr name="spread_spread_color" format="color" /> <!--扩散间距--> <attr name="spread_distance" format="integer" /> <!--扩散最大半径--> <attr name="spread_max_radius" format="integer" /> <!--扩散延迟间隔--> <attr name="spread_delay_milliseconds" format="integer" /> </declare-styleable>