Xamarin.Forms - 別の要素の上に位置する要素。

Question

私はこのような何か見てする必要があり、私のXamarin.Formsプロジェクトでページを持っている：私は、何の問題を赤と青のボックスを配置することはできません

を。しかし、私は緑色のものを作る方法を理解できません。

私が使用するXAMLは次のとおりです。

<StackLayout HorizontalOptions="FillAndExpand"> 
    <StackLayout VerticalOptions="FillAndExpand" BackgroundColor="Red"> 
     //I'm thinking the green box should be positioned absolutely in here or something?   
    </StackLayout> 
    <StackLayout VerticalOptions="End" BackgroundColor="Blue"> 
     <Grid VerticalOptions="EndAndExpand"> 
      <Grid.ColumnDefinitions> 
       <ColumnDefinition Width="1*"></ColumnDefinition> 
      </Grid.ColumnDefinitions> 
      <Button Grid.Column="0" Text="Button" HorizontalOptions="FillAndExpand" BorderRadius="0" VerticalOptions="EndAndExpand" HeightRequest="50" TextColor="White" BackgroundColor="#85C034"></Button> 
     </Grid> 
    </StackLayout> 
</StackLayout> 

Answer 1

Gridはこの動作を実装するための最良のレイアウトコントロールです。 *を使用して行を展開して塗りつぶし、最初の行のコンテンツビュー内にテキストラベルをネストし、次に2番目の行を目的の高さに設定することができます。

EG：

<?xml version="1.0" encoding="utf-8"?> 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" 
    xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" 
    xmlns:local="clr-namespace:Grids" 
    x:Class="Grids.GridsPage"> 
    <Grid> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="*"/> 
      <RowDefinition Height="60"/> 
     </Grid.RowDefinitions> 
     <ContentView 
      BackgroundColor="Red" Grid.Row="0"> 
      <Label TextColor="Black" 
       Text="Text" 
       Margin="0,0,0,10" 
       BackgroundColor="#00FF02" 
       VerticalOptions="End" 
       HorizontalOptions="Center"/> 
     </ContentView> 
     <ContentView BackgroundColor="Blue" Grid.Row="1"/> 
    </Grid> 
</ContentPage>