Android Development - Graphical Layout looks different from actual XML

Question

Alright so I quickly created an XML file with the following contents:

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

    <ScrollView
        android:id="@+id/scrollView1"
        android:layout_width="match_parent"
        android:layout_height="match_parent" >

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

            <TextView
                android:id="@+id/textView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Text View 1"
                android:textSize="30dp" />

            <ListView
                android:id="@+id/listView1"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                >
            </ListView>

                        <TextView
                android:id="@+id/textView2"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Text View 2"
                android:textSize="30dp" />


            <ListView
                android:id="@+id/listView2"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                >
            </ListView>

                <TextView
                android:id="@+id/textView3"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                android:gravity="center"
                android:text="Text View 3"
                android:textSize="30dp" />


            <ListView
                android:id="@+id/listView3"
                android:layout_width="match_parent"
                android:layout_height="wrap_content"
                >
            </ListView>

        </LinearLayout>

    </ScrollView>

</LinearLayout>

And the question is, is that why does it look so much different when I click on the "Graphical Layout" tab? What I imagined the graphical layout to look like would basically be 3 labels right under each other (this is because I set everything to wrap content, and because there are no items inside either of the ListViews, so I'd think that it wouldn't even be visible). But anyway, the graphical layout shows it to be:

Graphical Layout

I'm not sure if that's correct or not, and if I run it will it look like I imagine it to look? I basically want (everything inside 1 ScrollView) 3 TextView's, and 1 ListView immediately following each TextView. So the layout will look like this:

ScrollView
TextView
ListView
TextView
ListView
TextView
ListView
End of ScrollView

Something exactly like the layout shown above. Could someone please tell me what is wrong within my XML file for all the other labels not be showing on it?

Note: When I click on the components on the side, it seems that a few things are shifting. (When I tried clicking on the TextView2 (to try to search for the blue bounds box) it seemed like the TextView1 label got pushed down a bit, and the second TextView was still not visible. If anyone could please help me achieve the layout that I want, it would be greatly appreciated.

score 1 · Answer 1 · edited May 23 '17 at 10:32

EDIT: take a look at this approach.

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

    <ScrollView 
        android:id="@+id/scrollView1"
        android:layout_width="match_parent"
        android:layout_height="wrap_content" >

        <TextView
            android:id="@+id/textView1"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Text View 1"
            android:textSize="30dp" /> 


    </ScrollView>            

    <ScrollView 
        android:id="@+id/scrollView2"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/scrollView1">

        <TextView
            android:id="@+id/textView2"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Text View 2"
            android:textSize="30dp" /> 


    </ScrollView>



   <ScrollView 
        android:id="@+id/scrollView3"
        android:layout_width="match_parent"
        android:layout_height="wrap_content"
        android:layout_below="@id/scrollView2" >

        <TextView
            android:id="@+id/textView3"
            android:layout_width="match_parent"
            android:layout_height="wrap_content"
            android:gravity="center"
            android:text="Text View 3"
            android:textSize="30dp" /> 


    </ScrollView>

</RelativeLayout>

As for the ListView you should not put a ListView inside a ScrollView. Here is an explanation of why you should not put a ListView inside a ScrollView: Listview inside ScrollView

That's kind of what I want, and I appreciate your answer, but how do I incorporate the ScrollView's inside there? I want one ScrollView underneath each TextView. — Josh M, Jul 20 '12 at 01:59
Oh sorry never noticed that, and I see. But basically my perception on this whole thing is if I don't have a ScrollView containing everything, if the lists contain too much information in them, you won't be able to see any of the other things. Example: If there are, let say, 20 elements inside the first ListView (which would fill up the whole screen), I know that there would be a ScrollView inside there, but would my other TextView's and ListView's be visible after I finish scrolling all the way down? — Josh M, Jul 20 '12 at 02:04
I see what you are saying...I change the code, probably that works better. You can set the width of each `ScrollView` to what ever you want. That should let you do what you want. — 0gravity, Jul 20 '12 at 02:24

Android Development - Graphical Layout looks different from actual XML

1 Answers1