其他分享
首页 > 其他分享> > 短视频开发app,自定义带进度条的视频播放按钮

短视频开发app,自定义带进度条的视频播放按钮

作者:互联网

短视频开发app,自定义带进度条的视频播放按钮

具体的代码逻辑都有清楚的注释,可以直接查看代码

 


public class MusicProgress extends View {
    private Context mContext;
    private static final int DEFAULT_SIZE = 40;
    private static final float HALF = 0.5f;
    private static final float ONE_TENTH = 0.1f;
    private static final float DEFAULT_START_ANGLE = -90;
    private int defaultSize;
    private int mWidth;
    private int mHeight;
    private Paint mBgPaint;
    private Paint mProgressPaint;
    // 背景颜色和进度条颜色
    private int mBgColor;
    private int mProgressColor;
    // 背景圆
    private int radius;
    private int circlePoint;
    // 播放暂停按钮
    private Bitmap mPlayBm;
    private Bitmap mPauseBm;
    private Bitmap mBitmap;
    private Rect mDstRect;
    private int mBmOffset;
    // 进度条
    private RectF mProgressRectF;
    private int mProgressWidth;
    // 进度条开始结束角度
    private float mStartAngle;
    private float mSweepAngle;
    public MusicProgress(Context context) {
        this(context, null);
    }
    public MusicProgress(Context context,
            @Nullable AttributeSet attrs) {
        this(context, attrs, 0);
    }
    public MusicProgress(Context context, @Nullable AttributeSet attrs, int defStyleAttr) {
        super(context, attrs, defStyleAttr);
        this.mContext = context;
        init();
    }
    private void init() {
        defaultSize = dp2px(DEFAULT_SIZE);
        mProgressWidth = (int) (defaultSize * ONE_TENTH);
        radius = (int) (defaultSize * HALF - mProgressWidth * HALF);
        circlePoint = (int) (defaultSize * HALF);
        mBgColor = ContextCompat.getColor(mContext, R.color.progress_bg_color);
        mProgressColor = ContextCompat.getColor(mContext, R.color.progress_color);
        // 暂停、播放按钮的绘制区域
        mBmOffset = (int) (defaultSize * HALF * HALF);
        mDstRect = new Rect(mBmOffset, mBmOffset,
                defaultSize - mBmOffset, defaultSize - mBmOffset);
        mPlayBm = BitmapFactory.decodeResource(mContext.getResources(), R.drawable.play);
        mPauseBm = BitmapFactory.decodeResource(mContext.getResources(), R.drawable.pause);
        // 默认是暂停状态
        mBitmap = mPlayBm;
        mBgPaint = new Paint();
        mBgPaint.setAntiAlias(true);
        mBgPaint.setColor(mBgColor);
        mProgressPaint = new Paint();
        mProgressPaint.setAntiAlias(true);
        mProgressPaint.setColor(mProgressColor);
        mProgressPaint.setStrokeWidth(mProgressWidth);
        mProgressPaint.setStyle(Paint.Style.STROKE);
        // 进度条
        mProgressRectF = new RectF(0, 0, defaultSize, defaultSize);
        this.mStartAngle = DEFAULT_START_ANGLE;
    }
    @Override
    protected void onSizeChanged(int w, int h, int oldw, int oldh) {
        super.onSizeChanged(w, h, oldw, oldh);
        this.mWidth = w;
        this.mHeight = h;
        if (mWidth > 0) {
            // 修改进度条宽度
            mProgressWidth = (int) (mWidth * ONE_TENTH);
            mProgressPaint.setStrokeWidth(mProgressWidth);
            // 修改背景圆的半径
            radius = (int) (mWidth * HALF - mProgressWidth * HALF);
            // 修改圆心
            circlePoint = (int) (mWidth * HALF);
            // 暂停、播放按钮的绘制区域
            mBmOffset = (int) (mWidth * HALF * HALF);
            mDstRect = new Rect(mBmOffset, mBmOffset,
                    mWidth - mBmOffset, mWidth - mBmOffset);
            float size = mWidth - mProgressWidth * HALF;
            // 进度条
            mProgressRectF = new RectF(mProgressWidth * HALF, mProgressWidth * HALF, size, size);
        }
    }
    @Override
    protected void onMeasure(int widthMeasureSpec, int heightMeasureSpec) {
        super.onMeasure(widthMeasureSpec, heightMeasureSpec);
        setMeasuredDimension(getSize(widthMeasureSpec), getSize(heightMeasureSpec));
    }
    /**
     * 获取测量大小
     */
    private int getSize(int measureSpec) {
        int result;
        int specMode = MeasureSpec.getMode(measureSpec);
        int specSize = MeasureSpec.getSize(measureSpec);
        if (specMode == MeasureSpec.EXACTLY) {
            //确切大小,所以将得到的尺寸给view
            result = specSize;
        } else if (specMode == MeasureSpec.AT_MOST) {
            //默认值为40dp, 此处要结合父控件给子控件的最多大小(要不然会填充父控件),所以采用最小值
            result = Math.min(defaultSize, specSize);
        } else {
            result = defaultSize;
        }
        return result;
    }
    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // 绘制背景圆
        canvas.drawCircle(circlePoint, circlePoint, radius, mBgPaint);
        // 绘制播放暂停按钮
        canvas.drawBitmap(mBitmap, null, mDstRect, mBgPaint);
        // 绘制进度条
        canvas.drawArc(mProgressRectF, mStartAngle, mSweepAngle, false, mProgressPaint);
    }
    /**
     * 刷新播放UI.
     */
    public void play() {
        mBitmap = mPauseBm;
        invalidate();
    }
    /**
     * 刷新暂停UI.
     */
    public void pause() {
        mBitmap = mPlayBm;
        invalidate();
    }
    /**
     * 更新进度.
     *
     * @param startAngle 开始角度
     * @param sweepAngle 扫过角度
     */
    public void updateProgress(@FloatRange(from = -360f, to = 360f) float startAngle,
            @FloatRange(from = 0f, to = 360f) float sweepAngle) {
        this.mStartAngle = startAngle;
        this.mSweepAngle = sweepAngle;
        invalidate();
    }
    /**
     * 更新进度.
     *
     * @param sweepAngle 扫过角度
     */
    public void updateProgress(@FloatRange(from = 0f, to = 360f) float sweepAngle) {
        this.mSweepAngle = sweepAngle;
        invalidate();
    }
    private int dp2px(final float dp) {
        final float density = mContext.getResources().getDisplayMetrics().density;
        return (int) (dp * density + 0.5f);
    }
    private int px2dp(final float px) {
        float scale = mContext.getResources().getDisplayMetrics().scaledDensity;
        return (int) (px / scale + 0.5f);
    }
}

涉及的资源文件

 


<color name="progress_bg_color">#7A7A7A</color>
<color name="progress_color">#00F1B7</color>

 

以上就是短视频开发app,自定义带进度条的视频播放按钮, 更多内容欢迎关注之后的文章

 

标签:视频,自定义,进度条,int,float,private,mBmOffset,HALF,defaultSize
来源: https://www.cnblogs.com/yunbaomengnan/p/16393079.html