Image Translation not showing and moving

Question

I want to move the black square to the right. Let's say the square starts at position X=0. One second later I want it to be at position X=2, another second later place it at position X=3 and so on...

I'm trying to make a square block move on the X axis but for some reason unknown to me it is not moving at all.

Here is my fragment XML code (I know there is a typo at the beginning missing a <, I took it off otherwise it would not show for some reason, just ignore the typo):

LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:background="#edf7f2"
android:orientation="vertical" >

<RelativeLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:gravity="center"
    android:paddingTop="20dp" >

    <!-- Phone -->
    <ImageView
        android:id="@+id/phone"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:contentDescription="phone"
        android:paddingLeft="10dp"
        android:paddingRight="20dp"
        android:src="@drawable/phone" />

    <LinearLayout
        android:id="@+id/linearLayoutLoadingBar"
        android:layout_width="100dp"
        android:layout_height="20dp"
        android:layout_toLeftOf="@+id/pc"
        android:layout_toRightOf="@+id/phone"
        android:orientation="horizontal" 
        android:layout_centerInParent="true">

        <ImageView
            android:id="@+id/loading"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:background="@drawable/rectangle"
            android:contentDescription="loading image"
            android:paddingLeft="20dp"
            android:paddingRight="20dp" />
    </LinearLayout>

    <!-- PC -->
    <ImageView
        android:id="@+id/pc"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentRight="true"
        android:layout_margin="20dp"
        android:contentDescription="pc"
        android:src="@drawable/pc" />
</RelativeLayout>

<TextView
    android:id="@+id/tv_home_fragment_content"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:gravity="center"
    android:textSize="40sp" />

And now here is my shape XML code:

<?xml version="1.0" encoding="UTF-8"?>
<shape xmlns:android="http://schemas.android.com/apk/res/android"
    android:shape="rectangle">
    <size android:width="20dp" android:height="20dp"/>

    <solid
        android:color="@android:color/black" />

</shape>

And here is my animation XML file:

<?xml version="1.0" encoding="utf-8"?>

<translate
    android:duration="200"
    android:fillAfter="true"
    android:fromXDelta="0%p"
    android:startOffset="0"
    android:toXDelta="20%p" />
<translate
    android:duration="200"
    android:fillAfter="true"
    android:fromXDelta="20%p"
    android:startOffset="300"
    android:toXDelta="40%p" />
<translate
    android:duration="200"
    android:fillAfter="true"
    android:fromXDelta="40%p"
    android:startOffset="600"
    android:toXDelta="60%p" />
<translate
    android:duration="200"
    android:fillAfter="true"
    android:fromXDelta="60%p"
    android:startOffset="900"
    android:toXDelta="80%p" />
<translate
    android:duration="200"
    android:fillAfter="true"
    android:fromXDelta="80%p"
    android:startOffset="1200"
    android:toXDelta="100%p" />
</set>

The fragment looks like this:

I want the black square to move to the right (slowly). But it does not moves or even shows up on the device when I run the app.

Here is the code where I call and set the animation:

@Override
public View onCreateView(LayoutInflater inflater, ViewGroup container, Bundle savedInstanceState) 
{
    View rootView = inflater.inflate(R.layout.fragment_home, container, false);

    ImageView imageView = (ImageView) rootView.findViewById(R.id.loading);

    TextView textView = (TextView) rootView.findViewById(R.id.tv_home_fragment_content);
    textView.setText("Landing screen");

    Animation animFadein = AnimationUtils.loadAnimation(rootView.getContext(), R.animator.loading_square); 
    animFadein.setRepeatMode(Animation.REVERSE);
    imageView.startAnimation(animFadein);

    return rootView;
}

Answer 1

The Question is not clear . their may be mistake of placing XML in the correct directory etc Create a folder name "animator" inside res folder and then loading_square.xml inside it.

and only tag in enough e.g fade_in.xml

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

   <alpha android:duration="2000"
        android:fromAlpha="0.0"
        android:repeatMode="reverse"
        android:repeatCount="infinite"
        android:interpolator="@android:anim/accelerate_interpolator"
        android:toAlpha="1.0"/>


</set>

e.g move.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:fillAfter="true">

   <translate
        android:fromXDelta="0%p"
        android:toXDelta="50%p"
        android:fromYDelta="0%p"
        android:toYDelta="50%"
        android:duration="2000" />
</set>