CODEWITHSUNDEEP
iosipadxamarinxamarin.forms
Nirav Mehta
Nirav Mehta

Reputation: 7073

How to set width of controls in Xamarin.Forms

I've tried to adjust width & height of my textbox [Entry] control in Xamarin.Forms for iPad app but it doesn't set the width using WidthRequest property.

Can anyone please help me for the same about how to set the width of the controls.

Here is my code of XAML for same using Grid & StackLayout but none of them worked.

<Grid VerticalOptions="FillAndExpand" HorizontalOptions="FillAndExpand" >
    <Grid.RowDefinitions>
    <RowDefinition Height="Auto"  ></RowDefinition>
    <RowDefinition Height="*"></RowDefinition>
    <RowDefinition Height="10"></RowDefinition>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
    <ColumnDefinition Width="*"></ColumnDefinition>
    </Grid.ColumnDefinitions>

    <Image Grid.Row="0" Grid.Column="0" Source="loginlogo.png"></Image>
    <StackLayout Grid.Row="1" Grid.Column="0">
    <Entry Placeholder="Enter Username" WidthRequest="20"></Entry>
    <Entry Placeholder="Enter Password" WidthRequest="20"></Entry>
    <Button Text="Button 1"></Button>
    </StackLayout>
    </Grid>

Also tried with Stack Layout

<StackLayout Spacing="10">
    <Entry x:Name="txtUserName" Placeholder="Enter Username" WidthRequest="2" HeightRequest="200"></Entry>
    <Entry x:Name="txtPassword" Placeholder="Enter Password" WidthRequest="2" HeightRequest="200"></Entry>
    <Button Text="Button 1"></Button></StackLayout>

Upvotes: 14

Views: 48629

Answers (2)

Sergey Metlov
Sergey Metlov

Reputation: 26331

Use StackLayout with combination of spacings, horizontal/vertical options and paddings. Example:

<StackLayout Padding="20" Spacing="10">
  <Entry Placeholder="Username"
         VerticalOptions="Start"
         HorizontalOptions="FillAndExpand" />

  <Entry Placeholder="Password"
         VerticalOptions="Start"
         HorizontalOptions="FillAndExpand" />

  <Button Text="Submit" VerticalOptions="EndAndExpand" />
</StackLayout>

Upvotes: 10

Pete
Pete

Reputation: 4746

Note that you have to specify HorizontalOptions with the WidthRequest to get this to work on a StackLayout as it will attempt to auto-expand by default.

Example shown below for StackLayout:-

        StackLayout objStackLayout = new StackLayout()
        {
            Spacing = 10
        };
        //
        Entry objEntry1 = new Entry()
        {
            Placeholder = "Enter Username",
            WidthRequest = 300,
            HeightRequest = 200,
            HorizontalOptions = LayoutOptions.Start
        };
        objStackLayout.Children.Add(objEntry1);
        //
        Entry objEntry2 = new Entry()
        {
            Placeholder = "Enter Password",
            WidthRequest = 200,
            HeightRequest = 200,
            HorizontalOptions = LayoutOptions.Start
        };
        objStackLayout.Children.Add(objEntry2);
        //
        Button objButton1 = new Button()
        {
            Text = "Button1",
            HorizontalOptions = LayoutOptions.Start
        };
        objStackLayout.Children.Add(objButton1);

Upvotes: 34

Related Questions