Xamarin.Forms 网格列在 Xaml 中调整大小

Question

如何制作一个两列网格，其中左侧的列仅占据所需的空间，使另一列尽可能多的空间

\n\n

我尝试了这段代码：

\n\n

<Grid VerticalOptions="Start" Margin="10,0,10,0">\n   <Grid Grid.Row="0" Grid.Column="0" HorizontalOptions="Start"><Label Text="\xc2\xb7 Exclude Hidden" /></Grid>\n   <Grid Grid.Row="0" Grid.Column="1" HorizontalOptions="Start"><Label Text="All cards except those tagged as hidden" /></Grid>\n   <Grid Grid.Row="1" Grid.Column="0" HorizontalOptions="Start"><Label Text="\xc2\xb7 Include Hidden" /></Grid>\n   <Grid Grid.Row="1" Grid.Column="1" HorizontalOptions="Start"><Label        <Grid Grid.Row="2" Grid.Column="0" HorizontalOptions="Start"><Label Text="\xc2\xb7 Favorites" /></Grid>\n   <Grid Grid.Row="2" Grid.Column="1" HorizontalOptions="Start"><Label Text="Only cards tagged as favorites" /></Grid>\n   <Grid Grid.Row="3" Grid.Column="0" HorizontalOptions="Start"><Label Text="\xc2\xb7 Hidden" /></Grid>\n   <Grid Grid.Row="3" Grid.Column="1" HorizontalOptions="Start"><Label Text="Only those cards tagged as hidden" /></Grid>\n</Grid>\n

\n\n

但这将网格划分为 50:50 的第 1 列和第 2 列。\n我需要的是第 1 列仅占用所需的空间，而第 2 列则占用所有其余空间。

\n\n

有人可以建议我该怎么做吗？

\n

Answer 1

为此，您需要使用Grid.ColumnDefinitions. 这是一个代码示例：

\n\n

 <Grid.ColumnDefinitions>\n            <ColumnDefinition Width="Auto"/>\n            <ColumnDefinition Width="*"/>\n </Grid.ColumnDefinitions>\n

\n\n

使用此代码，您可以定义网格内的列的定义。第一个定义，第一列使用自动宽度，第一列将占用所需的宽度，而我们的第二列ColumnDefinition是第二列，它将占用其余部分（*）或“全部”。

\n\n

要将其与您现有的XAML代码一起使用，请执行以下操作：

\n\n

<Grid VerticalOptions="Start" Margin="10,0,10,0">\n\n        <Grid.ColumnDefinitions>\n            <ColumnDefinition Width="Auto"/>\n            <ColumnDefinition Width="*"/>\n        </Grid.ColumnDefinitions>\n\n        <Grid Grid.Row="0" Grid.Column="0" HorizontalOptions="Start">\n            <Label Text="\xc2\xb7 Exclude Hidden" />\n        </Grid>\n\n        <Grid Grid.Row="0" Grid.Column="1" HorizontalOptions="Start">\n            <Label Text="All cards except those tagged as hidden" />\n        </Grid>\n\n        <Grid Grid.Row="1" Grid.Column="0" HorizontalOptions="Start">\n            <Label Text="\xc2\xb7 Include Hidden" />\n        </Grid>\n\n        <Grid Grid.Row="1" Grid.Column="1" HorizontalOptions="Start">\n            <Label Text="All cards with those tagged as hidden" />\n        </Grid>\n\n        <Grid Grid.Row="2" Grid.Column="0" HorizontalOptions="Start">\n            <Label Text="\xc2\xb7 Favorites" />\n        </Grid>\n\n        <Grid Grid.Row="2" Grid.Column="1" HorizontalOptions="Start">\n            <Label Text="Only cards tagged as favorites" />\n        </Grid>\n\n        <Grid Grid.Row="3" Grid.Column="0" HorizontalOptions="Start">\n            <Label Text="\xc2\xb7 Hidden" />\n        </Grid>\n\n        <Grid Grid.Row="3" Grid.Column="1" HorizontalOptions="Start">\n            <Label Text="Only those cards tagged as hidden" />\n        </Grid>\n</Grid>\n

\n\n

...另外我不确定你为什么使用那些内在Grids来保持你的Labels，这不是我认为的最佳实践，但这只是我的意见。

\n\n

我的代码的最终结果是这样的：

\n\n

\n\n

希望这对您有帮助！

\n\n

快速说明：第一列将具有最长行项目的宽度。

\n