中文字幕av专区_日韩电影在线播放_精品国产精品久久一区免费式_av在线免费观看网站

溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

Android自定義View實現水波紋效果

發布時間:2020-08-20 06:34:28 來源:腳本之家 閱讀:747 作者:xing-java 欄目:移動開發

介紹:水波紋散開效果的控件在 App 里面還是比較常見的,例如 網易云音樂歌曲識別,附近搜索場景。

看下實現的效果:

Android自定義View實現水波紋效果

實現思路: 先將最大圓半徑與最小圓半徑間距分成幾等份,從內到外,Paint 透明度依次遞減,繪制出同心圓,然后不斷的改變這些同心圓的半徑大小,延遲一定時間重繪,便達到了想外散開的動畫效果了。

public class WaveView extends View {

 private static final String TAG = "WaveView";

 private int waveColor;

 private int waveCount;

 private Bitmap waveCenterIcon;

 private Paint paint;

 private int mWidth;

 private int mHeight;

 private int centerX;

 private int centerY;

 private float radius; // 最外圓半徑,即最大半徑

 private float innerRadius; // 最內圓的半徑,即最小半徑

 private int centerIconWidth;

 private int centerIconHeight;

 private float[] waveDegreeArr;

 private boolean isRunning = true;

 public WaveView(Context context) {
  this(context, null);
 }

 public WaveView(Context context, AttributeSet attrs) {
  super(context, attrs);
  readAttrs(context, attrs);
  init();
 }

 private void init() {
  paint = new Paint(Paint.ANTI_ALIAS_FLAG);
  paint.setColor(waveColor);
  paint.setStyle(Paint.Style.FILL);
  waveDegreeArr = new float[waveCount];

  // 設置中間 drawable 點擊事件


 }

 private void readAttrs(Context context, AttributeSet attrs) {
  TypedArray typedArray = context.obtainStyledAttributes(attrs, R.styleable.WaveView);
  try {
   waveColor = typedArray.getColor(R.styleable.WaveView_waveColor, 0xffff0000);
   waveCount = typedArray.getInt(R.styleable.WaveView_waveCount, 4);
   Drawable centerDrawable = typedArray.getDrawable(R.styleable.WaveView_waveCenterIcon);
   waveCenterIcon = ((BitmapDrawable) centerDrawable).getBitmap();
  } catch (Exception e) {

  } finally {
   typedArray.recycle();
  }
 }

 @Override
 protected void onSizeChanged(int w, int h, int oldw, int oldh) {
  super.onSizeChanged(w, h, oldw, oldh);
  mWidth = w;
  mHeight = h;
  centerX = mWidth / 2;
  centerY = mHeight / 2;
  radius = Math.min(mWidth, mHeight) / 2f;
  centerIconWidth = waveCenterIcon.getWidth();
  centerIconHeight = waveCenterIcon.getHeight();
  innerRadius = Math.max(centerIconWidth, centerIconHeight) * 1.2f;

  for (int i = 0; i < waveCount; i++) {
   waveDegreeArr[i] = innerRadius + (radius - innerRadius) / waveCount * i;
  }

 }

 @Override
 protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
  int widthMode = MeasureSpec.getMode(widthMeasureSpec);
  int heightMode = MeasureSpec.getMode(heightMeasureSpec);
  if (widthMode == MeasureSpec.UNSPECIFIED || widthMode == MeasureSpec.AT_MOST) {
   widthMeasureSpec = MeasureSpec.makeMeasureSpec(dp2Px(120), MeasureSpec.EXACTLY);
  }
  if (heightMode == MeasureSpec.UNSPECIFIED || heightMode == MeasureSpec.AT_MOST) {
   heightMeasureSpec = MeasureSpec.makeMeasureSpec(dp2Px(120), MeasureSpec.EXACTLY);
  }
  super.onMeasure(widthMeasureSpec, heightMeasureSpec);
 }


 @Override
 protected void onDraw(Canvas canvas) {
  drawWave(canvas);
  drawCenterCircle(canvas);
  drawCenterIcon(canvas);

 }

 private void drawCenterCircle(Canvas canvas) {
  canvas.drawCircle(centerX, centerY, innerRadius, paint);
 }

 private void drawWave(Canvas canvas) {
  for (int i = 0; i < waveCount; i++) {
   paint.setAlpha((int) (255 - 255 * waveDegreeArr[i] / radius));
   canvas.drawCircle(centerX, centerY, waveDegreeArr[i], paint);
  }
  for (int i = 0; i < waveDegreeArr.length; i++) {
   if ((waveDegreeArr[i] += 4) > radius) {
    waveDegreeArr[i] = innerRadius;
   }
  }
  if (isRunning) {
   postInvalidateDelayed(50);
  }
 }

 private void drawCenterIcon(Canvas canvas) {
  paint.setAlpha(255);
  int left = centerX - centerIconWidth / 2;
  int top = centerY - centerIconHeight / 2;
  canvas.drawBitmap(waveCenterIcon, left, top, paint);
 }

 @Override
 public boolean onTouchEvent(MotionEvent event) {
  switch (event.getAction()) {
   case MotionEvent.ACTION_UP:
    // 處理事件邏輯
    handleEvent(event);
    return true;
  }
  return true;
 }

 private void handleEvent(MotionEvent event) {
  float touchX = event.getX();
  float touchY = event.getY();
  Log.i(TAG, "handleEvent: " + "(" + touchX + "," + touchY + ")");
  float distanceX = Math.abs(touchX - centerX);
  float distanceY = Math.abs(touchY - centerY);
  // 計算觸摸點距離中心點的距離
  float distance = (float) Math.sqrt(distanceX * distanceX + distanceY * distanceY);
  // 當點擊的點距離中心點距離小于最內圓半徑時,認為是點擊有效,否則無效
  if (distance < innerRadius) {
   if (listener != null) {
    listener.onCenterWaveClick();
   }
  }
 }

 OnCenterWaveClickListener listener;

 public interface OnCenterWaveClickListener {
  void onCenterWaveClick();
 }

 public void setOnCenterWaveClickListener(OnCenterWaveClickListener listener) {
  this.listener = listener;
 }

 public void toggle() {
  isRunning = !isRunning;
  invalidate();
 }

 public boolean isWaveRunning() {
  return isRunning;
 }


 private int dp2Px(int dpValue) {
  return (int) TypedValue.applyDimension(TypedValue.COMPLEX_UNIT_DIP, dpValue, getResources().getDisplayMetrics());
 }

}

github地址:https://github.com/xing16/WaveView

以上就是本文的全部內容,希望對大家的學習有所幫助,也希望大家多多支持億速云。

向AI問一下細節

免責聲明:本站發布的內容(圖片、視頻和文字)以原創、轉載和分享為主,文章觀點不代表本網站立場,如果涉及侵權請聯系站長郵箱:is@yisu.com進行舉報,并提供相關證據,一經查實,將立刻刪除涉嫌侵權內容。

AI

辉县市| 平谷区| 盘锦市| 布尔津县| 焉耆| 深州市| 岳西县| 龙海市| 尖扎县| 白沙| 临夏县| 梁河县| 江川县| 荥阳市| 铁岭市| 东兰县| 大连市| 钟山县| 潼南县| 志丹县| 图木舒克市| 大兴区| 射阳县| 晋江市| 萨迦县| 昌黎县| 东乌| 寻甸| 武清区| 广河县| 米易县| 洛阳市| 德清县| 承德县| 大厂| 弋阳县| 图们市| 古田县| 灵丘县| 南川市| 乌拉特中旗|