Xamarin.Forms - Wie zentriere ich ein Element absolut auf der Seite?

Question

Ich habe eine Login-Seite mit einem StackLayout für den Inhalt (Benutzername, Passwort, Login-Button). Nachdem der Benutzer auf die Anmeldeschaltfläche geklickt hat, möchte ich einen "Lade" -Block in der absoluten Mitte der Seite oberhalb des vorhandenen StackLayout-Inhalts festlegen. Aus irgendeinem ärgerlichen Grund ist das nicht einfach. Es scheint eine einfache, gemeinsame Sache zu sein - wie wird das gemacht?

Answer 1

Sie haben ein richtiges Tag verwendet: 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 
     } 
    } 
}; 

oder 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> 

Ergebnis: