时间戳

首页 > 解决方案 > Xamarin Forms 覆盖图像作为背景并在不同方向放置标签

image - Xamarin Forms 覆盖图像作为背景并在不同方向放置标签

问题描述

我想做如下图所示的事情。我尝试了绝对布局，但一旦进入景观，它就会改变一切。一切都再次到位。

最终结果将如下图所示（精神-票证部分）

在此处输入图像描述

到目前为止我所拥有的

在此处输入图像描述

    <StackLayout BackgroundColor="#F0F0F0">

        <Grid Margin="10" RowSpacing="0">
            <Grid.RowDefinitions>
                <RowDefinition Height="Auto"></RowDefinition>
                 <RowDefinition Height="Auto"></RowDefinition>
            </Grid.RowDefinitions>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="40" />
                <ColumnDefinition Width="*" />
            </Grid.ColumnDefinitions>

             <Label Grid.Row="0" Grid.ColumnSpan="2" Text="Please review your reservation below" LineBreakMode="WordWrap"/>
            <StackLayout  Grid.Row="1"  Grid.ColumnSpan="2" >

                <AbsoluteLayout>
                    <Image>
                        <AbsoluteLayout.LayoutBounds>
                            <OnPlatform x:TypeArguments="Rectangle">
                                <On Platform="Android" Value=".5,.5,1.0,1.8" />
                                <On Platform="iOS" Value=".5,.10,1.8,1" />
                            </OnPlatform>
                        </AbsoluteLayout.LayoutBounds>
                        <AbsoluteLayout.LayoutFlags>
                            <OnPlatform x:TypeArguments="AbsoluteLayoutFlags">
                                <On Platform="Android" Value="All" />
                                <On Platform="iOS" Value="All" />
                            </OnPlatform>
                        </AbsoluteLayout.LayoutFlags>
                        <Image.Source>
                            <OnPlatform x:TypeArguments="ImageSource">
                                <On Platform="Android" Value="ticketone.png" />
                                <On Platform="iOS" Value="ticket.png" />
                            </OnPlatform>
                        </Image.Source>
                    </Image>
                  <Label  AbsoluteLayout.LayoutBounds="0.1,99,.56,50" AbsoluteLayout.LayoutFlags="XProportional,WidthProportional" Text="ROOMSHFBHE GFDJHBCSJSJJ HJSDHSJ no snonnoj" TextColor="White"  FontSize="20" FontAttributes="Bold"  LineBreakMode="WordWrap" />
              </AbsoluteLayout>

我在风景中得到了什么

在此处输入图像描述

标签： imagexamarin.formslabellandscape-portraitabsolutelayout

解决方案

无论方向如何，这都会创建居中的顶部标签

<Grid>
  <Grid.RowDefinitions>
    <RowDefinition Height="100" />
    <RowDefinition Height="*" />
  </Grid.RowDefinitions>
  <Label Grid.Row="0" Grid.Column="0" VerticalTextAlignment="Center" 
    HorizontalOptions="FillAndExpand" BackgroundColor="Black"
    TextColor="White" HorizontalTextAlignment="Center" Text="center" />
</Grid>

推荐阅读