Android: RelativeLayout in ScrollView

Question

I have a RelativeLayout with multiple ImageViews and when I turn around the screen, the ImageViews become disordered. So I decided to wrap it into a ScrollView. But the ScrollView doesn't work!

Can any one help me with that? I know that the right way is to design a GridView or ListView, but since I had some questions and no one answered me, I decided to go this way.

Here is my xml code :

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

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

    <Button
        android:id="@+id/continuePizza"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_alignParentBottom="true"
        android:layout_alignParentRight="true"
        android:text="continue" />

    <Button
        android:id="@+id/finishP"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:layout_above="@+id/continuePizza"
        android:layout_alignParentLeft="true"
        android:text="finish" />

    <ImageView
        android:id="@+id/imageView1"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignParentLeft="true"
        android:layout_alignParentTop="true"
        android:layout_marginTop="16dp"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView2"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/imageView1"
        android:layout_marginLeft="18dp"
        android:layout_toRightOf="@+id/imageView1"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView3"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imageView1"
        android:layout_marginTop="18dp"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView5"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView3"
        android:layout_centerVertical="true"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView6"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignTop="@+id/imageView3"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView4"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below="@+id/imageView5"
        android:layout_marginTop="17dp"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView7"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView2"
        android:layout_alignTop="@+id/imageView5"
        android:layout_marginLeft="10dp"
        android:src="@drawable/download" />

    <ImageView
        android:id="@+id/imageView8"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_alignLeft="@+id/imageView7"
        android:layout_alignTop="@+id/imageView3"
        android:src="@drawable/download" />

</RelativeLayout>
</ScrollView>

Answer 1

I experienced same problem with Relative Layout within Scroll View to overcome this i wrapped around my relative layout with a linear layout , try like this and also remove orientation from relative layout

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


<ScrollView xmlns:android="http://schemas.android.com/apk/res/android"
android:id="@+id/ScrollView01"
android:layout_width="match_parent"
android:layout_height="match_parent"
android:fillViewport="true"
android:scrollbars="none" >

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


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


<Button
    android:id="@+id/continuePizza"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:layout_alignParentRight="true"
    android:text="continue" />

<Button
    android:id="@+id/finishP"
    android:layout_width="fill_parent"
    android:layout_height="wrap_content"
    android:layout_above="@+id/continuePizza"
    android:layout_alignParentLeft="true"
    android:text="finish" />

<ImageView
    android:id="@+id/imageView1"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignParentLeft="true"
    android:layout_alignParentTop="true"
    android:layout_marginTop="16dp"
    android:src="@drawable/download" />

<ImageView
    android:id="@+id/imageView2"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/imageView1"
    android:layout_marginLeft="18dp"
    android:layout_toRightOf="@+id/imageView1"
    android:src="@drawable/download" />

<ImageView
    android:id="@+id/imageView3"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/imageView1"
    android:layout_marginTop="18dp"
    android:src="@drawable/download" />

<ImageView
    android:id="@+id/imageView5"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/imageView3"
    android:layout_centerVertical="true"
    android:src="@drawable/download" />

<ImageView
    android:id="@+id/imageView6"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignTop="@+id/imageView3"
    android:src="@drawable/download" />

<ImageView
    android:id="@+id/imageView4"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_below="@+id/imageView5"
    android:layout_marginTop="17dp"
    android:src="@drawable/download" />

<ImageView
    android:id="@+id/imageView7"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/imageView2"
    android:layout_alignTop="@+id/imageView5"
    android:layout_marginLeft="10dp"
    android:src="@drawable/download" />
<ImageView
    android:id="@+id/imageView8"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_alignLeft="@+id/imageView7"
    android:layout_alignTop="@+id/imageView3"
    android:src="@drawable/download" />

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