Xamarin.Forms 应用程序中的标签未在 WinPhone 上正确对齐文本

Question

在一个小测试应用程序中，我有以下 ContentPage：

public class LoginPage:ContentPage
{
    public LoginPage()
    {
        Label l = Device.OnPlatform<Label>(
        new Label
        {
            HeightRequest = 150,
            XAlign = TextAlignment.Center,
            YAlign = TextAlignment.Center,
        },
        new Label
        {
            HeightRequest = 120,
            XAlign = TextAlignment.Center,
            YAlign = TextAlignment.Center,
        },
        new Label
        {
            HeightRequest = 500,
            XAlign = TextAlignment.Center,
            YAlign = TextAlignment.End,
        });
        l.Text = "App Login";
        l.FontSize = 30;

        StackLayout sl = new StackLayout()
        {
            BackgroundColor = Color.FromHex("559db7ec"),
            HorizontalOptions = LayoutOptions.Fill,
            VerticalOptions = LayoutOptions.Fill,
            Children = 
            {
                new StackLayout
                {
                    HorizontalOptions = LayoutOptions.Center,
                    VerticalOptions = LayoutOptions.Center,
                    Children = 
                    {
                        l,
                        //new Label{ Text = "MaintMobile", FontSize = 30, HeightRequest = 120, XAlign = TextAlignment.Center, YAlign = TextAlignment.Center },
                        new Label{ Text = "Please login", FontSize = 15, HeightRequest = 90, XAlign = TextAlignment.Center, YAlign = TextAlignment.Center },
                        new Entry{ Placeholder = "Username", WidthRequest = 300 },
                        new Entry{ Placeholder = "Password", IsPassword =  true  },
                        new Button{ Text = "Login" }
                    }
                }
            }
        };

        Content = sl;
    }
}

这是应用程序的主页面。虽然这在 Android 上运行良好，但 YAlign 似乎无法在 WinPhone 上运行。无论我将其设置为对齐到什么，标签的文本始终粘在设备的顶部。
这可能是一个错误，还是我做错了什么？
这是在 Lumia 630 和 930

上测试的

Answer 1

如果它能在一个平台上运行而不能在另一个平台上运行，我会说它是一个错误。

您可能发现在 Windows 的布局设置中没有考虑标签高度，因此看起来总是在顶部，但真正发生的是标签高度不是如你所愿。

我建议将 VerticalOptions 设置为开始或居中，而不是文本对齐。标签将根据需要展开。

作为查看布局的另一种方式，我通常推荐这种方法来布置居中的内容，例如登录页面。对于 Xamarin Forms，就 UI 而言，网格的计算速度最快。

<?xml version="1.0" encoding="utf-8" ?>
<local:BasePage xmlns="http://xamarin.com/schemas/2014/forms"
          xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
          xmlns:local="clr-namespace:Mobile.View"
          x:Class="Mobile.View.LoginPage">
  <Grid>
    <Image Style="{StaticResource BackgroundImageStyle}" />
    <ContentView Style="{StaticResource OverlayStyle}" />
    <Grid>
      <Grid.RowDefinitions>
        <RowDefinition Height="*" />
        <RowDefinition Height="350" />
        <RowDefinition Height="*" />
      </Grid.RowDefinitions>
      <Image Source="Logo.png" Grid.Row="0" VerticalOptions="End" HorizontalOptions="Center" />
      <StackLayout Grid.Row="1" VerticalOptions="CenterAndExpand">
        <Entry StyleId="EmailEntry" Text="{Binding Model.Email}" Placeholder="Email (is demo)" />
        <Entry StyleId="PasswordEntry" Text="{Binding Model.Password}" IsPassword="True" Placeholder="Password (is demo)" />
        <Button Command="{Binding LoginCommand}" StyleId="LoginButton" Text="Login" IsEnabled="{Binding IsBusy, Converter={StaticResource NotConverter}}" />
      </StackLayout>
    </Grid>
  </Grid>
</local:BasePage>

抱歉，它在 XAML 中，我使用 XAML 来查看视图，但你可以看到我使用了一个网格，有 3 行，顶部和底部的是 *，而中间有定义的高度。

我通常建议将 StackLayouts 或 RelativeLayouts 居中的布局类型作为棘手的布局。渲染它们的计算也会导致错误和较差的 UI 性能。

Xamarin.Forms 应用程序中的标签未在 WinPhone 上正确对齐文本

Label in Xamarin.Forms application does not align the text correctly on WinPhone

android

windows-phone-8

xamarin.forms