在按钮内制作进度条

Question

问题

我想制作一个如下图所示的进度条：

期望的行为是：

• 当用户单击按钮时，会出现深灰色的进度条并开始以恒定的速度递增。我希望能够确定它需要多长时间才能完全填满（比如 2 秒）。
• 如果请求在进度条达到 100% 之前到达，进度条应该直接达到 100%（不在一个框架内，但它应该增长得非常快，就像它在 windows 文件资源管理器中发生的那样，当它正在加载时当进度条尚未结束时完成）。
• 如果请求在 bar 达到 100% 之前没有到达，让它达到 100%。如果 100%（即过去 2 秒）请求尚未到达，则会发生超时（我将显示一个小吃栏；不要担心，我知道该怎么做，只是为了澄清）。李>

到目前为止我发现了什么

我发现this article 就是我想要的例子。这种方法有什么问题吗？此外，该示例没有显示如何自定义进度条（在我的情况下，我希望它在带有弯角的视图顶部使用灰色）。 但我最想知道的是，该链接的方法是否不错。

我的猜测

我主要担心的是当请求到达但进度条尚未达到 100% 时发生的“快速填充”（我认为这是大多数情况；请求准确到达的可能性很小100%）。 以链接中的说法，我在想，当请求到达时，方法doSomeTasks应该在一个小的间隔内返回进度条状态+ 1。因此，例如，如果它在 55 处，它将返回 56、57、58...直到 100 并且返回之间会有 0.5 秒的间隔。这样，我认为我可以模拟进度条快速增长到 100%。

非常感谢任何帮助，谢谢！

Answer 1

使用 textview 和进度条创建框架布局：

<FrameLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">

    <ProgressBar
        android:id="@+id/progress_bar"
        android:progressDrawable="@drawable/progress_bar_states"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:indeterminate="false"
        style="?android:attr/progressBarStyleHorizontal" />

    <TextView
        android:id="@+id/text_view_button"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:text="Enter"
        android:textColor="@android:color/white"
        android:padding="6dp"
        android:textSize="16sp"
        android:textStyle="bold"
        android:gravity="center"/>

</FrameLayout>

您需要创建一个progressDrawable 文件。

文件 res/drawable/progress_bar_states.xml 声明了不同状态的颜色：

<?xml version="1.0" encoding="utf-8"?>
<layer-list xmlns:android="http://schemas.android.com/apk/res/android">
    <item android:id="@android:id/background">
        <shape>
            <gradient
                android:startColor="#777777"
                android:centerColor="#333333"
                android:centerY="0.75"
                android:endColor="#222222"
                android:angle="270" />
        </shape>
    </item>

    <item android:id="@android:id/secondaryProgress">
        <clip>
            <shape>
                <gradient
                    android:startColor="#234"
                    android:centerColor="#234"
                    android:centerY="0.75"
                    android:endColor="#a24"
                    android:angle="270" />
            </shape>
        </clip>
    </item>

    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <gradient
                    android:startColor="#999999"
                    android:centerColor="#777777"
                    android:centerY="0.75"
                    android:endColor="#555555"
                    android:angle="270" />
            </shape>
        </clip>
    </item>
</layer-list>

然后，创建按钮/进度条的逻辑：

final ProgressBar progressBar = (ProgressBar) findViewById(R.id.progress_bar);
final ObjectAnimator objectAnimator = ObjectAnimator.ofInt(progressBar, "progress", progressBar.getProgress(), 100).setDuration(2000);
objectAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
    @Override
    public void onAnimationUpdate(ValueAnimator valueAnimator) {
        int progress = (int) valueAnimator.getAnimatedValue();
        progressBar.setProgress(progress);
    }
});

TextView btn = (TextView) findViewById(R.id.text_view_button);
btn.setOnClickListener(new View.OnClickListener() {
    @Override
    public void onClick(View view) {
        objectAnimator.start();
    }
});

基本上，在单击 Textview 后，ObjectAnimator 会增加 ProgressBar 2 秒，直到完成。

如果你想加快进度调用这个方法：

private void completeFast(final ProgressBar progressBar) {
    final ObjectAnimator objectAnimator = ObjectAnimator.ofInt(progressBar, "progress",
                    progressBar.getProgress(), progressBar.getMax());

    objectAnimator.addUpdateListener(new ValueAnimator.AnimatorUpdateListener() {
        @Override
        public void onAnimationUpdate(ValueAnimator valueAnimator) {
            int progress = (int) valueAnimator.getAnimatedValue();
            progressBar.setProgress(progress);
        }
    });
}

会在0.3s内完成进度

也许你想改变 res/drawable/progress_bar_states.xml 的颜色。不过差不多就这些了=]

结果：