-3
我有3頁：QML上的動畫沒有顯示？
Main.qml：包含topbar.qml和menubar.qml靜態和Audio.qml這是dynamiacally加載。
在想動畫菜單欄（選項按鈕），但沒有任何顯示。
這裏是4個文件。看來Z命令不起作用。
Main.QML
import QtQuick 2.0
import QtQuick.Window 2.2
import Controllers 1.0
import "Logic.js" as Controller_Js
Window {
visible: true
id: root
width: 800
height: 480
maximumHeight: height
maximumWidth: width
minimumHeight: height
minimumWidth: width
color: "#000000"
Component.onCompleted: {
Controller_Js.setCurrentPage(Controller.homeView)
loader.source = "Home.qml"
console.log("module controllers", Controller.homeView)
}
FontLoader {
id: regular
source: "fonts/DINPro-Regular.otf"
}
FontLoader {
id: medium
source: "fonts/DINPro-Medium.otf"
}
FontLoader {
id: bold
source: "fonts/DINPro-Bold.otf"
}
TopBar {
id: topbar
x:58
y:0
width: 742
height: 55
}
MenuBar {
id: menuBar1
width: 58
height: 480
}
Item{
id: page
x: 64
y:54
width: 736
height: 426
Loader{
id: loader
x: 0
y: 0
width: 736
height: 428
asynchronous: true
}
MenuBar.qml：短例如其中i調用我的動畫
Item {
id: optionsBut
x: 8
y: 164
width: 48
height: 52
Image {
id: image2
x: 3
y: 0
width: 37
source: "assets/RT-actionbar-sub-menu.png"
}
MouseArea {
id: mousesubmenu
x: -2
y: -15
width: 53
height: 67
onClicked: {
Controller.statesubmenu="ShowSubmenu"
console.log("state submenu",Controller.statesubmenu)
}
}
}
我的動畫組件：子菜單具有2個狀態; 顯示和隱藏。在調試器，它告訴我狀態：「顯示」，但沒有出現在我的屏幕上。
Rectangle {
id: root
x: -382
y: 0
width: 318
height: 425
color: "#282827"
border.width: 0
visible: true
z: 2000
state: Controller.statesubmenu
MouseArea {
anchors.fill: paren
onClicked: mouse.accepted = false
}
Rectangle {
id: item1
width: 317
height: 70
color: "#00000000"
Text {
x: 94
y: 18
width: 100
height: 35
color: "#ffffff"
text: qsTr("Sources")
font.pixelSize: 27
font.family: regular.name
}
Rectangle {
width: 317
height: 1
y:70
color: "#40D8D8D8"
}
}
Rectangle {
id: item2
y: 70
width: 317
height: 70
color: "#00000000"
Text {
x: 94
y: 18
width: 122
height: 35
color: "#ffffff"
text: qsTr("Settings")
font.pixelSize: 27
font.family: regular.name
}
Rectangle {
width: 317
height: 1
y:70
color: "#40D8D8D8"
}
}
Rectangle {
id: item3
x: 0
y: 141
width: 317
height: 70
color: "#00000000"
Text {
x: 94
y: 18
color: "#ffffff"
text: qsTr("Audio Effects")
font.pixelSize: 27
font.family: regular.name
}
Rectangle {
width: 317
height: 1
y:70
color: "#40D8D8D8"
}
}
Rectangle {
id: item4
x: 0
y: 212
width: 317
height: 70
color: "#00000000"
Text {
x: 94
y: 18
color: "#ffffff"
text: qsTr("My stations")
font.pixelSize: 27
font.family: regular.name
}
Rectangle {
width: 317
height: 1
y:70
color: "#40D8D8D8"
}
}
states: [
State {
name: "ShowSubmenu"
PropertyChanges {
target: root
x: 0
}
},
State {
name: "HideSubmenu"
PropertyChanges {
target: root
x : -382
z: 100
visible: true
}
}
]
transitions: [
Transition {
NumberAnimation {
property: "x"
easing.type: Easing.InOutQuad
}
}
]
}