android - 创建带有点击外发光动画的android按钮

Question

我搜索了整个互联网，但没有找到如何实现我想要的答案。

我想创建 GlowButton(我的意思是它将是按钮扩展)类，它是在按下或聚焦状态时具有外部发光的按钮。请参阅下图以了解我的意思:

这个外发光应该随着动画出现和消失(只需改变不透明度)。

1. 简单的问题。如何在没有动画的情况下实现此按钮。我知道我可以创建这样的东西:

   <item android:state_pressed="true">
       <shape>
           <solid android:color="@color/gray"/>
           <stroke
               android:width="4dp"
               android:color="@color/orange" />
           <corners
               android:radius="8dp" />
           <padding android:bottom="1dp"
                    android:top="1dp"
                    android:left="1dp"
                    android:right="1dp"/>
       </shape>
   </item>
   ...
   

   但有一个坚实的光芒。我需要如上图所示的渐变发光。

2. 很难回答的问题。我怎样才能使这个按钮带有出现和消失的动画？用户触摸按钮 — 在 300 毫秒内从 0% 不透明度到 100% 不透明度出现发光。当用户停止触摸按钮时，发光应该以类似的方式消失。

提前致谢!

Answer 1

You can set alpha animation on click of the button. You have to put glow as background to button and when you press the button the background of button will animate like alpha animation with repeate count 1 so it looks like shadow is appear and dissappear. Set animation time 300ms

alpha_animation.xml in anim folder

<?xml version="1.0" encoding="UTF-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android">

    <alpha
        android:duration="1000"
        android:fromAlpha="0.0"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="1.0" />

</set>

布局文件如下所示

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <Button
        android:id="@+id/btnGlowBg"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:background="@drawable/drawable_glow"
        android:padding="20dp"
    />
    <Button
        android:id="@+id/btnPinButton"
        android:layout_width="100dp"
        android:layout_height="100dp"
        android:layout_centerInParent="true"
        android:padding="20dp"
        android:text="10"/>

</RelativeLayout>

Activity Code

public class TestActivity extends AppCompatActivity {
    Button btnGlowBg;

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

        btnGlowBg = (Button) findViewById(R.id.btnGlowBg);
        btnGlowBg.setVisibility(View.GONE);
        findViewById(R.id.btnPinButton).setOnClickListener(new View.OnClickListener() {
            @Override
            public void onClick(View view) {                
                btnGlowBg.setVisibility(View.VISIBLE);
                final Animation startAnimation = AnimationUtils.loadAnimation(getApplicationContext(), R.anim.alpha_animation);
                btnGlowBg.startAnimation(startAnimation);


            }
        });
    }
}