Блог

Как я могу получить эффект анимации, аналогичный приведенному ниже при нажатии кнопки?

Мне не нужно контролировать прогресс, мне просто нужно, чтобы он заполнялся через секунду после нажатия кнопки. Мне также не нужно менять цвет текста.

Я в недоумении относительно того, с чего начать для такого рода анимации. Буду признателен за любую помощь, которая поможет мне направить меня в правильном направлении.

Сначала создайте макет фрейма, например, следующим образом

 <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>
  

Вот как вы будете реализовывать в 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();
            }
        });
    }
}
  

Вывод