Textview Scrolling Behind the Imageview

Question

In my application I want to scroll the TextView over the ImageView, but in my XML Design the TextView scroll behind the ImageView, how to scroll the TextView on ImageView, please give me the solution.

This is my XML code.

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

    <FrameLayout 
        android:id="@+id/frame"
        android:layout_width="match_parent"
        android:layout_height="wrap_content">

        <RelativeLayout
            android:id="@+id/img" 
            android:layout_width="match_parent"
            android:layout_height="match_parent">


         <ImageView
                   android:id="@+id/article_image"
                   android:layout_width="match_parent"
                   android:layout_height="250dp"
                   android:layout_gravity="top"
                   android:scaleType="fitXY"
                   android:src="@drawable/garden"/>

             <TextView
                   android:id="@+id/image_desc"
                   android:layout_width="match_parent"
                   android:layout_height="wrap_content"
                   android:background="#77000000"
                   android:gravity="center|bottom"
                   android:padding="8dp"/>

      </RelativeLayout>  
   </FrameLayout>  

    <RelativeLayout 
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:layout_below="@+id/frame">

             <ScrollView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="#77000000">


            <RelativeLayout
                    android:layout_width="match_parent"
                    android:layout_height="wrap_content"
                    android:orientation="vertical"
                    android:padding="16dp" >

            <TextView
                    android:id="@+id/article_body"
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:background="#ffffff"
                    android:text="A good practice to bring the best performance 
                    for android application is to make sure your main thread does 
                    the minimum amount of work. Any long running tasks or heavy 
                    operations are usually performed in a different thread. 
                    Typical long running tasks could be network operations, 
                    reading files form memory, animations, etc. In this article, 
                    we will create a simple asynchronous ListView in Android. 
                    ListView with thumbnails thumbnails on each row 
                    (as shows in the image below) will be loaded asynchronously 
                    form server. We will populate a ListView with thumbnail images 
                    downloaded from the internet using a AsyncTask.A good practice to bring the best performance 
                    for android application is to make sure your main thread does 
                    the minimum amount of work. Any long running tasks or heavy 
                    operations are usually performed in a different thread. 
                    Typical long running tasks could be network operations, 
                    reading files form memory, animations, etc. In this article, 
                    we will create a simple asynchronous ListView in Android. 
                    ListView with thumbnails thumbnails on each row 
                    (as shows in the image below) will be loaded asynchronously 
                    form server. We will populate a ListView with thumbnail images 
                    downloaded from the internet using a AsyncTask." />

            </RelativeLayout>
        </ScrollView>
        </RelativeLayout>
   </RelativeLayout>

Answer 1

For this scenario, try using Relative Layout than Frame Layout as it provides many more features and better possibility to handle the positioning of views in it. The implementation will be nearly the same just place Image View first and then the rest of the views for this case.

Answer 2

<FrameLayout 
    android:id="@+id/frame"
    android:layout_width="match_parent"
    android:layout_height="match_parent">




     <ImageView
               android:id="@+id/article_image"
               android:layout_width="match_parent"
               android:layout_height="250dp"
               android:layout_gravity="top"
               android:scaleType="fitXY"
               android:src="@drawable/garden"/>

      <ScrollView
                    android:layout_width="match_parent"
                    android:layout_height="match_parent" >

    <LinearLayout
                    android:layout_width="match_parent"
                    android:layout_height="match_parent"
                    android:orientation="vertical" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_marginTop="100dp"
            android:text="@string/hello_world" />
    </LinearLayout>
</ScrollView>
  </FrameLayout >  

Do this I hope this is working.. I have same problem and solve by useing this.

Answer 3

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/LinearLayout1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:background="@drawable/ic_launcher"
    android:orientation="vertical" >

    <ScrollView
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

        <LinearLayout
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:orientation="vertical" >

            <TextView
                android:id="@+id/textView1"
                android:layout_width="wrap_content"
                android:layout_height="wrap_content"
                android:layout_marginTop="100dp"
                android:text="@string/hello_world" />
        </LinearLayout>
    </ScrollView>

</LinearLayout>