Android translate animation: moved view is overlapped

Question

I have two TextViews in my Activity (let's call them TV1 and TV2), both belonging to different RelativeLayouts. I created a TranslateAnimation to move TV1 from its location to TV2's location. The problem is that, when TV1 reaches TV2's RelativeLayout, it gets under it (the moved TextView is overlapped by TV2's layout), and I want TV1 to be above this layout. Is there any way to bring it to front?

Thanks!

[EDIT]

I add my layout code. I want to move timeText to numTimeValue. As you can see, timeText is declared after numTimeValue. Also, I tried this:

mTimeTextView.bringToFront();
((View)mTimeTextView.getParent()).bringToFront();

and it's still overlapped.

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/outer_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/header"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:baselineAligned="false"
        android:orientation="vertical" >

        <LinearLayout
            android:id="@+id/pointsLayout"
            style="@style/ScoreBar"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:baselineAligned="false"
            android:orientation="horizontal" >

            <LinearLayout
                android:id="@+id/numCorrectLayout"
                android:layout_width="0dip"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:orientation="vertical" >

                <TextView
                    android:id="@+id/numCorrectTitle"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="@string/num_correct_title"
                    android:textSize="16sp" />

                <TextView
                    android:id="@+id/numGuessed"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:textSize="22sp" />
            </LinearLayout>

            <LinearLayout
                android:id="@+id/numTimeLayout"
                android:layout_width="0dip"
                android:layout_height="wrap_content"
                android:layout_weight="1"
                android:orientation="vertical" >

                <TextView
                    android:id="@+id/numTimeTitle"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:text="@string/num_time_title"
                    android:textSize="16sp" />

                <TextView
                    android:id="@+id/numTimeValue"
                    android:layout_width="wrap_content"
                    android:layout_height="wrap_content"
                    android:layout_gravity="center_horizontal"
                    android:textSize="22sp" />
            </LinearLayout>
        </LinearLayout>

        <RelativeLayout
            android:id="@+id/timeLayout"
            android:layout_width="fill_parent"
            android:layout_height="wrap_content"
            android:orientation="horizontal" >

            <ProgressBar
                android:id="@+id/time_progbar"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:layout_centerVertical="true"
                android:layout_marginRight="10dp"
                android:layout_toLeftOf="@+id/timeText"
                android:indeterminateDrawable="@android:drawable/progress_indeterminate_horizontal"
                android:indeterminateOnly="false"
                android:maxHeight="20dip"
                android:minHeight="20dip"
                android:padding="15dp"
                android:progressDrawable="@drawable/time_progressbar" />

            <TextView
                android:id="@+id/timeText"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_alignParentRight="true"
                android:layout_centerVertical="true"
                android:layout_marginRight="5dp"
                android:textSize="30sp" />
        </RelativeLayout>
    </LinearLayout>

    <ImageView
        android:id="@+id/movieImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/header"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="30dp"
        android:contentDescription="@string/movie_to_guess" />
</RelativeLayout>

[EDIT2]

Simplified version:

<RelativeLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/game_layout"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:orientation="vertical" >

    <LinearLayout
        android:id="@+id/pointsLayout"
        style="@style/ScoreBar"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:baselineAligned="false"
        android:orientation="horizontal" >

            <TextView
                android:id="@+id/numTimeValue"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_gravity="center_horizontal"
                android:textSize="22sp" />
        <!--  </LinearLayout> -->
    </LinearLayout>

    <RelativeLayout
        android:id="@+id/timeLayout"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_below="@+id/pointsLayout"
        android:orientation="horizontal" >

        <ProgressBar
            android:id="@+id/time_progbar"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:layout_centerVertical="true"
            android:layout_marginRight="10dp"
            android:layout_toLeftOf="@+id/timeText"
            android:indeterminateDrawable="@android:drawable/progress_indeterminate_horizontal"
            android:indeterminateOnly="false"
            android:maxHeight="20dip"
            android:minHeight="20dip"
            android:padding="15dp"
            android:progressDrawable="@drawable/time_progressbar" />

        <TextView
            android:id="@+id/timeText"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_alignParentRight="true"
            android:layout_centerVertical="true"
            android:layout_marginRight="5dp"
            android:textSize="30sp" />
    </RelativeLayout>

    <ImageView
        android:id="@+id/movieImage"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/timeLayout"
        android:layout_centerHorizontal="true"
        android:layout_marginBottom="30dp"
        android:contentDescription="@string/movie_to_guess" />
</RelativeLayout>

this might be due to the layout of 2nd textview under layout of 1st. you can either move 2nd layout at front or hide 2nd layout when 1st layout comes on its place — Saad Asad, Mar 28 '13 at 12:15

score 2 · Answer 1 · edited May 23 '17 at 10:28

2

This might be related to the z-order, i.e. vertical stacking, of the respecive layout elements. Two solutions:

(1) Change the z-order in your java code so that the view you want to have on top is moved to the front. In your case you are going to want to move the entire relative layout that contains the TextView you want on top to the front. Moving just the text view itself will not work.

(2) Control the z-order within the xml. By default views added further down in your XML file will be higher up in the z-order. Try swaping the position of the relative layouts and see if it works.

edited May 23 '17 at 10:28

Community

1
1

answered Mar 28 '13 at 12:17

Rarw

7,645
3
28
46

I edited my post to add my layout. I tried both things but it's still the same. Maybe I am doing something wrong? – PX Developer Mar 28 '13 at 12:30
Your inner RelativeLayout is nested within a LinearLayout id = header. I think this is where you're running into problems. You may need to untangle these layouts to make this work the way you want. Just looking at you're XML I don't see why you need all these seperate nested LinearLayout fields - it seems you could go this with one or two relative layouts much more efficiently. Then you would be sure you were moving the right layout to the front. – Rarw Mar 28 '13 at 12:50
I addded the "header" LinearLayout to avoid using android:layout_below, since I thought that might have something to do with my problem. I edited my post with a simplified version of my layout, and the situation is still the same. – PX Developer Mar 28 '13 at 13:00
The text view you're trying to move to the front is still in a RelativeLayout that is nested within another RelativeLayout. I think that's the problem. It looks like you only have 2 main layout blocks - can you seperate them out? Maybe using a LinearLayout on the outside and 2 relaive layouts? You need to seperate what you're trying to move to the front from what you want in the back. It cannot be nested inside. – Rarw Mar 28 '13 at 13:43

score 0 · Answer 2 · answered Jul 27 '16 at 17:09

0

Try using android:elevation in your xml.

For TV1, provide android:elevation = "1dp"

For TV2, provide android:elevation = "0dp"

answered Jul 27 '16 at 17:09

arora

21
3

Android translate animation: moved view is overlapped

2 Answers2