How to translate image across the width of relativelayout in android

Question

I'm trying to animate two images one from left to right and other from right to left all at the same time. For this I have set the left margin for left image equal to negative of its width and same for right image so that they are out of the view. Now in my mainactivity I'm translating them using translationX but nothing is happening.

Here is xml file

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/bg"
    tools:context="com.example.BeX.MainActivity" >

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="200dp"
        android:layout_height="133dp"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:src="@drawable/logo" />

    <ImageView
        android:id="@+id/left"
        android:layout_width="100dp"
        android:layout_height="75dp"
        android:layout_alignParentBottom="true"
        android:layout_alignParentLeft="true"
        android:layout_marginLeft="-100dp"
        android:src="@drawable/left" />

   <ImageView
       android:id="@+id/right"
       android:layout_width="114dp"
       android:layout_height="75dp"
       android:layout_alignParentBottom="true"
       android:layout_alignParentRight="true"
       android:layout_marginRight="-114dp"
       android:src="@drawable/right" />

</RelativeLayout>

Here is mainactivity.java

import android.app.Activity;
import android.os.Bundle;
import android.widget.ImageView;
import android.widget.RelativeLayout;

public class MainActivity extends Activity {

    @Override
    protected void onCreate(Bundle savedInstanceState) {
         super.onCreate(savedInstanceState);
         setTheme(R.style.AppBaseTheme1);
         setContentView(R.layout.activity_main);

         RelativeLayout r = (RelativeLayout)findViewById(R.id.rLayout);
         ImageView left = (ImageView)findViewById(R.id.left);
         ImageView right = (ImageView)findViewById(R.id.right);

         left.animate().translationX(r.getWidth()).setDuration(2000);
         right.animate().translationX(-r.getWidth()).setDuration(2000);

    }



}

Please tell me what is the correct or possible way to do that

Thanks in advance

Answer 1

There are two base types of Animation in Android.

The first one.

In order to animate translation use this example:

TranslateAnimation r = new TranslateAnimation(0,0,0,200);
r.setDuration(2000L);
r.setRepeatCount(0);
r.setFillAfter(true);
view.startAnimation(r);

The second one.

In your case, you use ViewPropertyAnimator class. This is the second implementation of animation in Android. left.animate().translationX(r.getWidth()).setDuration(2000)

In your case you have setup the Object animator but you haven't started it.

try this: left.animate().translationX(r.getWidth()).setDuration(2000).start() :)

EDIT This have to work:

XML:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    xmlns:tools="http://schemas.android.com/tools"
    android:id="@+id/rLayout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@null">

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="200dp"
        android:layout_height="133dp"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:src="@drawable/aqu" />

    <ImageView
        android:id="@+id/left"
        android:layout_width="100dp"
        android:layout_height="75dp"
        android:src="@drawable/ar" />

   <ImageView
       android:id="@+id/right"
       android:layout_width="114dp"
       android:layout_height="75dp"
       android:src="@drawable/ari" />

</RelativeLayout>

Java-file

@Override
    protected void onCreate(Bundle savedInstanceState) {
        // TODO Auto-generated method stub
        super.onCreate(savedInstanceState);
        setContentView(R.layout.dat);

        RelativeLayout r = (RelativeLayout)findViewById(R.id.rLayout);
        ImageView left = (ImageView)findViewById(R.id.left);
        ImageView right = (ImageView)findViewById(R.id.right);

        float distance = 300.f;
        TranslateAnimation anim = new TranslateAnimation(0,0,0,distance);
        anim.setFillAfter(true);
        anim.setDuration(12000L);

        left.startAnimation(anim);
    }

But anyway if you want to animate using your ide write this:

ObjectAnimator anim0 = ObjectAnimator.ofFloat(right, "translationX", 0,300);
anim0.setDuration(10000L);
anim0.start();

It really works. I've tested.