GridLayout(Not GridView) : How to create Items With different Heights through xml

Question

I have fragment with a view like this

enter image description here

Inside this grid layout my item must be arranged like this

enter image description here

you can see the items have different heights . even the space between each rows are different .I try to achieve this through giving row spans . but all my logic gone wrong

I refer these links : Link 1 ,Link 2, Link 3

But my ideas are not helping me . can anyone suggest me how to achieve this

EDIT :After accepting the answer

<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
android:layout_width="match_parent"
android:layout_height="match_parent">

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="0.35">

</LinearLayout>

<GridLayout
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:orientation="horizontal"
    android:rowCount="20"
    android:columnCount="1">

    <LinearLayout
        android:layout_row="0"
        android:layout_gravity="fill">
        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="Name"
            android:gravity="left"
            android:layout_weight="1"/>

        <EditText
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="EditText"
            android:gravity="center"
            android:layout_weight="1"/>
        <Space 
            android:layout_width="45dp"
            android:layout_height="match_parent"/>
    </LinearLayout>
    <Space
        android:layout_row="1"
        android:layout_gravity="fill"
        android:layout_rowSpan="1"/>
    <LinearLayout
        android:layout_row="3"
        android:layout_gravity="fill"
        android:layout_rowSpan="4">
        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="Address"
            android:gravity="left"
            android:layout_weight="1"/>

        <EditText
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:lines="4"
            android:text="EditText"
            android:gravity="center"
            android:layout_weight="1"
           />

        <Space 
            android:layout_width="45dp"
            android:layout_height="match_parent"/>
    </LinearLayout>
    <Space
        android:layout_row="7"
        android:layout_gravity="fill"/>
    <LinearLayout
        android:layout_row="8"
        android:layout_gravity="fill">
        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="Email"
            android:gravity="left"
            android:layout_weight="1"/>


        <EditText
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="EditText"
            android:gravity="center"
            android:layout_weight="1"/>
        <ImageView android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:paddingLeft="30dp"
            android:src="@android:drawable/arrow_up_float"/>

    </LinearLayout>
    <Space
        android:layout_row="9"
        android:layout_gravity="fill"/>
    <LinearLayout
        android:layout_row="10"
        android:layout_gravity="fill"
        android:layout_rowSpan="6">
        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="About Me"
            android:gravity="left"
            android:layout_weight="1"/>

        <EditText
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:lines="5"
            android:text="EditText"
            android:gravity="center"
            android:layout_weight="1"/>
        <Space 
            android:layout_width="45dp"
            android:layout_height="match_parent"/>
    </LinearLayout>
    <Space
        android:layout_row="16"
        android:layout_gravity="fill"
        android:layout_rowSpan="3"/>
    <LinearLayout
        android:layout_row="19"
        android:layout_gravity="fill">
        <TextView
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="Nick Name"
            android:gravity="left"
            android:layout_weight="1"/>

        <EditText
            android:layout_width="0dp"
            android:layout_height="match_parent"
            android:text="EditText"
            android:gravity="center"
            android:layout_weight="1"/>
      <ImageView android:layout_width="wrap_content"
            android:layout_height="match_parent"
            android:paddingLeft="30dp"
            android:src="@android:drawable/arrow_up_float"/>
    </LinearLayout>

</GridLayout>

<LinearLayout
    android:layout_width="0dp"
    android:layout_height="match_parent"
    android:layout_weight="0.30">

</LinearLayout>

can you handle that with two or three layout? if yes so you need `getItemViewType` and `getViewTypeCount` for creating this — Shayan Pourvatan, May 15 '14 at 05:13
yes , sorry i didn't see `GridLayout` , Link 3 not helped you? what is the problem with that? — Shayan Pourvatan, May 15 '14 at 05:17
@shayanpourvatan i try with rowspan the item didn't expand, I try changing the layout_gravity also . but didn't work — edwin, May 15 '14 at 05:19
@shayanpourvatan I had posted sample xmml i tried you can see the second edit text didn't expand — edwin, May 15 '14 at 06:36

score 1 · Accepted Answer · answered May 15 '14 at 07:08

// Try this way,hope this will help solve your problem...

<LinearLayout  xmlns:android="http://schemas.android.com/apk/res/android"
    android:layout_width="match_parent"
    android:layout_height="match_parent">

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.35">

    </LinearLayout>

    <GridLayout
        android:layout_width="0dp"
        android:layout_height="wrap_content"
        android:layout_weight="1"
        android:orientation="horizontal"
        android:rowCount="20"
        android:columnCount="1">

        <LinearLayout
            android:layout_row="0"
            android:layout_gravity="fill">
            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="Name"
                android:gravity="left"
                android:layout_weight="1"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="EditText"
                android:gravity="center"
                android:layout_weight="1"/>
        </LinearLayout>
        <Space
            android:layout_row="1"
            android:layout_gravity="fill"
            android:layout_rowSpan="1"/>
        <LinearLayout
            android:layout_row="3"
            android:layout_gravity="fill"
            android:layout_rowSpan="4">
            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="Address"
                android:gravity="left"
                android:layout_weight="1"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:lines="4"
                android:text="EditText"
                android:gravity="center"
                android:layout_weight="1"/>
        </LinearLayout>
        <Space
            android:layout_row="7"
            android:layout_gravity="fill"/>
        <LinearLayout
            android:layout_row="8"
            android:layout_gravity="fill">
            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="Email"
                android:gravity="left"
                android:layout_weight="1"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="EditText"
                android:gravity="center"
                android:layout_weight="1"/>
        </LinearLayout>
        <Space
            android:layout_row="9"
            android:layout_gravity="fill"/>
        <LinearLayout
            android:layout_row="10"
            android:layout_gravity="fill"
            android:layout_rowSpan="6">
            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="About Me"
                android:gravity="left"
                android:layout_weight="1"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:lines="5"
                android:text="EditText"
                android:gravity="center"
                android:layout_weight="1"/>
        </LinearLayout>
        <Space
            android:layout_row="16"
            android:layout_gravity="fill"
            android:layout_rowSpan="3"/>
        <LinearLayout
            android:layout_row="19"
            android:layout_gravity="fill">
            <TextView
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="Nick Name"
                android:gravity="left"
                android:layout_weight="1"/>

            <EditText
                android:layout_width="0dp"
                android:layout_height="match_parent"
                android:text="EditText"
                android:gravity="center"
                android:layout_weight="1"/>
        </LinearLayout>

    </GridLayout>

    <LinearLayout
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.30">

    </LinearLayout>

</LinearLayout>

thanks for your effort . Can you do me a little more help i need to add an image view after email and nickname text view .I achieve that i will post the xml . can have look on that and tell me is there any better way to achieve that?? — edwin, May 15 '14 at 07:26
have you need put it after Nick Name and Email EditText or TextView ? — Haresh Chhelana, May 15 '14 at 08:34
so why you gave left padding to this images and why use Space where no image are required ? — Haresh Chhelana, May 15 '14 at 08:48
i want align edittext parallel and there must be a space between edit text and image for that i give padding for image view . so in order to achieve the similar view for edittexts i use space where images not required — edwin, May 15 '14 at 09:45

score 0 · Answer 2 · answered May 15 '14 at 05:40

//you need to do with wieghtsum

<?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:layout_margin="20dp"
    android:orientation="horizontal"

    android:weightSum="125" >

    <View
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="35" />

    <GridLayout
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="65" />

    <View
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:layout_weight="30" />

</LinearLayout>

Actually in need help in arranging items inside grid layout the second image — edwin, May 15 '14 at 06:31

GridLayout(Not GridView) : How to create Items With different Heights through xml

2 Answers2