Xamarin.Forms：如何将多标签在一行中居中？答案

【问题标题】：Xamarin.Forms: how to center a multine label in a Row?Xamarin.Forms：如何将多标签在一行中居中？
【发布时间】：2018-02-10 14:23:54
【问题描述】：

我尝试将包含可显示在 1 或 2 行上的文本的 multiline Label 垂直居中。

目前，我无法获得预期的渲染效果...

我可以让多行标签自动扩展，但它是顶部对齐而不是居中：

这是附加的 XAML：

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

<local:MultiLineLabel
    Grid.Row="0"
    Grid.Column="1"
    BackgroundColor="Orange"
    Text="{ Binding encart_titre }"         
    VerticalTextAlignment="Center"
    LineBreakMode="TailTruncation"
    Lines="2"
    ...
/>

我也可以将标签居中，但在这种情况下它不会自动扩展：

这是附加的 XAML：

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

<local:MultiLineLabel
    Grid.Row="0"
    Grid.Column="1"
    BackgroundColor="Orange"
    Text="{ Binding encart_titre }"         
    VerticalTextAlignment="Center"
    LineBreakMode="TailTruncation"
    Lines="2"
    VerticalOptions="FillAndExpand"
    ...
/>

你有什么解释吗？我还尝试在标签周围添加 StackLayound，但这并没有改变任何东西......

【问题讨论】：

标签： xaml xamarin xamarin.forms grid label

【解决方案1】：

使控件居中的第一选择是使用VerticalOptions="CenterAndExpand"，您是否尝试过用VerticalOptions="FillAndExpand" 代替？ Here's more information 关于 Xamarin.Forms 中的 LayoutOptions。

所以，这是垂直居中的正确方法：

<local:MultiLineLabel
    Grid.Row="0"
    Grid.Column="1"
    BackgroundColor="Orange"
    Text="{ Binding encart_titre }"         
    VerticalTextAlignment="Center"
    LineBreakMode="TailTruncation"
    Lines="2"
    VerticalOptions="CenterAndExpand" <!-- This one here -->
    ...
/>

【讨论】：

谢谢它与VerticalOptions="CenterAndExpand"一起使用
只是一个小规范：标签必须嵌入在StackLayout 中，VerticalOptions="CenterAndExpand" 和HorizontalOptions="CenterAndExpand"。