cycloveu |
2016-05-25 10:58 |
QML页面管理
彩阳大大的页面管理模块,精简了下,搬过来给大家用. PageManager.qml: import QtQuick 2.5
Item { id: viewManager
property var initialItem property var currentItem property var items: []
QtObject { id: internal
property int duration: 500 property var fadeAnimation: ParallelAnimation { running: false
OpacityAnimator { id: fadeInAnimator from: 0; to: 1 duration: internal.duration } OpacityAnimator { id: fadeOutAnimator from: 1; to: 0 duration: internal.duration }
onStopped: { internal.transitionEnd(fadeInAnimator.target, fadeOutAnimator.target); } } //end fadeAnimation
function transition(enterItem, properties) { if (viewManager.currentItem === enterItem) return;
if (properties && properties.animate === false) { transitionEnd(enterItem, viewManager.currentItem); } else { enterItem.opacity = 0; enterItem.visible = true; viewManager.currentItem.opacity = 1; fadeInAnimator.target = enterItem; fadeOutAnimator.target = viewManager.currentItem; fadeAnimation.start(); } }
function transitionEnd(enterItem, exitItem) { if (exitItem) { exitItem.visible = false; exitItem.anchors.fill = undefined; } viewManager.currentItem = enterItem; } }//end qtobject
function transition(itemUrl, properties) { for (var i in items) { if (items.url === itemUrl) { internal.transition(items.object, properties); return; } }
var component = Qt.createComponent(itemUrl);
if (component.status === Component.Ready) { var item = component.createObject(parent, { "anchors.fill": parent }); var info = { "url": itemUrl, "component": component, "object": item }; if (!item) items = []; items.push(info); internal.transition(item, properties); } else if (component.status === Component.Error) { console.log(component.errorString()); } }
onInitialItemChanged: { if (typeof(initialItem) == "string") { transition(initialItem, { "animate": false }); } else if (typeof(initialItem) == "object") { internal.transition(initialItem, { "animate": false }); } }
onCurrentItemChanged: { currentItem.opacity = 1; currentItem.visible = true; }
Component.onDestruction: { for (var i in items) { items.component.destroy(); items.object.destroy(); } } }
用法:viewManager.transition("xxx.qml", {"xxx": xxx})
|
|