垂直对齐BoxView中的网格单元格

Question

用下面的布局和风格，在BoxView中的不垂直居中，使得它与标签一致。如何实现这一目标？

<Grid Grid.Column="1">
    <Grid.ColumnDefinitions>
        <ColumnDefinition Width="10" />
        <ColumnDefinition Width="*" />
    </Grid.ColumnDefinitions>
    <BoxView Grid.Column="0" BackgroundColor="Red"></BoxView>
    <Label Grid.Column="1" x:Name="lbl1"/>
</Grid>

<Style TargetType="BoxView">
    <Setter Property="WidthRequest" Value="10" />
    <Setter Property="HeightRequest" Value="10" />
    <Setter Property="VerticalOptions" Value="Center" />
    <Setter Property="HorizontalOptions" Value="Center" />
</Style>
<Style TargetType="Label">
    <Setter Property="FontSize" Value="12" />
    <Setter Property="YAlign" Value="Center" />
</Style>

设置VerticalOptions到Start或End分别具有对顶部或底部的框平齐。因此，它似乎并没有被正确地执行中央对齐。

Answer 1

使用CenterAndExpand代替

<Style TargetType="BoxView">
    <Setter Property="WidthRequest" Value="10" />
    <Setter Property="HeightRequest" Value="10" />
    <Setter Property="VerticalOptions" Value="CenterAndExpand" />
    <Setter Property="HorizontalOptions" Value="Center" />
</Style>

更新：Here's差异的一个很好的解释。

希望这可以帮助。-

Answer 2

1）尝试添加一个明确的RowDefinition和它的高度;

2）尝试调整标签的字号的大小BoxView中;

还是一个肮脏的黑客：你可以添加上边距的BoxView中。

Answer 3

你需要在标签也用这个：

<Setter Property="VerticalOptions" Value="Center" />

您的代码只是对准标签内的文本位置，标签本身没有位置。

Answer 4

战斗时文字不垂直对齐：

1. 请尝试以下操作：对于标签集

VerticalOptions="Fill"

VerticalTextAlignment="Center"

2. 考虑这样一种情况，当你的元素垂直对齐，但似乎并非如此，因为字体的创造者设置，字体增加更多的空间，底部或顶部断裂对齐。这可以解决的自定义渲染系统或一个愚蠢的 TranslationY="1"

或"-0.5"什么..