Textview being overlapped by Imageview

Question

So I have a textview that I placed above an imageview. When I add text to the textview it is covered up by the imageview. What I want to happen is that when I add more text to the textview the imageview is pushed further down starting below the end of the text. How would I go about accomplishing this?

Heres my activity_route_details.xml

<?xml version="1.0" encoding="utf-8"?>
<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
xmlns:app="http://schemas.android.com/apk/res-auto"
xmlns:tools="http://schemas.android.com/tools"
android:id="@+id/activity_route_details"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:paddingBottom="@dimen/activity_vertical_margin"
android:paddingLeft="@dimen/activity_horizontal_margin"
android:paddingRight="@dimen/activity_horizontal_margin"
android:paddingTop="@dimen/activity_vertical_margin"
tools:context="com.example.zach.listview.RouteDetails">

<TextView
    android:text="TextView"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:id="@+id/routeDetailsView"
    android:textSize="18sp"
    android:textAlignment="center" />

<com.example.zach.listview.TouchImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/routeImage"
    android:scaleType="fitCenter"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:adjustViewBounds="false" />


</RelativeLayout>

and heres my routeDetails.java

package com.example.zach.listview;

import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.widget.TextView;



public class RouteDetails extends AppCompatActivity {

TouchImageView routeImage;

@Override
protected void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.activity_route_details);

    //back button for route details view
    getSupportActionBar().setDisplayHomeAsUpEnabled(true);

    //TextView for route details
    final TextView routeDetailsView = (TextView) findViewById(R.id.routeDetailsView);
    routeDetailsView.setText(getIntent().getExtras().getString("route"));

    //ImageView for route details
    routeImage = (TouchImageView) findViewById(R.id.routeImage);
    routeImage.setImageResource(getIntent().getIntExtra("imageResourceId", 0));

}

//back button for route details view
@Override
public boolean onSupportNavigateUp(){
    finish();
    return true;
}

}

Answer 1

Add

android:layout_below="@+id/routeDetailsView"

to

<com.example.zach.listview.TouchImageView definition in xml .

Something like this:

<com.example.zach.listview.TouchImageView
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:id="@+id/routeImage"
    android:scaleType="fitCenter"
    android:layout_below="@id/routeDetailsView"
    android:layout_alignParentBottom="true"
    android:layout_alignParentLeft="true"
    android:layout_alignParentStart="true"
    android:adjustViewBounds="false"/>

Answer 2

Just put your code inside ScrollView :

<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/scrollView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent">
</ScrollView>