Add a ScrollView in Linear and Relative Layout in one XML file

Question

I am trying to make the contents of Relative Layout as Scrollview as its not fitting in the screen. My XML file that consists of both, Linear and Relative Layout where Linear is acting as Parent and Relative as child layout.

Although I have browsed, most of the questions regarding this topic, but all i could find is how to insert Scrollview in Linear or Relative Layout respectively but not when both layouts are in one file.

my XML file

<?xml version="1.0" encoding="UTF-8"?>

<!-- 
   Being of Linear Layout
 -->

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >


    <TextView
        android:id="@+id/week1"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:text="@string/week1"
        android:textColor="#FFFFFF"
        android:textSize="25sp"
        android:paddingTop="50dp"
        android:background="#00141c" />
<!--
Begin Relative Layout
-->

<RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:scrollHorizontally="true">

    <ImageView
        android:id="@+id/treadmillimage"
        android:layout_width="115dp"
        android:layout_height="93dp"
        android:paddingTop="10dp"
        android:src="@drawable/treadmill" />

    <EditText
        android:id="@+id/durOnTreadmill"
        android:layout_width="129dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number"
        android:layout_marginLeft="180dp" 
        android:layout_centerVertical="true"/>

<!--
End Relative Layout
-->
    </RelativeLayout>

    <TextView
        android:id="@+id/treadmilltext"
        android:layout_width="91dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:text="@string/treadmill"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

<!--
Begin Relative Layout
-->

    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:scrollHorizontally="true">

    <ImageView
        android:id="@+id/stepperimage"
        android:layout_width="115dp"
        android:layout_height="93dp"
        android:paddingTop="10dp"
        android:src="@drawable/stepper" />

    <EditText
        android:id="@+id/durOnStepper"
        android:layout_width="129dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number"
        android:layout_marginLeft="180dp" 
        android:layout_centerVertical="true"/>

<!--
End Relative Layout
-->
    </RelativeLayout>

    <TextView
        android:id="@+id/steppertext"
        android:layout_width="91dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:text="@string/stepper"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

<!--
Begin Relative Layout
-->
    <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:scrollHorizontally="true">

    <ImageView
        android:id="@+id/stationaryrowing"
        android:layout_width="115dp"
        android:layout_height="93dp"
        android:paddingTop="10dp"
        android:src="@drawable/stationaryrowing" />

    <EditText
        android:id="@+id/durOnStationaryRowing"
        android:layout_width="129dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number"
        android:layout_marginLeft="180dp" 
        android:layout_centerVertical="true"/>

<!--
End Relative Layout
-->
    </RelativeLayout>

    <TextView
        android:id="@+id/stationaryrowingtext"
        android:layout_width="91dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:text="@string/stationaryrowing"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

<!--
Begin Relative Layout
-->
     <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:scrollHorizontally="true">

    <ImageView
        android:id="@+id/exercisebikeimage"
        android:layout_width="115dp"
        android:layout_height="93dp"
        android:paddingTop="10dp"
        android:src="@drawable/excerisebike" />

    <EditText
        android:id="@+id/durOnexcerisebike"
        android:layout_width="129dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number"
        android:layout_marginLeft="180dp" 
        android:layout_centerVertical="true"/>

 <!--
End Relative Layout
-->
    </RelativeLayout>

     <TextView
        android:id="@+id/excerisebiketext"
        android:layout_width="91dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:text="@string/exercisebike"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

 <!--
Begin Relative Layout
-->
       <RelativeLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:scrollHorizontally="true">

    <ImageView
        android:id="@+id/ellipticaltrainerimage"
        android:layout_width="115dp"
        android:layout_height="93dp"
        android:paddingTop="10dp"
        android:src="@drawable/ellipticaltrainer" />

    <EditText
        android:id="@+id/durOnellipticaltrainer"
        android:layout_width="129dp"
        android:layout_height="wrap_content"
        android:ems="10"
        android:inputType="number"
        android:layout_marginLeft="180dp" 
        android:layout_centerVertical="true"/>

<!--
End Relative Layout
-->
    </RelativeLayout>

        <TextView
        android:id="@+id/ellipticaltrainertext"
        android:layout_width="91dp"
        android:layout_height="wrap_content"
        android:layout_marginLeft="15dp"
        android:text="@string/ellipticaltrainer"
        android:textColor="#FFFFFF"
        android:textSize="20sp" />

<!--
End Linear Layout
-->
</LinearLayout>

All the contents below TextView of Week 1 are required to be in Scrollview

Thanks in advance, will really appreciate all the answers :)

MH. · Accepted Answer · 2013-03-17 19:29:39Z

1

If you don't want the topmost TextView to be part of the scrolling area, then you'll have to nest the RelativeLayouts into another layout, because a ScrollView can have only one direct child.

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:orientation="vertical" >

    <TextView ... />

    <ScrollView ... >
        <!-- only one direct child for scrollview: -->
        <LinearLayout ... >

            <RelativeLayout ... />
            <TextView ... />
            <RelativeLayout ... />
            <TextView ... />
            <RelativeLayout ... />
            <TextView ... />
            <RelativeLayout ... />
            <TextView ... />
            <!-- etc -->

        </LinearLayout>

    </ScrollView>

</LinearLayout>

edited Mar 17, 2013 at 19:29

answered Mar 17, 2013 at 18:31

MH.

45.6k10 gold badges108 silver badges118 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Android Killer · Accepted Answer · 2013-03-17 17:57:23Z

0

just put the scorolleview as parent of the RelativeLayout as follows:

<ScrollView 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content">

<RelativeLayout 
    android:layout_width="fill_parent"
    android:layout_height="wrap_content" 
    android:scrollHorizontally="true">

    <ImageView
        android:id="@+id/treadmillimage"
        android:layout_width="115dp"
        android:layout_height="93dp"
        android:paddingTop="10dp"
        android:src="@drawable/treadmill" />

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

edited Mar 17, 2013 at 17:57

answered Mar 17, 2013 at 17:42

Android Killer

18.6k15 gold badges70 silver badges94 bronze badges

6 Comments

user2179825 Over a year ago

It throws an exception, "Exception raised during rendering: ScrollView can host only one direct child"

Android Killer Over a year ago

you are making a mistake.just close the crollview before LinearLayout and after RelativeLayout. got it ?Also i edited the answer a little.Remove xmlns from SrollView.

user2179825 Over a year ago

As you can see I have several Relative Layouts (4 in total). If i close the scrollview at the end of the first one, Based on my knowledge it will only be applied on the first one. However, i want to make all 4 Relative Layout scroll together. If i close the scrollview just above the end tag of Linear Layout it throws the same exception.

Android Killer Over a year ago

No, just remove xmlns:android="schemas.android.com/apk/res/android" from every RelativeLayout and try.

user2179825 Over a year ago

Thanks mate, It worked like a pro :). I thought you meant remove that line from ScrollView.

|

Collectives™ on Stack Overflow

Add a ScrollView in Linear and Relative Layout in one XML file

2 Answers 2

Comments

6 Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

6 Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related