Question

我想使用Xamarin.Forms和XAML在屏幕底部创建两个按钮，如下图所示：

我尝试过使用GridView，但是它从两个按钮获得了填充和空间。这就是我迄今为止的尝试方式：

<Grid RowSpacing="0" 
      ColumnSpacing="0" 
      VerticalOptions="FillAndExpand" 
      HorizontalOptions="FillAndExpand">
    <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="Auto" />
     </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="50*"/>
        <ColumnDefinition Width="50*"/>
    </Grid.ColumnDefinitions>

    <Button Grid.Row="1" Grid.Column="0" 
            Text="SignUp" 
            FontSize="Large"/>
    <Button Grid.Row="1" Grid.Column="1" 
            Text="LogIn" 
            FontSize="Large"/>
</Grid>

Answer 1

尝试在Gridview上设置Padding和Margin属性，在按钮上设置Padding为0. IE，

<GridView Padding="0" Margin="0" ... >

...

<Button Margin="0" ... />

Answer 2

我认为按钮不会提供所需的设计，一旦它有内部填充，圆角和文本上的强制大写（至少在Android上），你无法改变。

也许使用扩展标签和手势识别器可以让您更好地适应。

试试这个：

<Grid ColumnSpacing="0">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>
    <Grid.RowDefinitions>
        <RowDefinition Height="60"/>
    </Grid.RowDefinitions>
    <Label Grid.Column="0" Grid.Row="0"
           Text="Signup"
           TextColor="White"
           FontSize="22"
           BackgroundColor="Red"
           HorizontalOptions="FillAndExpand"
           VerticalOptions="FillAndExpand"
           HorizontalTextAlignment="Center"
           VerticalTextAlignment="Center">
        <Label.GestureRecognizers>
            <TapGestureRecognizer Command="{Binding SignupCommand}"/>
        </Label.GestureRecognizers>
    </Label>
    <Label Grid.Column="1" Grid.Row="0"
           Text="Login"
           TextColor="White"
           FontSize="22"
           BackgroundColor="Green"
           HorizontalOptions="FillAndExpand"
           VerticalOptions="FillAndExpand"
           HorizontalTextAlignment="Center"
           VerticalTextAlignment="Center">
        <Label.GestureRecognizers>
            <TapGestureRecognizer Command="{Binding LoginCommand}"/>
        </Label.GestureRecognizers>
    </Label>
</Grid>

如何在屏幕底部创建两个按钮

2 个答案: