首页 > 解决方案 > 多个控件的 Xamarin.Forms 动画并行

问题描述

对于我的 Xamarin.Forms 项目,我需要为两个 Xamarin Frame 项目并行设置动画,但我只是不明白它们使用的示例:

async void OnAnimateLabelButtonClicked(object sender, EventArgs e)
{
...
    await Task.WhenAll(
        label.ColorTo(Color.Red, Color.Blue, c => label.TextColor = c, 5000),
        label.ColorTo(Color.Blue, Color.Red, c => label.BackgroundColor = c, 5000));
...
}

Task.WhenAll这 - 在我的拙见中 - 不能保证它在 GUI 主线程上运行,因为没有Device.BeginInvokeOnMainThread()看到。

根据这个forums.xamarin.com条目,一次使用多个动画的首选方法是:

Animation a = new Animation();
a.Add(0, 1, new Animation(f => this.GuidanceLabel.Opacity = f, 1, 0, Easing.SinInOut, null));
a.Add(0, 1, new Animation(f => this.EnableAccess.Opacity = f, 1, 0, Easing.SinOut, null));
a.Commit(
    owner:this.GuidanceLabel,
    name:"DoubleFader",
    length:400,
    finished:(x, y) => 
    {
        this.SetPhotoAccessDeniedState();
        this.GuidanceLabel.FadeTo(1, 400, Easing.CubicIn);
    });

所以,我想,我必须将我的动画包装在 aDevice.BeginInvokeOnMainThread()中以使其正常工作,对于我的特殊动画案例,工作流程将是:

Frame1.TranslateYto (-90, duration1);
Frame1.Content.IsVisible = true; // Was formerly false
Frame1.TranslateYto (0, duration2);

并且对于Frame2并行相同。

所以我试过:

Device.BeginInvokeOnMainThread(() =>
{
    Animation a = new Animation();
    a.Add(0, 1, new Animation(v => frame1.RotationY = v, 0, -90));
    a.Add(0, 1, new Animation(v => frame2.RotationY = v, 0, -90));
    a.Commit(
        owner: frame1,
        name: "flip1",
        length: 50,
        finished: (x, y) =>
        {
                frame1.Content.IsVisible = false;
                frame2.Content.IsVisible = false;
        });

    a = new Animation();
    a.Add(0, 1, new Animation(v => frame1.RotationY = v, -90, 0));
    a.Add(0, 1, new Animation(v => frame2.RotationY = v, -90, 0));
    a.Commit(
        owner: frame1,
        name: "flip2",
        length: 250);
});

但它与NullReferenceExecption崩溃......

也许有人可以更清楚地说明这个问题?

标签: c#xamarinanimationxamarin.forms

解决方案


我在窗口中添加了两个 Frame 控件并创建了与您相同的动画,但我没有任何问题。这是我的代码。

 <StackLayout>
        <Frame
            x:Name="frame1"
            HorizontalOptions="CenterAndExpand"
            VerticalOptions="FillAndExpand">
            <Label
                HorizontalOptions="CenterAndExpand"
                Text="this is test!!!!!!!"
                VerticalOptions="CenterAndExpand" />
        </Frame>

        <Frame x:Name="frame2" HorizontalOptions="CenterAndExpand" VerticalOptions="EndAndExpand">
            <Label
                HorizontalOptions="CenterAndExpand"
                Text="this is test22222222222222!!!!!!!"
                VerticalOptions="CenterAndExpand" />
        </Frame>

        <Button
            x:Name="btn1"
            Clicked="btn1_Clicked"
            HeightRequest="50"
            Text="btn1"
            WidthRequest="300" />
    </StackLayout>

 private void btn1_Clicked(object sender, EventArgs e)
    {
        Device.BeginInvokeOnMainThread(() => {
            Animation a = new Animation();
            a.Add(0, 1, new Animation(v => frame1.RotationY = v, 0, -90));
            a.Add(0, 1, new Animation(v => frame2.RotationY = v, 0, -90));
            a.Commit(
                    owner: frame1,
                    name: "flip1",
                    length: 50,
                    finished: (x, y) =>
                    {
                        frame1.Content.IsVisible = false;
                        frame2.Content.IsVisible = false;
                    });

            a = new Animation();
            a.Add(0, 1, new Animation(v => frame1.RotationY = v, -90, 0));
            a.Add(0, 1, new Animation(v => frame2.RotationY = v, -90, 0));
            a.Commit(
                    owner: frame1,
                    name: "flip2",
                    length: 250);

        });
    }

在此处输入图像描述


推荐阅读