Welcome!

Welcome to the official BlackBerry Support Community Forums.

This is your resource to discuss support topics with your peers, and learn from each other.

inside custom component

Native Development

Reply
Regular Contributor
senimii
Posts: 50
Registered: ‎04-27-2012
My Device: BlackBerry Q10
My Carrier: 447713279379

Opening different qml pages at least 7 pages

I am trying to create an app that is suppose to work like the flow chart below; I used NavigationPane to open the second page.

 

However, I have been struggling to open the third and fourth page, please I need advice on how to create it:

 

qml_flow.png

 

 

actions: [
            // Create the "Activate" action
            ActionItem {
                title: "Activate"
                ActionBar.placement: ActionBarPlacement.OnBar
                  
                // When this action is selected, create an object that's based
                // on the ComponentDefinition below, and then push it on to
                // the stack to display it
                onTriggered: {
                    var newPage = pageDefinition.createObject();
                    navigationPane.push(Page);
                }
            }
        ]
          
        attachedObjects: [
            // Create the ComponentDefinition that represents the custom
            // component in pageTwo.qml
            ComponentDefinition {
                id: pageDefinition
                source: "pageTwo.qml"
            }
        ]
 
PS: I have read all about the Create several Stacks and about NavigationPane, but not been successful.
 
Please help!
NFC on my mind!!
Please use plain text.
Developer
simon_hain
Posts: 15,806
Registered: ‎07-29-2008
My Device: Z10 LE
My Carrier: O2 Germany

Re: Opening different qml pages at least 7 pages

you need componentdefinitions for C and D as well.
you can use the navigationPane id in your subpages, so the code you use to show B works for C and D as well.
----------------------------------------------------------
feel free to press the like button on the right side to thank the user that helped you.
please mark posts as solved if you found a solution.
@SimonHain on twitter
Please use plain text.
Regular Contributor
senimii
Posts: 50
Registered: ‎04-27-2012
My Device: BlackBerry Q10
My Carrier: 447713279379

Re: Opening different qml pages at least 7 pages

Thank you for the prompt reply, however I can get A to go to B, BUT cant get B to C and so on like that.

I used the componentdefinition in them all.....

 

main qml:

 

// Navigation pane project template
import bb.cascades 1.0

NavigationPane {
id: navigationPane
Page {
// page with a picture thumbnail
Container {
background: Color.Black
layout: DockLayout {
}
ImageButton {
defaultImageSource: "asset:///images/forward.png"
pressedImageSource: "asset:///images/forward.png"
disabledImageSource: "asset:///images/forward.png"
topMargin: 40
enabled: true
verticalAlignment: VerticalAlignment.Center
horizontalAlignment: HorizontalAlignment.Center
onClicked: {
// show detail page when the button is clicked
var page = getSecondPage();
console.debug("pushing detail " + page)
navigationPane.push(page);
}
property Page secondPage
function getSecondPage() {
if (! secondPage) {
secondPage = secondPageDefinition.createObject();
}
return secondPage;
}
attachedObjects: [
ComponentDefinition {
id: secondPageDefinition
source: "B.qml"
}
]
}
onCreationCompleted: {
// this slot is called when declarative scene is created
// write post creation initialization here
console.log("NavigationPane - onCreationCompleted()");

// enable layout to adapt to the device rotation
// don't forget to enable screen rotation in bar-bescriptor.xml (Application->Orientation->Auto-orient)
OrientationSupport.supportedDisplayOrientation = SupportedDisplayOrientation.All;
}
}

 

 

 

B.qml

 

Button {
text: "Check"
onClicked: {
var page = secondPageDefinition.createObject();
navigationPane.push(pageB);
}
attachedObjects: [
ComponentDefinition {
id: check
source: "B.qml"
}
]
verticalAlignment: VerticalAlignment.Center
horizontalAlignment: HorizontalAlignment.Center
}

Button {
text: "Go"
onClicked: {
navigationPane.push(pageC);
}
attachedObjects: [
ComponentDefinition {
id: go
source: "C.qml"
}
]
verticalAlignment: VerticalAlignment.Center
horizontalAlignment: HorizontalAlignment.Center
}
}

 

NFC on my mind!!
Please use plain text.
Developer
simon_hain
Posts: 15,806
Registered: ‎07-29-2008
My Device: Z10 LE
My Carrier: O2 Germany

Re: Opening different qml pages at least 7 pages

you have to create the component, as before.

navigationPane.push(pageC); does not do anything, as there is no pageC object. you have to create it first.
in your case you named the definition "go", so the code would be:
var pageC = go.createObject(this);
----------------------------------------------------------
feel free to press the like button on the right side to thank the user that helped you.
please mark posts as solved if you found a solution.
@SimonHain on twitter
Please use plain text.
Regular Contributor
senimii
Posts: 50
Registered: ‎04-27-2012
My Device: BlackBerry Q10
My Carrier: 447713279379

Re: Opening different qml pages at least 7 pages

I tried this process, still not working....

NFC on my mind!!
Please use plain text.