Android Video View Visibility

Question

I have a TextView along with a VideoView in a Relative layout . What i am doing is, animating the TextView to the center of the screen, changing the text and back to the corner of the screen. I have a Video View placed in the center of the screen. When TextView animates, it goes behind the Video View spoiling the animation. I have tried hard to find any workaround to show TextView on top of Video View but not lucky. So i want to know any help regarding this issue or i can set the visibility of the Video View to false and true on the animation events so i can acheive what i want.

Here is my code for Relative Layout

  <RelativeLayout
    android:layout_width="1440dp"
    android:layout_height="wrap_content"
    android:layout_marginTop="0dp"
    android:background="#000000" >
  <VideoView
    android:id="@+id/videoView1"
    android:layout_width="962dp"
    android:layout_height="wrap_content"
    android:layout_gravity="center"
    />
  <TextView
    android:id="@+id/textView2"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_marginLeft="970dp"
    android:layout_marginTop="320dp"
    android:paddingLeft="58dp"
    android:text="00"
    android:textAlignment="center"
    android:textSize="150sp"
    android:onClick="increaseCounter"
    android:clickable="true"
    android:textColor="#FF0000">
  <requestFocus
    android:duplicateParentState="true"
    android:focusable="true"
    android:focusableInTouchMode="true" />
  </TextView>
  </RelativeLayout>

I am using translate animation on textview and i want to animate on top of the Video View.

Answer 1

Check out the layout below:

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent" >

    <VideoView
        android:id="@+id/videoView1"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent" />

    <TextView
        android:id="@+id/textView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_centerHorizontal="true"
        android:layout_centerVertical="true"
        android:text="This is a sample text message"
        android:textAppearance="?android:attr/textAppearanceLarge" />

</RelativeLayout>

This is the layout I tried and below is the animation I have used

 @Override
        public void onCreate(Bundle savedInstanceState) {
            super.onCreate(savedInstanceState);
            .......
            textView.startAnimation(inFromRightAnimation());
            textView.requestFocus();
        }
        private Animation inFromRightAnimation() {

            Animation inFromRight = new TranslateAnimation(
                    Animation.RELATIVE_TO_PARENT, +1.0f, Animation.RELATIVE_TO_PARENT, 0.0f,
                    Animation.RELATIVE_TO_PARENT, 0.0f, Animation.RELATIVE_TO_PARENT, 0.0f
            );
            inFromRight.setDuration(5*1000);
            inFromRight.setInterpolator(new AccelerateInterpolator());
            return inFromRight;
        }

And it is correctly working. VideoView will be on behind of the TextView and the TextView is correctly translating above the VideoView from the entire screen right to center.

Answer 2

Try to use, It will appear the text in top of your window

<RelativeLayout
 android:layout_width="1440dp"
 android:layout_height="wrap_content"
 android:background="#000000" >
<TextView
 android:id="@+id/textView2"
 android:layout_width="match_parent"
 android:layout_height="wrap_content"
 android:text="00"
 android:textAlignment="center"
 android:layout_alignParentTop="true"
 android:textSize="150sp"
 android:onClick="increaseCounter"
 android:clickable="true"
 android:textColor="#FF0000">
 <requestFocus
 android:duplicateParentState="true"
 android:focusable="true"
 android:focusableInTouchMode="true" />
 </TextView>
 <VideoView
 android:id="@+id/videoView1"
 android:layout_below="@+id/textView2"
 android:layout_width="962dp"
 android:layout_height="wrap_content"
 />
 </RelativeLayout>

Answer 3

Finally found a workaround for the problem i was facing. Created a RelativeLayout with the highest z-index (defined at extreme bottom) and placed all the controls i wanted to keep showing while animation except the videoView which i actually wanted to hide during animation and animate the textView on top of the Video View. On Animation start i set the final RelativeLayout background to black and on on end of animation i reset it to transparent. A kind of a hack but working.

    @Override
    public void onAnimationStart(Animation arg0) {

       RelativeLayout rl =(RelativeLayout) findViewById(R.id.superView);
    rl.setBackgroundColor(Color.BLACK);
        }

    @Override
    public void onAnimationEnd(Animation arg0) {

    RelativeLayout rl =(RelativeLayout) findViewById(R.id.superView);
    rl.setBackgroundColor(Color.TRANSPARENT);
        }