javascript - I failed to slide screen animation in QML -
i want slide menu screen on root rectangle. menu screen comes left side, ok couldn't send again.
window { visible: true id: root width: 460; height: 640 color: "white" property int duration: 3000 property bool menu_shown: false rectangle { id: menu_screen width: parent.width; height: parent.height color: "#303030" radius: 10 x: -460; sequentialanimation { id: anim_menu numberanimation { target: menu_screen properties: "x" to: -160 } } } rectangle { id: click_button width: 50; height: 50 color: "#303030" scale: m_area.pressed ? 1.1 : 1 radius: 5 x: 5; y: 5; sequentialanimation { id: anim_button numberanimation { target: click_button properties: "x" to: 305 } } } mousearea { id: m_area anchors.fill: click_button onclicked : { anim_button.start() anim_menu.start() } } }
you not defining animation going back, same animation running on clicked signal. recommend use behavior on x
though. try this.
import qtquick 2.4 import qtquick.controls 1.3 import qtquick.window 2.2 import qtquick.dialogs 1.2 window { visible: true id: root width: 460; height: 640 color: "white" property int duration: 3000 property bool menu_shown: false rectangle { id: menu_screen width: parent.width; height: parent.height color: "#303030" radius: 10 x: -460; behavior on x { numberanimation { } } } rectangle { id: click_button width: 50; height: 50 color: "#303030" scale: m_area.pressed ? 1.1 : 1 radius: 5 x: 5; y: 5; behavior on x { numberanimation { } } } mousearea { id: m_area anchors.fill: click_button onclicked : { click_button.x = click_button.x == 5 ? 305 : 5 menu_screen.x = menu_screen.x == -460 ? -160 : -460 } } }
also, side note, take @ this in meantime. :)
Comments
Post a Comment