CODEWITHSUNDEEP
androidandroid-layoutgridviewlayoutandroid-linearlayout
RNJ
RNJ

Reputation: 15552

Variable width GridView according to number of cells

Continuation of this question Layout dynamic grid in middle

I have a grid. It have different widths depending on what the user does. Sometimes it may be 4 * 3 other times 2 *5

The width can be greater than 4 as well.

My problem is that the grid itself is always the same width and the cells stretch to fill it. It means that the cell widths for the 2 * 5 are twice as wide as the cell widths for the 4 * 3 one. Ideally I want the grid width to adjust. It should just be columnWidth * numOfColumns.

My xml below has the width at 175px which I think is causing this. When I make it wrap_content it takes up the whole width of the screen and ignores my two padding views.

Can anyone help? Thanks

<LinearLayout
        android:layout_width="match_parent"
        android:layout_height="0dp"
        android:layout_weight="1"
        android:gravity="center"
        android:background="#C8C8C8"
        android:orientation="horizontal">

    <View
            android:background="#C8C8C8"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2"/>

    <GridView xmlns:android="http://schemas.android.com/apk/res/android"
              android:id="@+id/grid_view"
              android:background="#FF000000"
              android:layout_width="175px"
              android:layout_height="wrap_content"
              android:numColumns="5"
              android:columnWidth="35dp"
              android:verticalSpacing="1dp"
              android:horizontalSpacing="1dp"
            />
    <!--android:layout_width="wrap_content"-->

    <View
            android:background="#FFC8C8C8"
            android:layout_width="0dp"
            android:layout_height="wrap_content"
            android:layout_weight="2"/>
</LinearLayout>

To clarify what Im after a bit more.

Top half contains a grid which should be centred ideally. Cells should be same width (and ideally same height so are square) There is a list under the LinearLayout above which should get smaller if the grid takes up too much room (but should never take up more than 50% of the screen)

enter image description here

Upvotes: 2

Views: 300

Answers (1)

Wackaloon
Wackaloon

Reputation: 2365

You need to set grid_view's width to wrap_content and center_horizontal = "true", than make adapter, and set cell width and height for fixed value in getView() method (calculated from dp), after that when you will change number of cells in your code - grid view will change it's width to fit number of cells * width of each cell

//cellWidth = width of each cell including paddings
//gridRowsNumber = number of cells in width
//gridColsNumber = number of cells in height
// in activity's of fragment's onCreate();
gridView.getLayoutParams().width = cellWidth * gridRowsNumber;
gridView.getLayoutParams().height = cellWidth * gridColsNumber;

in layout

<GridView
    android:id="@+id/grid_view"
    android:layout_width="wrap_content"
    android:layout_height="wrap_content"
    android:layout_centerHorizontal="true"
    android:background="@android:color/white"
    android:numColumns="5"
    android:scrollbars="none">
</GridView>

in adapter 

public View getView (int position, View convertView, ViewGroup parent) 
{
    ...
    holder.cellView.getLayoutParams().height = cellWidth;
    holder.cellView.getLayoutParams().width = cellWidth;
    ...
}

Upvotes: 1

Related Questions