android:layout_below with ImageView not working

Question

Do android:layout_...s work with ImageViews? From the picture you can see that all 10 rows are on top of each other so that means that q2Image is not accepting the code android:layout_below="@/q1Image" for it to drop down a line and star the next row.

Am I just missing something or am I trying to do something that is impossible?

<ScrollView
    android:layout_width="fill_parent"
    android:layout_height="0dip"
    android:layout_weight="65"
    android:fillViewport="true" >

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

        <ImageView 
            android:id="@+id/q1Image"
            android:layout_width="10dp"
            android:layout_height="10dp"  /> 

        <TextView 
            android:id="@+id/q1Question"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/q1Image" /> 

        <TextView 
            android:id="@+id/q1Answer"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"   
            android:layout_toRightOf="@id/q1Question"  /> 

        <TextView 
            android:id="@+id/q1Verse"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"   
            android:layout_toRightOf="@id/q1Answer"  /> 

        <View 
            android:layout_width="fill_parent"
            android:layout_height="1dp"       
            android:background="#C2BEBF" />

        <ImageView 
            android:id="@+id/q2Image"
            android:layout_width="10dp"
            android:layout_height="10dp"
            android:layout_below="@id/q1Image"  />

        <TextView 
            android:id="@+id/q2Question"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"
            android:layout_toRightOf="@id/q2Image" /> 

        <TextView 
            android:id="@+id/q2Answer"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"   
            android:layout_toRightOf="@id/q2Question"  /> 

        <TextView 
            android:id="@+id/q2Verse"
            android:layout_width="wrap_content"
            android:layout_height="wrap_content"   
            android:layout_toRightOf="@id/q2Answer"  /> 

        <View 
            android:layout_width="fill_parent"
            android:layout_height="1dp"       
            android:background="#C2BEBF" />
//Above code is first 2 rows.  There are 10 rows total but I removed the code for rows 3-10 for this post.

enter image description here

for more information check this question http://stackoverflow.com/questions/5025910/difference-between-id-and-id-in-android — William Kinaan, Feb 08 '13 at 14:01
I read and tried both ways only to come with the same result with both. — Matt, Feb 08 '13 at 14:12
Go to Graphical layout in eclipse and place it using mouse, instead writing the code... — Pragnani, Feb 08 '13 at 15:17

Festus Tamakloe · Answer 1 · 2013-02-08T14:43:54.783

1

Try to put + between @ and id and everything must be ok

@+id

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

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

        <!-- here the columns -->
    </LinearLayout>

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

        <!-- here the columns -->
    </LinearLayout>
    .
    .

</LinearLayout>

edited Feb 08 '13 at 14:43

answered Feb 08 '13 at 13:52

Festus Tamakloe

11,231
9
53
65

Changed all instances to add the ````+```` but the result is the same. – Matt Feb 08 '13 at 14:09
Did you have a screen view for your issue? i think there is simpler way – Festus Tamakloe Feb 08 '13 at 14:16
What do you mean by a screen view? – Matt Feb 08 '13 at 14:26
design view. what the layout must look at – Festus Tamakloe Feb 08 '13 at 14:28
I don't have one but basically it is 10 rows with 4 columns each. Column zero is a small picture (green check mark or red x) and then the last 3 columns are each a string. – Matt Feb 08 '13 at 14:35
Ok I will try to integrate it to a ````LinearLayout````. I have been having a fit with this page. ````TableLayout```` didn't work and now this one is not working for me. Hopefully Linear will work. – Matt Feb 08 '13 at 14:44

score 0 · Answer 2 · answered Feb 08 '13 at 13:51

0

Referencing Id's like that not always working. Replace "@id" with "@+id" everywhere. Example:

android:layout_below="@+id/q1Image"

answered Feb 08 '13 at 13:51

Yaroslav Mytkalyk

16,950
10
72
99

Changed all instances to add the ````+```` but the result is the same. – Matt Feb 08 '13 at 14:09
I cleaned and rebuilt with the same result. – Matt Feb 08 '13 at 14:33

Poonam Anthony · Answer 3 · 2013-02-08T14:52:21.150

The way you are accessing the ids in the code is correct. "@+id" is used to declare the id. All references to it following the declaration should be "@id". Are you having the same problems with the TextViews also? I think you should set the layout_below property for the TextViews as well. Because I can see text is also overlapped in your UI. eg.,

<TextView 
        android:id="@+id/q2Question"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_below = "@id/q1Question"
        android:layout_toRightOf="@id/q2Image" />

RelativeLayout will not place a view below another unless you specify layout_below for it. Hence your TextViews appear overlapped.

android:layout_below with ImageView not working

3 Answers3