Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Fade animation in shape background gradient

I have not been able to find any posts that do what I want...I have a rectangle:

<shape xmlns:android="http://schemas.android.com/apk/res/android">
<stroke android:width="2dp" android:color="#FFFFFF" />
<padding android:left="4dp"
    android:top="4dp"
    android:right="4dp"
    android:bottom="4dp" />
<corners android:radius="6dp" />
<gradient
        android:angle="90"
        android:startColor="#FF000000"
        android:centerColor="#FF000000"
        android:endColor="#FF0000cd"
        android:type="linear" />

The above shape is used as a background attribute in a RelativeLayout:

<RelativeLayout
    android:id="@+id/layoutBottom"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:animation="@anim/slide_top_to_bottom"
    android:background="@drawable/rectangle4"
    android:orientation="vertical" >

I want to slowly fade in and out different gradients in this rectangle. The problem is, this RelativeLayout changes size dynamically as its content changes so I can't just use an image file as the background (this would in fact hide the text content of the layout which changes frequently). I have tried removing the android:background attribute and just using an image file in my RelativeLayout but then this image occupies the whole screen since I must use wrap_content and this image file must be placed in code before the text views occupying the RelativeLayout (otherwise the text is covered by the image). I know how to make an Alpha tween animation but I don't know how to assign the android:background attribute to the animation. Any ideas?

like image 574
midiwriter Avatar asked Jan 19 '13 08:01

midiwriter


1 Answers

Create a TransitionDrawable to fade between two drawables that you use for the faded and unfaded background.

<?xml version="1.0" encoding="UTF-8"?>
<transition xmlns:android="http://schemas.android.com/apk/res/android">
    <!-- use whatever drawables you want, gradients, shapes etc-->
    <item android:drawable="@drawable/faded" />
    <item android:drawable="@drawable/unfaded" />
</transition>

http://developer.android.com/reference/android/graphics/drawable/TransitionDrawable.html

Then use in code, start the transition. I've hard coded 2 seconds (2000 millis)

TransitionDrawable trans = (TransitionDrawable) myLayout.getBackground();
trans.startTransition(2000);
like image 141
Simon Avatar answered Nov 14 '22 00:11

Simon