How to resize a button in Xamarin

Question

I'm using Xamarin.Forms. I tried this code but it has not worked; how can I resize the buttons?

<ContentView.Content>
  <StackLayout>
    <Button Text="1" WidthRequest="50"></Button>
    <Button Text="2" WidthRequest="50"></Button>
  </StackLayout>
</ContentView.Content>

Thank you.

Solution 1

<StackLayout >
    <Button Text="1" WidthRequest="50" 
            HorizontalOptions="Center"></Button>
    <Button Text="2" WidthRequest="50" 
            HorizontalOptions="Center"></Button>
</StackLayout>

Solution 2

  <StackLayout>
    <!--I am wider but shorter-->
    <Button Text="1" WidthRequest="100" HeightRequest="50"></Button>
    <!--I am narrower but longer-->
    <Button Text="2" WidthRequest="50" HeightRequest="100"></Button>
    <!--I fill the whole width. See also VerticalOptions-->
    <Button Text="3" HorizontalOptions="FillAndExpand"></Button>
  </StackLayout>

Solution 3

You can use HorizontalOptions attribute to make the width or height be as large as needed to contain the elements within it.

<Button  HorizontalOptions="Center"  Text="Retry" />

Solution 4

Just Size parent View, for example if it's in a StackLayout, it'll be same size with parent.

   <Grid HeightRequest="120" WidthRequest="120" HorizontalOptions="Center">
            <Button Text="Hello!" BackgroundColor="Red"/>
        </Grid>

It'll be shown 120 x 120,

Because, Button's Default HorizontalOptions is Fill, VerticalOptions is Start. But some Controls like buttons, ignores Height or Width request and prefer to fill parent. Other elements in the same Layout effects button. Just resize parent of button and leave it.

View more solutions

Comments

[jfmg]

In my case I had HorizontalOptions="Fill" and to set the WidthRequest property in my code behind file had no effects. I set it to Center (or Start or End) and it worked.

[ToolmakerSteve]

Test your code. In Xamarin Forms, you need to set HeightRequest and WidthRequest. Attempting to set Height and Width won't compile: those are read-only properties.