Xamarin.Forms XAML 如何在网格中心显示列（不是左绑定）答案

【问题标题】：Xamarin.Forms XAML How to show columns in center of grid (not left bind)Xamarin.Forms XAML 如何在网格中心显示列（不是左绑定）
【发布时间】：2020-09-18 18:49:52
【问题描述】：

我有这个网格对象：

            <!--Legende-->
            <Grid Grid.Row="0">

                <Grid >
                
                     <Grid.ColumnDefinitions>
                         <ColumnDefinition Width="auto"/>
                         <ColumnDefinition Width="auto"/>
                         <ColumnDefinition Width="auto"/>
                    </Grid.ColumnDefinitions>

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


                     <Grid Grid.Column="0" Grid.Row="1" HorizontalOptions="Center">

                         <BoxView BackgroundColor="#faea57" CornerRadius="25"></BoxView>
                    
                         <Label
                             Padding="10,0,10,0"
                             VerticalOptions="Center"
                             Grid.Column="0"
                             Text="Geplant"
                             FontSize="14"
                             FontFamily="Galvji-01.ttf"
                             TextColor="#ffffff"/>

                    </Grid>

                     <Grid Grid.Column="1" Grid.Row="1" HorizontalOptions="Center">

                    <BoxView BackgroundColor="#75f056" CornerRadius="25"></BoxView>
                    
                    <Label
                        Padding="10,0,10,0"
                        VerticalOptions="Center"
                        Text="Aktiv"
                        FontSize="14"
                        FontFamily="Galvji-01.ttf"
                        TextColor="#ffffff"/>

                </Grid>

                     <Grid Grid.Column="2" Grid.Row="1" HorizontalOptions="Center">

                    <BoxView BackgroundColor="#fa594d" CornerRadius="25"></BoxView>
                    
                    <Label         
                        Padding="10,0,10,0"
                        VerticalOptions="Center"
                        Text="Abgeschlossen"
                        FontSize="14"
                        FontFamily="Galvji-01.ttf"
                        TextColor="#ffffff"/>

                </Grid>

                </Grid>

结果是这样的：

带有文本的 3 个框视图绑定到屏幕左侧。但是，我希望在 CENTRE 中呈现这三个对象。

我无法使用填充，因为填充量因手机而异，所以我必须使用“中心”等属性，但我似乎无法弄清楚如何做到这一点。

帮助会很棒！

谢谢

【问题讨论】：

父网格需要有HorizontalOptions=Center

标签： xaml xamarin.forms

【解决方案1】：

你可以设置两个额外的空格列来获得像填充一样的效果。

<Grid.ColumnDefinitions>
                         <ColumnDefinition Width="0.2*"/>  // left
                         <ColumnDefinition Width="auto"/>
                         <ColumnDefinition Width="auto"/>
                         <ColumnDefinition Width="auto"/>
                         <ColumnDefinition Width="0.2*"/>  // right
                    </Grid.ColumnDefinitions>

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


                     <Grid Grid.Column="1" Grid.Row="1" HorizontalOptions="Center">

                         <BoxView BackgroundColor="#faea57" CornerRadius="25"></BoxView>
                    
                         <Label
                             Padding="10,0,10,0"
                             VerticalOptions="Center"
                             Grid.Column="0"
                             Text="Geplant"
                             FontSize="14"
                             FontFamily="Galvji-01.ttf"
                             TextColor="#ffffff"/>

                    </Grid>

                     <Grid Grid.Column="2" Grid.Row="1" HorizontalOptions="Center">

                    <BoxView BackgroundColor="#75f056" CornerRadius="25"></BoxView>
                    
                    <Label
                        Padding="10,0,10,0"
                        VerticalOptions="Center"
                        Text="Aktiv"
                        FontSize="14"
                        FontFamily="Galvji-01.ttf"
                        TextColor="#ffffff"/>

                </Grid>

                     <Grid Grid.Column="3" Grid.Row="1" HorizontalOptions="Center">

                    <BoxView BackgroundColor="#fa594d" CornerRadius="25"></BoxView>
                    
                    <Label         
                        Padding="10,0,10,0"
                        VerticalOptions="Center"
                        Text="Abgeschlossen"
                        FontSize="14"
                        FontFamily="Galvji-01.ttf"
                        TextColor="#ffffff"/>

                </Grid>

                </Grid>

【讨论】：