Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Slide in while fade in a textview

How can I combine XML animation to do the following effect:

enter image description here

1 -> 2 (Slide in while fading in the TextView)

My partial XML code is:

<LinearLayout
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:orientation="horizontal"
    android:layout_weight="1" >

    <TextView
        android:id="@+id/tvData"
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:layout_weight="1"
        android:text="TYPE:"
        android:gravity="center"
        android:textStyle="bold"
        android:textSize="@dimen/info_height"
        android:shadowDx="4"
        android:shadowDy="4"
        android:shadowColor="#A7A7A7"
        android:shadowRadius="15" />
    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="fill_parent"
        android:orientation="horizontal"
        android:layout_weight="1"
        android:padding="@dimen/about_divider_height" >
        <TextView
            android:id="@+id/tvBloodDetail"
            android:layout_width="fill_parent"
            android:layout_height="fill_parent"
            android:background="@drawable/roundtv"
            android:text=""
            android:gravity="center"
            android:textSize="@dimen/btn_text"
            android:textStyle="bold"
            android:shadowDx="8"
            android:shadowDy="8"
            android:shadowColor="#CC900205"
            android:shadowRadius="25"
            android:textColor="#FFFFFF"
            android:visibility="invisible" />
    </LinearLayout>
</LinearLayout>

Part of the Java:

private Runnable task = new Runnable() { 
        public void run() {
            //run the animated task
            tvB.setAnimation(animationTranslateIn);
        }
    };

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

            tvB = (TextView) findViewById(R.id.tvBloodDetail);

                animationTranslateIn = AnimationUtils.loadAnimation(BloodType.this, R.anim.slideanim);
        }

I have the slideanim xml:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/linear_interpolator" 
   android:shareInterpolator="true">
   <alpha
       android:fromAlpha="1.0"
       android:toAlpha="0.1"
       android:duration="200"
       android:repeatCount="1"
       android:repeatMode="reverse"
       android:startOffset="0" />
   <translate android:duration="2000"
       android:fromXDelta="0"
       android:toXDelta="100%p"
       android:startOffset="0" />
</set>

How can I combine the two above or even differently to follow the same process as 1 & 2?

like image 668
Si8 Avatar asked Oct 17 '25 17:10

Si8


1 Answers

Put them both in the same set and set their start offsets to the same value:

<?xml version="1.0" encoding="utf-8"?>
<set xmlns:android="http://schemas.android.com/apk/res/android"
   android:interpolator="@android:anim/linear_interpolator" 
   android:shareInterpolator="true">
   <alpha
       android:fromAlpha="1.0"
       android:toAlpha="0.1"
       android:duration="200"
       android:repeatCount="1"
       android:repeatMode="reverse"
       android:startOffset="0" />
   <translate android:duration="2000"
       android:fromXDelta="0"
       android:toXDelta="100%p"
       android:startOffset="0" />
</set>

Default startOffset is 0 so you could leave that out. You could also not share the interpolator if you don't want.

See http://developer.android.com/guide/topics/resources/animation-resource.html.

like image 122
Jason C Avatar answered Oct 20 '25 07:10

Jason C



Donate For Us

If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!