StackLayout内で要素をアニメートすることはできますか？ここで

Question

、私はのように私のレイアウトとそれが見えるの大まかな仕組みを提供します。私は、以下の機能を追加したい

：最初に、私はパスワードのラベルとエントリが見えないようにしたいとsubmitボタンはその場所にあります。ユーザーが有効なユーザー名を入力すると、送信ボタンが下に移動し、パスワードのラベル/エントリが表示されます（ユーザー名が無効な場合はこのアニメーションを逆にします）。パスワードラベル/エントリに白いボックスを置き、不透明度を0から1に変更し、パスワードラベル/エントリの高さでsubmitボタンをスライドさせる必要があるということです。スライドすると、パスワードラベル/エントリが送信ボタンの上に重なって表示される可能性があるため、送信ボタンはパスワードラベル/エントリ上にある必要があります。

私の質問は次のとおりです：（1）私が今使っているスキームを使ってStackLayoutを使うことは可能でしょうか？もしそうでなければ、（2）どうしたらいいですか？前もって感謝します。

Answer 1

はい可能です。

まず、ボタンをページの周りに移動するには、絶対に余裕を持ってください。だからすべてを包むAbsoluteLayout

パスワードの入力には、最初にScale="0"を設定します。ユーザーが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="ThesisSFA.Pages.Page1"> 
    <AbsoluteLayout HorizontalOptions="FillAndExpand" VerticalOptions="FillAndExpand"> 
    <StackLayout Orientation="Horizontal" AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="0.5,0.5,-1,-1"> 
     <Label Text="User:"></Label> 
     <Editor x:Name="EditorUser" Text="" WidthRequest="100"></Editor> 
    </StackLayout> 
    <StackLayout x:Name="StackPass" Orientation="Horizontal" Scale="0" AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="0.5,0.6,-1,-1"> 
     <Label Text="Pass:"></Label> 
     <Editor Text="" WidthRequest="100"></Editor> 
    </StackLayout> 
    <Button x:Name="ButtonSubmit" Text="Submit" AbsoluteLayout.LayoutFlags="PositionProportional" AbsoluteLayout.LayoutBounds="0.5,0.6,-1,-1"></Button> 
    </AbsoluteLayout> 
</ContentPage> 

そして

public partial class Page1 : ContentPage 
    { 
     public Page1() 
     { 
      InitializeComponent(); 

      EditorUser.Completed += async (sender, args) => 
      {      
       var rect = new Rectangle(ButtonSubmit.X, ButtonSubmit.Y + 50, ButtonSubmit.Width, ButtonSubmit.Height); 
       await ButtonSubmit.LayoutTo(rect, 400, Easing.CubicIn); 
       await StackPass.ScaleTo(1, 400, Easing.SinIn); 
      }; 
     } 
    } 

背後にあるコードをここで有効な

を取得しているので、ときに