Skip to content

Chained animations lose state on iOS #801

@tjvantoll

Description

@tjvantoll

The code below chains two animations—one that rotates an image 90 degrees, and a second that scales it to twice its size.

<Page loaded="loaded">
    <AbsoluteLayout>
        <Image src="~/logo.png" id="logo" />
    </AbsoluteLayout>
</Page>
exports.loaded = function(args) {
    var page = args.object;
    var message = page.getViewById("logo");
    message.animate({
        rotate: 90,
        duration: 1000
    }).then(function() {
        return message.animate({
            scale: { x: 2, y: 2 },
            duration: 1000
        });
    });
};

This works as intended on Android, but on iOS the second animation incorrectly rotates the image during the scaling, and then reverts to the appropriate value when the animation completes. You can see this behavior in the gif below:

ios-bug

Metadata

Metadata

Assignees

Type

No type

Projects

No projects

Milestone

Relationships

None yet

Development

No branches or pull requests

Issue actions