单击按钮-进度动画

时间:2019-03-13 19:19:55

标签: android button android-animation

如何获得类似于单击按钮后的动画效果?

enter image description here

我不需要控制进度,我只需要在单击按钮后的一秒钟内填写进度即可。 我也不需要更改文本颜色。

我不知道从哪里开始制作这种动画。为我提供正确指导的任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:3)

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

<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并将其放入您的可绘制文件夹

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>

这是您如何在活动/片段中实现

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

输出

enter image description here