Search code examples
androidandroid-layoutandroid-scrollviewandroid-relativelayout

How to center a view in parent and add a view below it inside a Relative Layout inside a Scroll view


I want to make a relative layout which the user can scroll down and has many text views - each one of them below another one starting in the center of the screen. To do so, I wrap my Relative Layout inside a Scroll View and I have two text views. One of the text view has android:layout_centerInParent="true" and the other one has android:layout_centerHorizontal="true" and android:layout_below="first text view id".

The problem is that the android:layout_below="first text view id" has no effect: I get the first text view at the center of the screen and the other view at the top of the screen centered horizontally.

My layout:

<?xml version="1.0" encoding="utf-8"?>
<ScrollView
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:fillViewport="true"
    android:id= "@+id/chooseMapsScroll">

    <RelativeLayout
        android:id="@+id/chooseMaps"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:background="@drawable/title"
        android:fillViewport="true"
        android:orientation="horizontal">

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerInParent="true"
            android:text="test center in parent"
            android:id="@+id/test_below"/>

        <TextView
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_centerHorizontal="true"
            android:text="test center below"
            android:layout_below="@id/test_below"/>
    </RelativeLayout>
</ScrollView>

UPDATE I discovered that the layout's background image is what causing the problem.

The proof:

That's the output I got without background image

That's the output I got with background image


Solution

  • Try using this: Let me know if there is anything, else this will work for sure Try going for LinearLayout instead

    <?xml version="1.0" encoding="utf-8"?>
    
    
    <ScrollView
        xmlns:android="http://schemas.android.com/apk/res/android"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:fillViewport="true"
        android:id= "@+id/chooseMapsScroll">
    
        <LinearLayout
            android:id="@+id/chooseMaps"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:background="@drawable/title"
            android:gravity="center"
            android:orientation="vertical">
    
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="test center in parent"/>
    
            <TextView
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="test center below"/>
        </LinearLayout>
    
    
    
    </ScrollView>