在 Android 的 Textview/Button 背景中设置动画背景视图

Question

我想实现这个按钮，灰色背景图像会在无限循环中从左向右移动。

基本上动画灰色背景从左到右倾斜。

提前致谢。

Answer 1

你可以通过这种方式实现它。首先创建一个动画矢量drawable

<animated-vector xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:aapt="http://schemas.android.com/aapt">
    <aapt:attr name="android:drawable">
        <vector
            android:name="vector"
            android:width="400dp"
            android:height="100dp"
            android:viewportWidth="400"
            android:viewportHeight="100">
            <group android:name="group">
                <path
                    android:name="path"
                    android:fillAlpha="0.16"
                    android:fillColor="#9d9d9d"
                    android:pathData="M 41.149 0 L 125 0 L 84.627 100 L 0 100 L 41.149 0 Z"
                    android:strokeWidth="1" />
            </group>
        </vector>
    </aapt:attr>
    <target android:name="group">
        <aapt:attr name="android:animation">
            <set>
                <objectAnimator
                    android:duration="1200"
                    android:interpolator="@android:interpolator/fast_out_slow_in"
                    android:propertyName="translateX"
                    android:valueFrom="-125"
                    android:valueTo="400"
                    android:valueType="floatType" />
                <objectAnimator
                    android:duration="200"
                    android:propertyName="translateX"
                    android:startOffset="1200"
                    android:valueFrom="-150"
                    android:valueTo="-150" />
            </set>
        </aapt:attr>
    </target>
</animated-vector>

接下来，把它放到你的布局中

<?xml version="1.0" encoding="utf-8"?>
<androidx.constraintlayout.widget.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:app="http://schemas.android.com/apk/res-auto"
    xmlns:tools="http://schemas.android.com/tools"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="#2C2C2C"
    tools:context=".MainActivity">

    <com.google.android.material.card.MaterialCardView
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        app:cardCornerRadius="50dp"
        app:strokeColor="@color/white"
        app:strokeWidth="2dp"
        android:backgroundTint="#00000000"
        app:layout_constraintBottom_toBottomOf="parent"
        app:layout_constraintEnd_toEndOf="parent"
        app:layout_constraintStart_toStartOf="parent"
        app:layout_constraintTop_toTopOf="parent">

        <com.google.android.material.button.MaterialButton
            android:id="@+id/button"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Skip to Home"
            android:background="@drawable/avd_anim"
            android:textAllCaps="false"
            android:textSize="24dp"
            app:backgroundTint="@null" />
    </com.google.android.material.card.MaterialCardView>

</androidx.constraintlayout.widget.ConstraintLayout>

最后在Activity中实现

val animatedDrawable = AnimatedVectorDrawableCompat.create(this, R.drawable.avd_anim)
animatedDrawable?.registerAnimationCallback(object : Animatable2Compat.AnimationCallback() {
        override fun onAnimationEnd(drawable: Drawable?) {
            animatedDrawable.start()
        }
})
findViewById<Button>(R.id.button).background = animatedDrawable
animatedDrawable?.start()

Answer 2

XML： 在你的按钮下：

<View
     android:id="@+id/shine"
     android:layout_width="30dp"
     android:layout_height="113dp"
     android:layout_marginTop="-7dp"
     android:layout_marginBottom="-7dp"
     android:layout_marginLeft="40dp"
     android:layout_marginRight="-40dp"
     android:background="@drawable/bg_shine"
     android:rotation="20" />

bg_闪耀：

     <?xml version="1.0" encoding="utf-8"?>
      <shape xmlns:android="http://schemas.android.com/apk/res/android">
        <gradient
           android:centerColor="#AAffffff"
           android:endColor="#00ffffff"
           android:startColor="#00ffffff"/>
       </shape>

和代码：

    View shine = view.findViewById(R.id.shine);
    shineAnimation(shine);

和：

    private void shineAnimation(View view) {
    // attach the animation layout Using AnimationUtils.loadAnimation
    Animation anim = AnimationUtils.loadAnimation(requireContext(), R.anim.left_right);
    view.startAnimation(anim);
    // override three function There will error
    // line below the object
    // click on it and override three functions
    anim.setAnimationListener(new Animation.AnimationListener() {
        @Override
        public void onAnimationStart(Animation animation) {

        }

        @Override
        public void onAnimationEnd(Animation animation) {
            new Handler(Looper.getMainLooper()).postDelayed(() -> view.startAnimation(anim), 5000);
        }

        @Override
        public void onAnimationRepeat(Animation animation) {

        }
    });
}