How to disable animation when the window resizing?

[capvor]

Just like the printer demo, the sub pages are hidden outside the viewport.

   PrintPage {
        back => { root.current-subpage = 0 }
        x: root.current-subpage == 1 ? 0 : parent.width + parent.x + 2px;
        animate x { duration: 125ms; easing: ease; }
    }

    ScanPage {
        back => { root.current-subpage = 0 }
        x: root.current-subpage == 2 ? 0 : parent.width + parent.x + 2px;
        animate x { duration: 125ms; easing: ease; }
    }

    CopyPage {
        back => { root.current-subpage = 0 }
        x: root.current-subpage == 3 ? 0 : parent.width + parent.x + 2px;
        animate x { duration: 125ms; easing: ease; }
    }

    UsbPage {
        back => { root.current-subpage = 0 }
        x: root.current-subpage == 4 ? 0 : parent.width + parent.x + 2px;
        animate x { duration: 125ms; easing: ease; }
    }

change the width and height to perferred prefix, to allow resizing the window.

    preferred-width: 772px;
    preferred-height: 504px;

The hided pages will show when the window resizing:

Is there any way to disable animation when resizing the window?

[ogoffart]

There is no way to specificly disable animation when resizong, but i can come with a few ideas as a workaround:

• Set the animation using states and transition and only animate when the states are changing.
• Animate an intermediate property instead of x directly.

So in code: (haven't tried it)

// with state
PrintPage {
    x: parent.width + parent.x + 2px;
    states [ active when root.current-subpage == 1 : { 
       x: 0;
       in { animate x { duration: 125ms; easing: ease; } }
       out { animate x { duration: 125ms; easing: ease; } }
    } ]
}

/// with intermediate property
PrintPage {
    x: animation * (parent.width + parent.x + 2px);
    property <float> animation: root.current-subpage == 1 ? 0 : 1;
    animate animation { duration: 125ms; easing: ease; }
}