按钮单击 - 进度动画

Posted 2021-03-29

如何获得类似按钮点击后的动画效果？

我不需要控制进度，我只需要在按钮点击后填写一秒钟。我也不需要改变文字颜色。

我不知道从哪里开始这种动画。任何有助于我正确方向的帮助将不胜感激。

答案

首先，创建一个框架布局，如下所示

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

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

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

</FrameLayout>

然后创建一个文件progress_bar_style.xml将它放入你的drawable文件夹

progress_bar_style.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="#FFFFFF"
                android:centerColor="#FFFEFE"
                android:centerY="0.75"
                android:endColor="#FFFFFF"
                android:angle="270"
                />
        </shape>
    </item>



    <item android:id="@android:id/progress">
        <clip>
            <shape>
                <gradient
                    android:startColor="#3F51B5"
                    android:centerColor="#3F51B5"
                    android:centerY="0.75"
                    android:endColor="#3F51B5"
                    android:angle="270"
                    />
            </shape>
        </clip>
    </item>

</layer-list>

以下是您将如何在activity / fragment中实现

public class MainActivity extends AppCompatActivity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        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();
            }
        });
    }
}

产量