Setting Width Causes Height Changes

Question

I have an array of Button(s) which I want in 2 columns of equal width. The number of Button(s) is not always the same, so I dynamically set the properties in code. Here is a section of the code:

for (int index = 0; index < (homescreenbuttons.Count / 2); index++)
{
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).ColumnSpec = GridLayout.InvokeSpec(0, 1, GridLayout.Fill, 1);
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).RowSpec = GridLayout.InvokeSpec(index);
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).Width = 0;
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).SetGravity(GravityFlags.FillHorizontal);
}

However, setting the width to 0 (which I do because I use a weight of 1 in the ColumnSpec) causes to Button(s) to become unexpected heights. If I modify this code to set the width to GridLayout.LayoutParams.WrapContent, the height shows correctly, but the column widths are not equal. What should I do for the Width (or if I need to change something else, what would it be)? Thanks.

Answer 1

I think I found the answer. As it often is, it was simple carelessness. When rotating to portrait, I was setting the Width & Gravity, but I was not doing that when rotating to landscape (which is the code in this post was for). So once I added that, it seems to be good. Here is my final code:

for (int index = 0; index < homescreenbuttons.Count; index++)
{
    bool islastrowbutton = (homescreenbuttons.Count % 2) == 1 && index == (homescreenbuttons.Count / 2);
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).RowSpec = GridLayout.InvokeSpec(index % (homescreenbuttons.Count / 2 + homescreenbuttons.Count % 2));
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).ColumnSpec =
        GridLayout.InvokeSpec(index / (homescreenbuttons.Count / 2 + homescreenbuttons.Count % 2),
        islastrowbutton ? 2 : 1, islastrowbutton ? GridLayout.Center : GridLayout.Fill, 1f);
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).Width = islastrowbutton ? GridLayout.LayoutParams.WrapContent : 0;
    (homescreenbuttons[index].LayoutParameters as GridLayout.LayoutParams).SetGravity(islastrowbutton ? GravityFlags.CenterHorizontal : GravityFlags.FillHorizontal);
}
this.incHomeScreen.RowCount = (homescreenbuttons.Count / 2) + (homescreenbuttons.Count % 2);
this.incHomeScreen.ColumnCount = 2;

Thanks for your help!

Answer 2

Hello,​

Welcome to our Microsoft Q&A platform!

but the column widths are not equal. What should I do for the Width (or if I need to change something else, what would it be)?

Please set column_wight for the views programmatically. Here is the sample code, you could refer to it.

   GridLayout layout = FindViewById<GridLayout>(Resource.Id.gridLayout);  
     
   private void Button_Click(object sender, EventArgs e)  
   {  
       var btnList = new List<Button>()  
       {  
           new Button(this){ Text = "button1" },  
           new Button(this){ Text = "button2" },  
           new Button(this){ Text = "button3" },  
           new Button(this){ Text = "button4" },  
           new Button(this){ Text = "button5" },  
           new Button(this){ Text = "button6" },  
           new Button(this){ Text = "button7" },  
           new Button(this){ Text = "button8" },  
       };  
     
       for (int index = 0; index < btnList.Count; index++)  
       {  
           var btn = btnList[index];  
           var layoutParameter = new GridLayout.LayoutParams();  
     
           if (index % 2 == 0)  
           {  
               layoutParameter.RowSpec = GridLayout.InvokeSpec(index / 2);  
               layoutParameter.ColumnSpec = GridLayout.InvokeSpec(0, 1f);//place in the first column  
           }  
           else  
           {  
               layoutParameter.RowSpec = GridLayout.InvokeSpec((index - 1) / 2);  
               layoutParameter.ColumnSpec = GridLayout.InvokeSpec(1, 1f);//place in the second column  
           }  
           btn.LayoutParameters = layoutParameter;  
           layout.AddView(btn);  
       }  
   }  

Best Regards,

Jarvan Zhang

---

If the response is helpful, please click "Accept Answer" and kindly upvote it. If you have extra questions about this answer, please click "Comment".

Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.