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
Developer
Posts: 120
Registered: ‎12-22-2011
My Device: ---
My Carrier: ---
Accepted Solution

Navigation Pane Issue

Dear , 

 

I have navigation pane example from BB Demos 

 

and added third page 

 

My Qml 

 

main.qml

// Navigation pane project template
import bb.cascades 1.0

NavigationPane {
    id: navPane
    Page {
        // page with a picture thumbnail
        Container {
            background: Color.Black
            layout: DockLayout {
            }
            Button {
                horizontalAlignment: HorizontalAlignment.Center
                verticalAlignment: VerticalAlignment.Center
                text: qsTr("Show detail")
                imageSource: "asset:///images/picture1thumb.png"
                onClicked: {
                    // show detail page when the button is clicked
                    var page = getSecondPage();
                    console.debug("pushing detail " + page)
                    navPane.push(page);
                }
                property Page secondPage
                function getSecondPage() {
                    if (! secondPage) {
                        secondPage = secondPageDefinition.createObject();
                    }
                    return secondPage;
                }
                attachedObjects: [
                    ComponentDefinition {
                        id: secondPageDefinition
                        source: "DetailsPage.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.DisplayPortrait;

    }
}

 

DetailsPage.qml

// Navigation pane project template
import bb.cascades 1.0

Page {
    // page with a picture detail
    id: pgDetail
    Container {
        background: Color.Black
        Button {
            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Center
            text: qsTr("Show 3rd ")
            imageSource: "asset:///images/picture1thumb.png"
            onClicked: {
                // show detail page when the button is clicked
                var page = getthirdPage();
                console.debug("pushing detail " + page)
                navPane.push(page);
            }
            property Page thirdPage
            function getthirdPage() {
                if (! thirdPage) {
                    thirdPage = thirdPageDefinition.createObject();
                }
                return thirdPage;
            }
            attachedObjects: [
                ComponentDefinition {
                    id: thirdPageDefinition
                    source: "third.qml"
                }
            ]
        }
    }
}

 third.qml

import bb.cascades 1.0

Page {
    Container {
    }
}

 

the code working 

 

but i want to delete main.qml from the stack 

so the DetailsPage.qml tp be my first page in the navigation stack after pushed from the main.qml

 

can any one helpe me ?

 

Thanks

Developer
Posts: 16,992
Registered: ‎07-29-2008
My Device: Z10 LE, Z30, Passport
My Carrier: O2 Germany

Re: Navigation Pane Issue

this should help
https://developer.blackberry.com/cascades/reference/bb__cascades__navigationpane.html#function-remov...
----------------------------------------------------------
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