CODEWITHSUNDEEP
androidandroid-linearlayouthorizontalscrollview
Ozzy
Ozzy

Reputation: 8312

How to set up a HorizontalScrollView in Android?

I'm new to android but I've done the notepad tutorial. Now I'm trying to write my own layout. The eventual layout will be like this on one page:

1st row: [ ------search bar----- ] [ button ]

2nd row: [ text-tab ] [ text-tab ] [ text-tab ] <-- click on one of these to change 3rd row content

3rd row: [ content to fill rest of height ]

... and when the user scrolls the page left or right another layout/page is shown.

So I started off using Eclipse's graphical editor for a new android XML layout file. I dragged a text-box onto the canvas, then I increased the width as in the diagram above. Then I added the button at the end of it, so that the first row was complete.

Now when I try to add anything below it doesn't work. So I switched to XML view. I copied and pasted the LinearLayout so that I could edit it to make the 2nd row.

Now I get the error: HorizontalScrollView can host only one direct child

Okay, so I understand the Horizontal Scroll View should only contain 1 LinearLayout but then what is the correct structure to set up this layout?

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

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <EditText
        android:id="@+id/editText1"
        android:layout_width="1130dp"
        android:layout_height="72dp">
        <requestFocus/>
    </EditText>
    <Button
        android:id="@+id/button1"
        android:layout_width="152dp"
        android:layout_height="72dp"
        android:text="Button"/>
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <EditText
        android:id="@+id/editText1"
        android:layout_width="1130dp"
        android:layout_height="72dp">
        <requestFocus/>
    </EditText>
    <Button
        android:id="@+id/button1"
        android:layout_width="152dp"
        android:layout_height="72dp"
        android:text="Button"/>
</LinearLayout>

</HorizontalScrollView>

Upvotes: 0

Views: 6761

Answers (1)

Dmytro Danylyk
Dmytro Danylyk

Reputation: 19788

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

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

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <EditText
        android:id="@+id/editText1"
        android:layout_width="1130dp"
        android:layout_height="72dp">
        <requestFocus/>
    </EditText>
    <Button
        android:id="@+id/button1"
        android:layout_width="152dp"
        android:layout_height="72dp"
        android:text="Button"/>
</LinearLayout>

<LinearLayout
    android:layout_width="match_parent"
    android:layout_height="wrap_content">
    <EditText
        android:id="@+id/editText1"
        android:layout_width="1130dp"
        android:layout_height="72dp">
        <requestFocus/>
    </EditText>
    <Button
        android:id="@+id/button1"
        android:layout_width="152dp"
        android:layout_height="72dp"
        android:text="Button"/>
</LinearLayout>
</LinearLayout>
</HorizontalScrollView>

Upvotes: 1

Related Questions