2

My grid design is as such. But i want to remove the spaces on both sides of the grid elements. (Black marked)

enter image description here

I want the image to be expanded somewhat like

My XML layouts for the gridview

<?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"
    tools:context=".MainActivity" >

    <GridView
        android:id="@+id/grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:columnWidth="100dip"
        android:gravity="center"
        android:numColumns="2"
        android:stretchMode="spacingWidthUniform" />

</LinearLayout>

My grid element layout

<?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" >

    <ImageView
        android:id="@+id/grid_image"
        android:layout_width="fill_parent"
        android:layout_height="fill_parent"
        android:scaleType="fitXY"
        android:contentDescription="@string/im" >
    </ImageView>

    <TextView
        android:id="@+id/grid_text"
        android:layout_width="fill_parent"
        android:layout_height="wrap_content"
        android:maxLength="23"
        android:gravity="center"
        android:layout_marginTop="10sp"
        android:paddingTop="10dp"
        android:paddingBottom="10dp"
        android:textSize="12sp" >
    </TextView>

</LinearLayout>

enter image description here

2 Answers2

1

Try Changing

 <GridView
        android:id="@+id/grid"
        android:layout_width="match_parent"
        android:layout_height="match_parent"
        android:gravity="center"
        android:verticalSpacing="1dp"
        android:horizontalSpacing="1dp"
        android:numColumns="2"
        android:background="#abcdef"
        android:stretchMode="columnWidth" />
N J
  • 27,217
  • 13
  • 76
  • 96
  • That worked ,is there a way to introduce a separator between the columns like a line or a thin space. – Kiran Manjunath Jul 12 '15 at 18:47
  • what you can do is set background color to gridview and set vertical and horizontal spacing to `1dp`, I have updated my answer – N J Jul 12 '15 at 18:49
  • That did, but in the left there is no spacing(I've updated the the pic). Also i want to expand image not only horizontally but like expanding the square so that it doesnt look distorted. – Kiran Manjunath Jul 12 '15 at 18:56
  • you need to create custom imagview see this link http://stackoverflow.com/questions/16506275/imageview-be-a-square-with-dynamic-width – N J Jul 12 '15 at 19:00
1

You can replace GridView with GridLayout and use weights to make the images fill the screen. Here's the reference: http://developer.android.com/reference/android/widget/GridLayout.html, (See the section: Excess space distribution)

Price
  • 2,683
  • 3
  • 17
  • 43