My grid layout is having column size inconsistencies

Question

EDIT 3: I solved my problem by using a LinearLayout as explained here.

EDIT 2: Second infusion of the code:

CheckBox cb = new CheckBox(this);
cb.Id = View.GenerateViewId();

GridLayout.LayoutParams cbButtonLayoutParams = new GridLayout.LayoutParams(GridLayout.InvokeSpec(row, 1f), GridLayout.InvokeSpec(column, 1f))
    {
         Width = 0,
         Height = GridLayout.LayoutParams.WrapContent
    };
cb.LayoutParameters = cbButtonLayoutParams;
cb.ScaleX = cb.ScaleY = 1;
cb.SetButtonDrawable(Resource.Drawable.custom_habit_checkbox);
cb.Click -= habitDoneState_Click;
cb.Click += habitDoneState_Click;

In this case the checkboxes are not rendered.

EDIT 1: G.Hakim proposed answer led to a slightly better layout. This time I have 10 checkboxes visible but there is now unused space between the 9th and 10th checkboxes...

I'm adding 10 checkboxes programmatically to a grid layout with the following code called 10 times:

CheckBox cb = new CheckBox(this);
cb.Id = View.GenerateViewId();

GridLayout.LayoutParams cbButtonLayoutParams = new GridLayout.LayoutParams();
cbButtonLayoutParams.RowSpec = GridLayout.InvokeSpec(row, 1);   // Setting row and rowspan respectivly
cbButtonLayoutParams.ColumnSpec = GridLayout.InvokeSpec(column, 1);    // Setting col and colspan respectivley
cbButtonLayoutParams.Width = 0;
cbButtonLayoutParams.Height = GridLayout.LayoutParams.WrapContent;
cbButtonLayoutParams.SetGravity(GravityFlags.Center);
// This is how we specify the layout_weight
// https://stackoverflow.com/a/53230727/15186
cbButtonLayoutParams.ColumnSpec = GridLayout.InvokeSpec(column, 1f);

cb.LayoutParameters = cbButtonLayoutParams;
cb.ScaleX = cb.ScaleY = 1;
cb.SetButtonDrawable(Resource.Drawable.custom_habit_checkbox);

Row and Column values are the following:

row [6] column [0]
row [6] column [1]
row [6] column [2]
row [6] column [3]
row [6] column [4]
row [6] column [5]
row [6] column [6]
row [6] column [7]
row [6] column [8]
row [6] column [9]

The result is the following, captured by the Android layout inspector:

Only 9 checkboxes are visible, checkbox number 7 (column 6 selected in blue) has a strange width so checkbox 10 (column 9) is simply not visible.

The grid layout is the following:

<GridLayout
    xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/monthlyhabits"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent"
    android:columnCount="10"
    android:orientation="horizontal">

</GridLayout>

It is modified by code before adding the checkboxes:

GridLayout gridLayout = FindViewById<GridLayout>(Resource.Id.weeklyhabits);

gridLayout.RemoveAllViews();

// Set the total number of columns
// The max number of column is the number of buttons
// We may have 10 buttons per periodicity (daily/weekly/monthly)
int totalColumns = 10;
// The max number of rows is the number of habits * 2
// One row for the habit text
// One row for the habit buttons
int totalRows = DataInfo.ms_data.habits.Where(h => h.Value.repeat_hours == 168).Count() * 2;
totalRows += 2;

gridLayout.ColumnCount = totalColumns;
gridLayout.RowCount = totalRows;
gridLayout.Orientation = GridOrientation.Horizontal;

I just can't understand what is wrong here. Any help appreciated.

Did setting the width to zero help? – FreakyAli Nov 19 '18 at 11:11 — FreakyAli, Nov 19 '18 at 11:11

score 0 · Answer 1 · answered Nov 19 '18 at 06:24

0

My understanding of the situation tells me that you are not setting the layout weight to the layout using the spec properly,

Something like this should do the trick for you:

GridLayout.LayoutParams cbButtonLayoutParams = new GridLayout.LayoutParams(GridLayout.InvokeSpec(GridLayout.Undefined, 1f), GridLayout.InvokeSpec(GridLayout.Undefined, 1f));
cbButtonLayoutParams.SetGravity(GravityFlags.Center);
cbButtonLayoutParams.Height = GridLayout.LayoutParams.WrapContent;
cbButtonLayoutParams.Width= GridLayout.LayoutParams.WrapContent;

Where the undefined keyword is used to indicate that the start value is undefined.

answered Nov 19 '18 at 06:24

FreakyAli

13,349
3
23
63

@OlivierMATROT Try setting the width of the layout params to zero and try again – FreakyAli Nov 19 '18 at 07:39
This time the checkbox is not rendered at all :( – Nov 21 '18 at 09:39
you set the width to zero like this right? `cbButtonLayoutParams.Width=0;` – FreakyAli Nov 21 '18 at 09:50
Absolutely. Id did just that. – Nov 21 '18 at 12:05
Please update your latest code into the question so I can take a look and understand the situation a tad bit better! – FreakyAli Nov 21 '18 at 12:07

score 0 · Answer 2 · answered Nov 19 '18 at 06:32

0

Setting stretch mode to stretch the column widths and set the number of columns 2

android:stretchMode="columnWidth"
android:numColumns="2"

for detail follow the link

answered Nov 19 '18 at 06:32

Zahoor Saleem

614
7
15

My grid layout is having column size inconsistencies

2 Answers2