How can I make an animated/constant glowing effect around button in android?

Viewed 10627

I am seeking to make two buttons have a thin glow around them, kinda pulsating-fading effect

glowlike effect around button example image

The buttons have a background drawable image, and i just wanna have a glowing effect around it to make it kinda resonate with the music playing

I have already searched around multiple threads, and they were either just about an imageView, or upon pressed, or a Bitmap, so not necessarily what I am seeking

Here is my Button XML:

<Button
android:id="@+id/playEasyMode_Button"
android:layout_width="145dp"
android:layout_height="40dp"
android:layout_gravity="center_horizontal"
android:background="@drawable/play_easy_button"
android:onClick="playEasyMode"
android:layout_margin="15dp"/>

Please dont try suggesting using background drawables upon pressed and whatnot, this is not what I am looking to do. I wanna set such effect either programatically or in the XML


edit: Object Animator offloat relative layout error image edit2: ok so as i have almost achieved the effect I want thanx to Aman Verma below, here is my updated XML right now:

<RelativeLayout
    android:id="@+id/relative_layout_id"
    android:layout_width="160dp"
    android:layout_height="55dp"
    android:layout_alignParentBottom="true"
    android:background="#FFC107"
    android:alpha=".1"
    android:layout_gravity="center_horizontal"
    android:layout_margin="15dp">

    <Button
        android:id="@+id/playEasyMode_Button"
        android:layout_width="145dp"
        android:layout_height="40dp"
        android:layout_marginLeft="8dp"
        android:background="@drawable/play_easy_button"
        android:onClick="playEasyMode"
        android:layout_marginTop="8dp"/>

</RelativeLayout>

and this is the java code:

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);

    setContentView(R.layout.home_screen_layout);

    //glowing button effect
    RelativeLayout relativelayout = (RelativeLayout)findViewById(R.id.relative_layout_id);

    ObjectAnimator fadeOut = ObjectAnimator.ofFloat(relativelayout, "alpha", .5f, .1f);
    fadeOut.setDuration(300);
    ObjectAnimator fadeIn = ObjectAnimator.ofFloat(relativelayout, "alpha", .1f, .5f);
    fadeIn.setDuration(300);

    final AnimatorSet mAnimationSet = new AnimatorSet();

    mAnimationSet.play(fadeIn).after(fadeOut);

    mAnimationSet.addListener(new AnimatorListenerAdapter() {
        @Override
        public void onAnimationEnd(Animator animation) {
            super.onAnimationEnd(animation);
            mAnimationSet.start();
        }
    });

    mAnimationSet.start();
}

It is currently animating BOTH the button AND the yellow color behind in the relative layout I need to set the button as is without being affected by the realtive layout animation

2 Answers
Related