xamarin 表单删除 grid.rows 之间的间距不起作用答案

【问题标题】：xamarin forms remove spacing between grid.rows not workingxamarin 表单删除 grid.rows 之间的间距不起作用
【发布时间】：2018-05-01 23:19:30
【问题描述】：

在我的 Xamarin.Forms 项目中，我有一个 2 行 3 列的网格。在 row1 我有一个标签，在 row2 我有一个垂直的堆栈面板。标签和堆栈面板之间似乎有很大的空间，我该如何去除这个间隔？

我尝试过使用 rowspacing=0 但它不起作用。有什么想法吗？

如果我删除堆栈面板并仅在不同行中使用标签，则空间会被删除...但我想保留堆栈面板

这是代码...

<Grid Grid.Row="1" Grid.Column="0" RowSpacing="0"
      Margin="5"
      BackgroundColor="{StaticResource backgroundColorWhite}">
    <Grid.RowDefinitions>
        <RowDefinition Height="*"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Label Grid.Row="0" Grid.Column="0" HorizontalOptions="Start"
           Margin="5,5,0,0"
           Text="{Binding MyUserSelections.SelectedClientName}" 
           TextColor="{StaticResource textColorBlack}"
           FontSize="16"
           FontAttributes="Bold"/>

    <StackLayout Grid.Row="1" Grid.Column="0" 
                 Orientation="Vertical" 
                 Padding="0" 
                 Margin="5,0,0,5"
                 Spacing="0">
        <... elements .../>
    </StackLayout>

    <StackLayout Grid.Row="1" Grid.Column="1" 
                 Padding="0" 
                 Margin="0,0,0,5"
                 Spacing="0" 
                 Orientation="Vertical" 
                 HorizontalOptions="CenterAndExpand" >
        <... elements .../>
    </StackLayout>

    <StackLayout Grid.Row="1" Grid.Column="2" 
                 Padding="0" 
                 Margin="0,0,5,0"
                 Spacing="0" 
                 Orientation="Vertical" 
                 HorizontalOptions="End" >
        <... elements .../>
    </StackLayout>
</Grid>

【问题讨论】：

我添加了代码...试图获取屏幕截图
发现了问题...这是因为我定义了两行 *...应该将大小设为自动
您已经注意到了！我已经在写了。发布到进一步的参考。 =)

标签： xamarin.forms grid spacing

【解决方案1】：

没有代码很难说：

问题是您指定了相同的行高。这就是为什么你有一个很大的差距。更改高度值，它们就是问题所在。

<Grid.RowDefinitions>
            <RowDefinition Height="*"/>
            <RowDefinition Height="*"/>
        </Grid.RowDefinitions>

阅读文档：https://docs.microsoft.com/en-us/xamarin/xamarin-forms/user-interface/layouts/grid#Rows_and_Columns

我希望这会有所帮助！

【讨论】：

感谢您的文档...找到了问题...这是因为我定义了两行 *...应该将大小设为自动。谢谢！！！！

【解决方案2】：

您将两个行定义都设置为*。这意味着每个将占用内容的一半可用空间。您应该将第一个设置为Auto，以便仅使用显示行内容所需的空间。其余空间将被第二行占据。

我想你也想将Grid.ColumnSpan="3" 设置为第一个元素。它会给它更多的水平空间。

像这样：

<Grid Grid.Row="1" Grid.Column="0" 
      RowSpacing="0"
      Margin="5"
      BackgroundColor="{StaticResource backgroundColorWhite}">
    <Grid.RowDefinitions>
        <RowDefinition Height="Auto"/>
        <RowDefinition Height="*"/>
    </Grid.RowDefinitions>
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
        <ColumnDefinition Width="*"/>
    </Grid.ColumnDefinitions>

    <Label Grid.Row="0" Grid.Column="0" Grid.ColumnSpan="3" 
           HorizontalOptions="Start"
           Margin="5,5,0,0"
           Text="{Binding MyUserSelections.SelectedClientName}" 
           TextColor="{StaticResource textColorBlack}"
           FontSize="16"
           FontAttributes="Bold"/>

    (...)

</Grid>

【讨论】：