Question

我正在学习Xamarin，我希望在此图像上显示一个带有一些文本背景的图像...

就是这样，我设法完成了，但文字显示在图片的左上角。

我希望将文字放在图像的垂直中心，但要贴在图像的左侧。

我的代码到目前为止XAML：

<Grid RowSpacing="0">
        <Grid.RowDefinitions>
            <RowDefinition Height="20*" ></RowDefinition>
            <RowDefinition Height="65*"></RowDefinition>
            <RowDefinition Height="15*"></RowDefinition>
        </Grid.RowDefinitions>

        <RelativeLayout Grid.Row="0">
            <Image Source="login.png" Aspect="Fill" />
            <Label Text="Bem vindo" TextColor="White" FontSize="22"></Label>
        </RelativeLayout>

        <Label Grid.Row="1" Text="linha 2" BackgroundColor="Coral"></Label>
        <Button Grid.Row="2" Text="linha 3" BackgroundColor="DarkRed"></Button>
    </Grid>

我已尝试过verticalOptions等，但没有效果。

有一点是有用的，就是在标签上设置Maring属性，但是这样，标签只会集中在我正在测试的设备上。其他更小或更大的设备，标签可能（并且可能会）放置在错误的位置。

任何帮助？

Answer 1

你不需要Grid中的RelativeLayout。除了让代码更清晰之外，Grid本身已经能够处理视图叠加。

它可能有效：

<Grid RowSpacing="0">
    <Grid.RowDefinitions>
        <RowDefinition Height="20*"></RowDefinition>
        <RowDefinition Height="65*"></RowDefinition>
        <RowDefinition Height="15*"></RowDefinition>
    </Grid.RowDefinitions>

    <Image Grid.Row="0" Grid.Column="0"
           Source="login.png"
           HorizontalOptions="FillAndExpand"
           VerticalOptions="FillAndExpand" 
           Aspect="Fill" />
    <Label Grid.Row="0" Grid.Column="0"
           Text="Bem vindo" 
           HorizontalOptions="FillAndExpand"
           VerticalOptions="FillAndExpand"
           HorizontalTextAlignment="Start"
           VerticalTextAlignment="Center"
           TextColor="White" 
           FontSize="22"/>

    <Label Grid.Row="1" 
           Text="linha 2" 
           BackgroundColor="Coral"/>
    <Button Grid.Row="2" 
            Text="linha 3" 
            BackgroundColor="DarkRed"/>
</Grid>

Xamarin在图像上形成垂直中心文本

1 个答案: