onclicked button open "new" form
-
wrote on 14 Nov 2017, 18:39 last edited by filipdns
Hello guys you will probably say that crazy to don't know how to do but I don't ;-)
then, with qt quick and quick control, I want to "call" an other qml form when button on first form is clicked but I do not want to have an other window like "pop up" opening.Could you help me?
thank you very much
Philippe -
Ehh, how do you then want the other window to appear?
-
wrote on 14 Nov 2017, 18:47 last edited by
Hello, I don't want other windows
-
wrote on 14 Nov 2017, 18:48 last edited by
I want that the button pressed do like go to an other slide
-
@filipdns
so why do you want another QML form if you dont want to show it?You try to make sort of a page design?
where it switches a pages but its only one window? -
wrote on 14 Nov 2017, 18:52 last edited by filipdns
I was thinking it's easier to have each pages on separate qml but may be not, I don't know, I'm just start with qml to do API for my project
-
wrote on 14 Nov 2017, 18:54 last edited by
may be I use wrong "word" to be clear, I want multiple pages display in the windows but one by one each time I click on the wanted button, that more clear or not?
-
may be I use wrong "word" to be clear, I want multiple pages display in the windows but one by one each time I click on the wanted button, that more clear or not?
@filipdns
Yes, its a normal design.
Make a new QML default project.
Its actually structured like that.
With pages in its own QML file.File->New Project->Application->Quick Controls 2 application.
And run it. That sounds like what you are after. one window. you can switch "pages".
and please have a look in
https://qmlbook.github.io/
also if not already seen. -
wrote on 14 Nov 2017, 19:17 last edited by filipdns
-
Hi
Well the sample just uses tab buttons, but nothing stopping from using an other type of button in the center
and still use the SwipeView to manage the pages.http://doc.qt.io/qt-5/qml-qtquick-controls-button.html#details
Page1 { Button { onClicked:{swipeView.currentIndex = swipeView.currentIndex+1} text: "Button" } }
-
wrote on 14 Nov 2017, 19:30 last edited by
ok, cool, I will test that thank you!!
-
@filipdns
Np. If you really new to QML, browse over that book gives good hint how QML works.
QML is very flexible and u can mix most things as you like. -
wrote on 14 Nov 2017, 19:37 last edited by
Thank you, I'm reading it , to do button and add style like shadow that ok, I understood that, action to change color or else on same page also It's easy. The most difficult for me was to understand how change the complete page with an other with onclick action.
I will try your method and I will make feedback here, thanks again -
Thank you, I'm reading it , to do button and add style like shadow that ok, I understood that, action to change color or else on same page also It's easy. The most difficult for me was to understand how change the complete page with an other with onclick action.
I will try your method and I will make feedback here, thanks again@filipdns
Well when you want it to stay inside same window. You often use a container like swipeView as its less
messy as to have all the QML pages stacked on top and show/hide to flip pages.
There are other ways to have multiple pages/screens but swipeView does it with style.Happy programming.
-
wrote on 14 Nov 2017, 19:49 last edited by
Just quick other question, it's not possible to do in the main.qml the action button task and make the form I want for each page?
example:
main.qmlApplicationWindow { visible: true width: 640 height: 480 button { id: button1 anchors.fill: parent MouseArea { id: mouseArea anchors.fill: parent onClicked: page2.qml() } button { id: button2 anchors.fill: parent MouseArea { id: mouseArea anchors.fill: parent onClicked: page3.qml() }
it's not real code that just to illustrate what I have in my mean ;-)
-
Just quick other question, it's not possible to do in the main.qml the action button task and make the form I want for each page?
example:
main.qmlApplicationWindow { visible: true width: 640 height: 480 button { id: button1 anchors.fill: parent MouseArea { id: mouseArea anchors.fill: parent onClicked: page2.qml() } button { id: button2 anchors.fill: parent MouseArea { id: mouseArea anchors.fill: parent onClicked: page3.qml() }
it's not real code that just to illustrate what I have in my mean ;-)
@filipdns
It is, but you want it to be part of the SwipeView
Image the structure being a tree, so we must add them to the SwipeView structure for them to be "in" itSwipeView { id: swipeView anchors.fill: parent currentIndex: tabBar.currentIndex Page1 { Button { onClicked:{swipeView.currentIndex = swipeView.currentIndex+1} text: "Button" } } Page { Label { text: qsTr("Second page") anchors.centerIn: parent } } }
Else they be under ApplicationWindow and we can not change page. (also swipeview might cover them)
-
@filipdns
It is, but you want it to be part of the SwipeView
Image the structure being a tree, so we must add them to the SwipeView structure for them to be "in" itSwipeView { id: swipeView anchors.fill: parent currentIndex: tabBar.currentIndex Page1 { Button { onClicked:{swipeView.currentIndex = swipeView.currentIndex+1} text: "Button" } } Page { Label { text: qsTr("Second page") anchors.centerIn: parent } } }
Else they be under ApplicationWindow and we can not change page. (also swipeview might cover them)
-
@filipdns
Ignore the swipe effect for now.
Its to handle the actual page switching. (not to get the animation)
Else you would have to hide or show all elements depending on what
page you are currently viewing.Alternativ you can use
http://doc.qt.io/qt-5/qml-qtquick-controls-stackview.html
which have no animation effect as far as i know. -
wrote on 14 Nov 2017, 20:05 last edited by
oh that feel more than what I was looking for ;-) thank you
-
@filipdns
yes it should be :)
It provides a page handler with the ability to go back and forth.
Note, that you could also hide/show the pages your self but
its less code to use a premade element designed for such design.
1/25