首页 文章

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

提问于
浏览
1

我正在学习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属性,但是这样,标签只会集中在我正在测试的设备上 . 其他更小或更大的设备,标签可能(并且可能会)放置在错误的位置 .

有帮助吗?

1 回答

  • 7

    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>
    

相关问题