Xamarin.Forms - ページ上に要素を絶対に配置する方法は？

Question

私は、コンテンツ（ユーザ名、パスワード、ログインボタン）にStackLayoutを使ってログインページを持っています。ユーザーがログインボタンをクリックすると、既存のStackLayoutコンテンツの上に、ページの絶対的な中央に「ローディング」ブロックが設定されます。いくつかの厄介な理由のために、これは簡単ではありません。シンプルで共通しているように思えますが、これはどのように行われますか？

Answer 1

右のタグ：AbsoluteLayoutを使用しました。

var loadingView = new StackLayout 
{ 
    Padding = 6, 
    Orientation = StackOrientation.Horizontal, 
    BackgroundColor = Color.Gray, 
    Children = 
    { 
     new ActivityIndicator 
     { 
      Color = Color.White, 
      IsRunning = true, 
      VerticalOptions = LayoutOptions.Center, 
      WidthRequest = 20, 
      HeightRequest = 20 
     }, 
     new Label 
     { 
      TextColor = Color.White, 
      Text = "Loading...", 
      VerticalOptions = LayoutOptions.Center 
     } 
    } 
}; 

var layout = new AbsoluteLayout 
{ 
    Padding = 0, 
    HorizontalOptions = LayoutOptions.FillAndExpand, 
    VerticalOptions = LayoutOptions.FillAndExpand, 
    Children = 
    { 
     { 
      new BoxView {Color = Color.Green}, 
      new Rectangle(0, 0, 1, 1), 
      AbsoluteLayoutFlags.All 
     }, 
     { 
      loadingView, 
      new Rectangle(0.5, 0.5, -1, -1), 
      AbsoluteLayoutFlags.PositionProportional 
     } 
    } 
}; 

またはXAML：

<?xml version="1.0" encoding="UTF-8"?> 
<ContentPage xmlns="http://xamarin.com/schemas/2014/forms" xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml" x:Class="ArtiSO.LoadingPage"> 
    <ContentPage.Content> 
     <AbsoluteLayout Padding="0" HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"> 
      <BoxView Color="Lime" AbsoluteLayout.LayoutBounds="0, 0, 1, 1" AbsoluteLayout.LayoutFlags="All" /> 
      <StackLayout Padding="6" Orientation="Horizontal" BackgroundColor="Gray" AbsoluteLayout.LayoutBounds="0.5, 0.5, -1, -1" AbsoluteLayout.LayoutFlags="PositionProportional"> 
       <ActivityIndicator Color="White" IsRunning="true" VerticalOptions="Center" WidthRequest="20" HeightRequest="20" /> 
       <Label TextColor="White" Text="Loading..." VerticalOptions="Center" /> 
      </StackLayout> 
     </AbsoluteLayout> 
    </ContentPage.Content> 
</ContentPage> 

結果：