带加载状态的SeekBar

2018-09-20  本文已影响0人  我不写博客

一个神奇的美工给我设计了一个seekbar的thumb上面带加载状态的效果....
简直想哭
没办法,自定义控件吧

package com.example.mayn.myapplication;

import android.annotation.SuppressLint;
import android.content.Context;
import android.graphics.Bitmap;
import android.graphics.BitmapFactory;
import android.graphics.Canvas;
import android.graphics.Color;
import android.graphics.Matrix;
import android.graphics.Paint;
import android.graphics.Point;
import android.graphics.Rect;
import android.os.Handler;
import android.util.AttributeSet;
import android.widget.SeekBar;

/**
 * Create by GongPeng
 * use for:带加载的seekbar
 */
@SuppressLint("AppCompatCustomView")
public class MusicLoadingSeekBar extends SeekBar {

    private int loadingPosition;
    private Bitmap loadingBitmap;
    //
    private Point mDiscPoint = new Point();
    private Matrix matrix = new Matrix();
    // 旋转中心坐标
    private Point mDiscCenterPoint = new Point();
    private float mDiscRotation = 0.0f;

    //定义、并创建画笔
    private Paint paint = new Paint();
    //是否加载状态
    private boolean isLoading = false;

    public MusicLoadingSeekBar(Context context) {
        super(context);
        init();
    }

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

    public MusicLoadingSeekBar(Context context, AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        init();
    }

    private void init() {
        loadingBitmap = BitmapFactory.decodeResource(getResources(), R.mipmap.yp_bfq_jz);
        loadingBitmap = Bitmap.createScaledBitmap(loadingBitmap, 40, 40, true);
    }

    public void setLoading(boolean loading) {
        isLoading = loading;
        invalidate();
    }

    @Override
    protected void onDraw(Canvas canvas) {
        // TODO Auto-generated method stub
        super.onDraw(canvas);
        if (isLoading) {

            if (android.os.Build.VERSION.SDK_INT >= android.os.Build.VERSION_CODES.JELLY_BEAN) {
                Rect thumbRect = getThumb().getBounds();
                loadingPosition = thumbRect.centerX();
            }else {
                Rect rect = getProgressDrawable().getBounds();
                loadingPosition = rect.width() * getProgress() / getMax();
            }

            int height = getHeight();
            // 抗锯齿
            paint.setAntiAlias(true);
            //设置画笔的颜色
            paint.setColor(Color.parseColor("#0099ff"));
            //设置填满
            paint.setStyle(Paint.Style.FILL);
            //设置画笔宽度
            paint.setStrokeWidth(15);
            // 计算X坐标
            float xPos = loadingPosition;
            // 计算Y坐标
            float yPos = height / 2;
            mDiscPoint.x = (int) (xPos - 20);
            mDiscPoint.y = (int) (yPos - 20);
            mDiscCenterPoint.x = loadingPosition;
            mDiscCenterPoint.y = height / 2;
            //绘制一个点
            canvas.drawCircle(xPos, yPos, 20, paint);
            matrix.setRotate(mDiscRotation, mDiscCenterPoint.x, mDiscCenterPoint.y);
            matrix.preTranslate(mDiscPoint.x, mDiscPoint.y);
            canvas.drawBitmap(loadingBitmap, matrix, null);
            mHandler.postDelayed(mRotationRunnable, 500);
        }
    }

    private Handler mHandler = new Handler();


    private Runnable mRotationRunnable = new Runnable() {
        @Override
        public void run() {
            mDiscRotation += 2.0f;
            if (mDiscRotation >= 360) {
                mDiscRotation = 0;
            }
            invalidate();
            mHandler.postDelayed(this, 500);
        }
    };

}

不行啊---怎么还有一个系统自带的thumb效果碍事?
弄个style去一下

<!-- 播放器SeekBar控件 -->
   <style name="musicSeekBar" parent="android:Widget.SeekBar">
       <item name="android:indeterminate">false</item>
       <item name="android:progressDrawable">@drawable/player_seekbar_bg</item>
       <item name="android:minHeight">2dip</item>
       <item name="android:maxHeight">2dip</item>
       <item name="android:paddingLeft">0dp</item>
       <item name="android:paddingRight">0dp</item>
       <item name="android:thumb">@drawable/music_rotate_thumb</item>
       <item name="android:thumbOffset">0dip</item>
       <item name="android:focusable">true</item>
   </style>
   

最后,看一下效果:


Screenshot_20180920-170449.jpg
上一篇下一篇

猜你喜欢

热点阅读