Android-实现音乐模块的进度条

原创

Nimyears

发布于 2024-07-11 11:35:35

1200

发布于 2024-07-11 11:35:35

引言

在创建自定义进度条组件时，提供了两种方法：使用 Java 和 XML。以下是对这两种方法的详细说明和实战应用的整理，帮助大家更好理解如何编写和应用自定义进度条组件，非常重要，希望对你们有所帮助.

<com.spd.custom.view.ProgressBarLinearLayout
    android:id="@+id/music_widget_progress"
    android:layout_width="wrap_content"
    android:layout_height="4px"
    android:layout_marginLeft="-30px"
    custom:fillet_height="2"
    tools:ignore="PxUsage,RtlHardcoded" />

方法一：使用 Java 实现进度条的更新

首先定义函数名

然而创建 BitmapDrawable：对象使用特定的图片资源（如进度条的填充和未填充部分），实现自定义视觉效果的进度条。

（1）编写绘制逻辑：重写 onDraw 方法来绘制进度条，使用 Canvas 绘制背景和前景显示当前进度。

（2）或者绘制进度条：创建一个自定义的 View 类，用于绘制进度条


    //....    
    public ProgressBarLinearLayout(Context context, AttributeSet attrs) {
        super(context, attrs);
        init();
    }

    private void init() {
        backgroundPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        backgroundPaint.setColor(0xFFA5A5A5);  // 灰色背景
        backgroundPaint.setStyle(Paint.Style.FILL);

        progressPaint = new Paint(Paint.ANTI_ALIAS_FLAG);
        progressPaint.setColor(0xFF2196F3);  // 蓝色进度
        progressPaint.setStyle(Paint.Style.FILL);
    }

    @Override
    protected void onDraw(Canvas canvas) {
        super.onDraw(canvas);
        // 绘制背景
        RectF backgroundRect = new RectF(0, 0, getWidth(), progressBarHeight);
        canvas.drawRect(backgroundRect, backgroundPaint);

        // 计算绘制当前进度
        float progressWidth = (getWidth() * currentProgress) / maxProgress;
        RectF progressRect = new RectF(0, 0, progressWidth, progressBarHeight);
        canvas.drawRect(progressRect, progressPaint);
    }

}

更新布局（onLayout）：调用父类的onLayout方法；计算当前视图的新宽度和高度；如果新的宽度和高度与之前的值不同，更新视图的宽度和高度变量；更新进度条的左、右、上、下边界，以居中显示进度条；这些操作有助于在视图大小改变时，自动调整进度条的位置和大小，保持居中显示。

更新进度(setCurrentValue)：提供一个方法来更新进度，每次更新后重新绘制进度条。

方法二：使用 XML 绘制静态进度条

创建一个 layer-list：在 drawable 资源文件夹中创建一个 XML 文件定义进度条的样式。这个 layer-list 包含两层：一层是背景，另一层是前景（实际显示的进度）。

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools">
    <item
        android:id="@android:id/background"
        android:height="10px"
        tools:ignore="UnusedAttribute">
        <shape android:shape="rectangle">
            <solid android:color="#A5A5A5" />
            <corners android:radius="10px" />
        </shape>
    </item>

    <item
        android:id="@android:id/progress"
        android:height="10px"
        tools:ignore="UnusedAttribute">
        <clip>
            <shape android:shape="rectangle">
                <solid android:color="#2196F3" />
                <corners android:radius="10px" />
            </shape>
        </clip>
    </item>
</layer-list>