CODEWITHSUNDEEP
androidandroid-layoutgridview
TheDevMan
TheDevMan

Reputation: 5954

LinearLayout with a gridView in android

I am trying to insert a linearlayout and gridviewlayout in a relativeLayout. Something like this:

enter image description here

But I am getting results like this:

enter image description here

How to solve this issue? I would like to insert a sort image and Filter image accordingly near their texts too. here is my XML layout that I tried.

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

<GridView
    android:id="@+id/gridView1"
    android:layout_width="match_parent"
    android:layout_height="match_parent"
    android:layout_above="@+id/bothbuttons"
    android:background="#FFFFFF"
    android:columnWidth="125dp"
    android:horizontalSpacing="3dp"
    android:numColumns="2"
    android:padding="5dp"
    android:scrollbars="vertical"
    android:verticalSpacing="3dp" >
</GridView>

<LinearLayout
    android:id="@+id/bothsortandfilter"
    android:layout_width="match_parent"
    android:layout_height="wrap_content"
    android:layout_alignParentBottom="true"
    android:background="@color/grid_bg"
    android:baselineAligned="false"
    android:orientation="horizontal"
    android:paddingBottom="10dp" >

    <LinearLayout
        android:id="@+id/sortLayout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight=".50"
        android:background="@color/grid_sort"
        android:gravity="center"
        android:orientation="horizontal"
        tools:ignore="NestedWeights" >

        <TextView
            android:id="@+id/sortText"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:text="Sort"
            android:gravity="center"
            tools:ignore="ContentDescription" />
    </LinearLayout>

    <LinearLayout
        android:id="@+id/filterLayout"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:background="@color/grid_filter"
        android:layout_weight=".50"
        android:gravity="center"
        android:orientation="horizontal" >

        <TextView
            android:id="@+id/filterText"
            android:layout_width="match_parent"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="Filter"
            tools:ignore="ContentDescription" />
    </LinearLayout>
</LinearLayout>

</RelativeLayout>

Can somebody help me fix this? I have struggling to get a result like the above first image?

Upvotes: 0

Views: 2185

Answers (5)

Harin
Harin

Reputation: 2423

I am posting only bottom linear layout:

<LinearLayout
android:id="@+id/bothsortandfilter"
android:layout_width="match_parent"
android:layout_height="wrap_content"
android:layout_alignParentBottom="true"
android:baselineAligned="false"
android:gravity="center"
android:orientation="horizontal" >

<LinearLayout
    android:id="@+id/sortLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="horizontal"
    android:paddingBottom="10dp"
    android:paddingTop="10dp" >

    <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/sortText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Sort" />
</LinearLayout>

<View
    android:layout_width="2dp"
    android:layout_height="match_parent"
    android:background="@android:color/darker_gray" />

<LinearLayout
    android:id="@+id/filterLayout"
    android:layout_width="0dp"
    android:layout_height="wrap_content"
    android:layout_weight="1"
    android:gravity="center"
    android:orientation="horizontal"
    android:paddingBottom="10dp"
    android:paddingTop="10dp" >

     <ImageView
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:src="@drawable/ic_launcher" />

    <TextView
        android:id="@+id/filterText"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:gravity="center"
        android:text="Filter" />
</LinearLayout>

Hope this helped!

Upvotes: 1

Gopal Singh
Gopal Singh

Reputation: 1133

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

<GridView
    android:id="@+id/grid"
    android:layout_width="fill_parent"
    android:layout_height="0dp"
    android:layout_marginBottom="30dp"
    android:layout_weight="2.52"
    android:columnWidth="100dp"
    android:gravity="center"
    android:horizontalSpacing="10dp"
    android:numColumns="2"
    android:stretchMode="columnWidth" />

<LinearLayout
    android:id="@+id/bothsortandfilter"
    android:layout_width="match_parent"
    android:layout_height="0dp"
    android:layout_weight="0.5"
    android:orientation="horizontal"
    android:weightSum="2.2" >

    <TextView
        android:id="@+id/sortText"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:text="Sort" />

    <View
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="0.2"
        android:background="#000" />

    <TextView
        android:id="@+id/filterText"
        android:layout_width="0dp"
        android:layout_height="match_parent"
        android:layout_weight="1"
        android:gravity="center"
        android:padding="16dp"
        android:text="Filter" />
</LinearLayout>

Upvotes: 0

Nooh
Nooh

Reputation: 1546

check this

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

    <GridView
        android:id="@+id/gridView1"
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:background="#FFFFFF"
        android:columnWidth="125dp"
        android:horizontalSpacing="3dp"
        android:numColumns="2"
        android:padding="5dp"
        android:scrollbars="vertical"
        android:verticalSpacing="3dp" >
    </GridView>

    <ProgressBar
        style="?android:attr/progressBarStyleLarge"
        android:layout_width="wrap_content"
        android:layout_height="wrap_content"
        android:id="@+id/progressBar2"
        android:layout_gravity="right" />

    <LinearLayout
        android:id="@+id/bothsortandfilter"
        android:layout_width="match_parent"
        android:layout_height="58dp"
        android:background="@color/grid_bg"
        android:orientation="horizontal" >
        <TextView
            android:id="@+id/sortText"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:padding="16dp"
            android:layout_height="match_parent"
            android:text="Sort"
            android:gravity="center"
            tools:ignore="ContentDescription" />
        <View
            android:layout_width="5dp"
            android:layout_height="match_parent"
            android:background="#000"/>
        <TextView
            android:id="@+id/filterText"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:padding="16dp"
            android:layout_height="match_parent"
            android:gravity="center"
            android:text="Filter"
            tools:ignore="ContentDescription" />

    </LinearLayout>

</LinearLayout>

replace textview with Button

<Button
            android:id="@+id/sortText"
            android:layout_width="0dp"
            android:layout_weight="1"
            android:padding="16dp"
            android:layout_height="match_parent"
            android:text="Sort"
            android:gravity="center"
            tools:ignore="ContentDescription"
            android:background="#fff"
            android:drawableLeft="@drawable/ic_sort"/>//replace with your image

Upvotes: 1

Sushant kunal
Sushant kunal

Reputation: 421

Provide a background for your bothsortandfilter layout( A darker shade of gray). And then provide some layout_margin of 2dp in bothsortandfilter .

For the space in between, you can provide a margin_left for the filterLayout element and margin_right for sortLayout. I think a value of 5dp should do the trick for you.

Upvotes: 0

Karthika PB
Karthika PB

Reputation: 1373

Try this way and check if it works

1) at first give a specific height for your ' bothsortandfilter' layout.Then give it a weightsum of 2. 2)for sortLayout and filterLayout give weight as 1.and for sortLayout give a marginright value 0f 1 dp and for filterlayout marginleft as 1 dp (these are for the divider part) 3)finally for gridview add a property marginbottom=(height which you set for->bothsortandfilter)+1 dp.

Upvotes: 0

Related Questions