Problem changing the states when switching the current screen to next screen

xiazhouquan

Hi,I want to implement this function,when the application start up ,the screen named mainscreen show a horizontal ListView showing some menu,below the ListView,there is a GridView showing many picture one bye one ,when I click on Picture ,the current screen should be replaced with a new screen named detailscreen with the some descriptions about the picture ,the descriptions is Column,below the Column ,there are tow buttons,one is back button ,when I click it ,the screen should be back to be the previous screen with ListView and GridView,after I am in the previous screen,I click on picture ,a problem shows.The problem is that mainscreen and detailscreen are showing at the same time in the screen.
Here I will show some code in my qml file,some are framework only.

main.qml
@
import QtQuick 1.0

Rectangle{
id:mainwindow
FocusScope{
id:mainView
ListMenu{
id:listMenu
y: 0
width: parent.width; height: 50; visible: true; anchors.bottom: gridmenu.top; anchors.bottomMargin: 11; smooth: true; scale: 1
}

     GridMenu{
        id:gridmenu
        y:listMenu.height
        width: parent.width;height: parent.height
     }

}

BookDetails{id:bookdetails;width: parent.width;anchors.left: mainView.right;height: parent.height; state: "detailBook"}

states:[
State{
        name: "showBookGrid"
    },

State{
name: "detailBook"
}
]

transitions: [
    Transition {
        from: "*"; to: "showBookGrid"
       NumberAnimation { properties: "x,y"; duration: 500; easing.type: Easing.Linear }
   },
    Transition {
        from: "showBookGrid"; to: "detailBook"
        ParentAnimation {
            NumberAnimation { properties: "x,y"; duration: 500; easing.type: Easing.InOutQuad }
        }
    }
]

}
@

GridMenu.qml
@
FocusScope{
id:gridpicture
Rectangle {
anchors.fill: parent
clip: true
GridView{
id:gridView
model:RssModel{}
delegate: DelegateGrid{}
}
}

}
@

DelegteGrid.qml
@
Item{
id:delegate
function bookClicked() {
delegate.state="Details"
}
Column{
id:columnpicture
Text {}
Image {
id:picture
}
}
states: [
State {
name: "active";when: delegate.activeFocus
PropertyChanges {
target: columnpicture
scale:1.1
}
},
State {
name: "Details"
PropertyChanges { target: mainwindow; state: "detailBook" }
PropertyChanges {target: mainView;x:-mainView.width}
PropertyChanges { target: bookdetails; anchors.left: mainwindow.left }
// ParentChange{target: picture;x:10;y:20;parent: bookdetails.frontContaner}
// PropertyChanges { target: picture; anchors.left: mainwindow.left;x:10;y:20; }
}
]

    MouseArea {
    id: mouseArea
    hoverEnabled: true
    width: picture.width;height: picture.height
    onClicked:{ bookClicked()}
}

}

@

ListMenu.qml
@
FocusScope{
ListView{

}

@

DelegateList.qml
@
Item{
id: containerlist
Text{}
MouseArea {
anchors.fill: parent
hoverEnabled: true
onClicked: {
ListView.view.currentIndex = index
containerlist.forceActiveFocus()
// mainwindow.currentFeed=feed
gridmenu.currentFeed=feed

    }
}
states: State {
    name: "active"; when: containerlist.activeFocus
    PropertyChanges { target: label; color: "#FCFFF5"; scale: 1.1 }
    PropertyChanges { target: label; font.pixelSize: 20 }
}

transitions: Transition {
    NumberAnimation { properties: "scale"; duration: 100 }
}

}

@

BookDetails.qml

@
Item{
id:contaner
Item{
id: contanerFront
Column{
Text {}
Text {}
Text {}
}
}
Row{
id:rowbottun
Button {
id: backtohome
text: "Back "
width: contaner.width/10;height: contaner.height/10
focus: true
MouseArea {
id:backarea
anchors.fill: parent
onClicked: {
console.log("mouse clicked")
console.log(bookdetails.state)
bookdetails.state="backtodetails"
console.log(bookdetails.state)
}
}
}
}
}

@

Button.qml

@
import QtQuick 1.0

Item {
id: container

signal clicked

property string text

BorderImage {
    id: buttonImage
}
BorderImage {
    id: pressed
}
MouseArea {
    id: mouseRegion
    anchors.fill: buttonImage
    onClicked: { container.clicked(); }
}
Text {
    color: "white"
}
states: [
    State {
        name: "Pressed"
        when: mouseRegion.pressed == true
        PropertyChanges { target: pressed; opacity: 1 }
    }
]

}

@

I have worked it for two more days to research the problem ,But I can't resolve it,
Thank you for reply!
My best regards!

TobbY

i dont know that much, but hav u deleted or close the mainscreen after showing the detail screen.