首页 > 解决方案 > 如何使用 4 个标签在 xamarin 中以 2 行和 2 列居中网格

问题描述

我有一个两列两行的网格。我在网格的开头和结尾有堆栈布局,并且在布局中我有 4 个带有 Grid.Row[0] Grid.Column[0]... 1等的标签。

编码:

                <Frame CornerRadius="30"
                       BackgroundColor="Transparent"
                       Margin="20,0,20,10"
                       HeightRequest="100"
                       BorderColor="Red">
                  <StackLayout HorizontalOptions="FillAndExpand"
                                 VerticalOptions="FillAndExpand">
                       <Grid BackgroundColor="Transparent"
                              Padding="0,0,0,0">
                                <Grid.RowDefinitions>
                                    <RowDefinition Height="*" />
                                    <RowDefinition Height="*" />
                                </Grid.RowDefinitions>
                                <Grid.ColumnDefinitions>
                                    <ColumnDefinition Width="*" />
                                    <ColumnDefinition Width="*" />
                                </Grid.ColumnDefinitions>
                                    <Label Text="Temp Now"
                                           VerticalOptions="Center"
                                           TextColor="White"
                                           VerticalTextAlignment="Center"
                                           FontAttributes="Bold" 
                                           FontSize="15"
                                           Grid.Row="0"
                                           Grid.Column="0"/>

                                    <Label x:Name="TempNowLbl"
                                           VerticalOptions="Center"
                                           TextColor="White"
                                           VerticalTextAlignment="Center"
                                           FontAttributes="Bold" 
                                           FontSize="25"
                                           Grid.Row="1"
                                           Grid.Column="0"/>
                                           
                                    <Label Text="Wind Speed"
                                           VerticalOptions="Center"
                                           TextColor="White"
                                           VerticalTextAlignment="Center"
                                           FontAttributes="Bold" 
                                           FontSize="15"
                                           Grid.Row="0"
                                           Grid.Column="1"/>

                                    <Label x:Name="WindSpeedNowLbl"
                                           VerticalOptions="Center"
                                           TextColor="White"
                                           VerticalTextAlignment="Center"
                                           FontAttributes="Bold" 
                                           FontSize="25"
                                           Grid.Row="1"
                                           Grid.Column="1"/>
                       </Grid>
                </StackLayout>
             </Frame>

结果是:

这里

如何使这个标签居中?

标签: c#iosvisual-studioxamarin

解决方案


HorizontalTextAlignment="Center"上使用Label

<Frame CornerRadius="30"
       BackgroundColor="Transparent"
       Margin="20,0,20,10"
       HeightRequest="100"
       BorderColor="Red">
       <Grid BackgroundColor="Transparent"
              Padding="0,0,0,0">
                <Grid.RowDefinitions>
                    <RowDefinition Height="*" />
                    <RowDefinition Height="*" />
                </Grid.RowDefinitions>
                <Grid.ColumnDefinitions>
                    <ColumnDefinition Width="*" />
                    <ColumnDefinition Width="*" />
                </Grid.ColumnDefinitions>
                    <Label Text="Temp Now"
                           VerticalOptions="Center"
                           TextColor="White"
                           VerticalTextAlignment="Center"
                           HorizontalTextAlignment="Center"
                           FontAttributes="Bold" 
                           FontSize="15"
                           Grid.Row="0"
                           Grid.Column="0"/>

                    <Label x:Name="TempNowLbl"
                           VerticalOptions="Center"
                           TextColor="White"
                           VerticalTextAlignment="Center"
                           HorizontalTextAlignment="Center"
                           FontAttributes="Bold" 
                           FontSize="25"
                           Grid.Row="1"
                           Grid.Column="0"/>
                           
                    <Label Text="Wind Speed"
                           VerticalOptions="Center"
                           TextColor="White"
                           VerticalTextAlignment="Center"
                           HorizontalTextAlignment="Center"
                           FontAttributes="Bold" 
                           FontSize="15"
                           Grid.Row="0"
                           Grid.Column="1"/>

                    <Label x:Name="WindSpeedNowLbl"
                           VerticalOptions="Center"
                           TextColor="White"
                           VerticalTextAlignment="Center"
                           HorizontalTextAlignment="Center"
                           FontAttributes="Bold" 
                           FontSize="25"
                           Grid.Row="1"
                           Grid.Column="1"/>
       </Grid>
</Frame>

推荐阅读