从底部到顶部Xamarin表单对视图进行动画处理

Question

我正在处理的视图需要在按下按钮时从下到上进行动画处理。

我尝试使用TranslateTo函数，但没有成功。

这是我需要实现的视图。

有什么建议吗？

    <StackLayout AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All">
        <!-- Place new controls here -->

        <Button Text="Scan" Clicked="Button_OnClicked"/>
    </StackLayout>

        <StackLayout x:Name="ScanView" AbsoluteLayout.LayoutBounds="1,1,1,0.3" AbsoluteLayout.LayoutFlags="All"
                     IsVisible="False" BackgroundColor="Blue">
            <Label Text="Animate" HeightRequest="100"></Label>
        </StackLayout>
    </AbsoluteLayout>``` 

ScanView.IsVisible = true;
            ScanView.Rotation = 0;
            await Task.WhenAll(
            ScanView.TranslateTo(0, 0, 2000, Easing.SinInOut));

Answer 1

上面的代码有两个问题：

1. IsVisible设置为False。将其设置为True。
2. 单击按钮，将平移偏移设置为0。检查MSDocs的语法。如果要转换为零，请将ScanView的TranslateY设置为最初为其高度的值。

固定代码：

XAML

<AbsoluteLayout>
    <StackLayout AbsoluteLayout.LayoutBounds="0,0,1,1" AbsoluteLayout.LayoutFlags="All">
    <!-- Place new controls here -->

        <Button Text="Scan" Clicked="Button_OnClicked"/>
    </StackLayout>

    <StackLayout x:Name="ScanView"
                 AbsoluteLayout.LayoutBounds="0,1,1,0.3"
                 AbsoluteLayout.LayoutFlags="All"
                 TranslationY="{Binding Height, Source={x:Reference ScanView}}"
                 IsVisible="True" BackgroundColor="Blue">
        <Label Text="Animate" HeightRequest="100"></Label>
    </StackLayout>
</AbsoluteLayout>

CS

private void Button_OnClicked(object sender, EventArgs args)
    {
        ScanView.TranslateTo(0, 0, 200);
    }

希望这会有所帮助。