NavigationPane pop from C++ BB10

Question

I'm right now creating my app only in C++, i creating the NavigationPane and adding the container with the Views i need. It works fine, but i want to capture a Button clicked to make the NavigationPane pop the current page and push a diferent (made in runtime) Page.

How can it be achieved, i tried working with the signals, but i think i'm not getting how it works the signals and the QT_SLOTS, in the case of the NavigationPane, it doesn't have those methods as QT_SLOT.

Any advice will be appreciated.

score 2 · Answer 1 · answered Sep 01 '13 at 19:34

You first need to connect the clicked() signal of your Button to the pop() slot of your NavigationPane. It should look like this:

// Connect the button's clicked() signal to the navigation pane's
//  pop() slot. 
bool connectResult = QObject::connect(myButton, 
     SIGNAL(clicked()), 
     myPane, 
     SLOT(pop()));

// Use the Q_ASSERT() function to test the return value and 
// generate a warning message if the signal slot connection 
// wasn’t successful.
Q_ASSERT(connectResult);

// Indicate that the variable connectResult isn't used in the 
// rest of the app to prevent a compiler warning.
Q_UNUSED(connectResult);

This page about buttons might help you understand how to handle this. To better understand how to connect objects together, you might also want to have a look at a the signals and slots documentation.

You then have to create and push your new page after the pop. To do that, you simply have to connect the popTransitionEnded (bb::cascades::Page *page) slot of your NavigationPane to your custom function that will do the job.

bool connectResult = QObject::connect(myPane, 
     SIGNAL(popTransitionEnded(bb::cascades::Page*)), 
     this,
     SLOT(createNewPageAndPushIt(bb::cascades::Page*)));

Q_ASSERT(connectResult);
Q_UNUSED(connectResult);

See this page for more details about the usage of NavigationPane to stack pages.

This does not work, the method pop is not recognized as a valid SLOT, not at least in my Momentics or the version i'm using, or with Blackberry API level 10.0. Also the handlePopTransitionEnded is the method i have, not the popTransitionEnded. — desgraci, Sep 02 '13 at 13:22
Anyway i found another way to do it, that was to make my class extend from Q_OBJECT and declarate a function private slots inside the .h file, after that, i just link the button to the class function declared before, where i pop and navigate from the NavigationPane. — desgraci, Sep 02 '13 at 14:15

score 2 · Answer 2 · edited Mar 13 '14 at 06:56

---------------------TRY THIS-------------

Get sample app from my github samples for your query....

https://github.com/svmrajesh/BB-10-Cascades/tree/master/MY%20APPS/stackNavigation

main.qml: (first page)

 import bb.cascades 1.0

 NavigationPane {
  id: navigationPane
  backButtonsVisible: false
  peekEnabled: false


 Page 
 {
   id: rootPage
   Container {
    background: Color.LightGray

    layout: DockLayout {

    }
    Label {
        text: "First page"
        horizontalAlignment: HorizontalAlignment.Center
        verticalAlignment: VerticalAlignment.Center
    }
 }

actions: [
    ActionItem {
        title: "Next page"
        ActionBar.placement: ActionBarPlacement.OnBar
        onTriggered: {
            var page = pageDefinition.createObject();
            navigationPane.push(page);

        }

        attachedObjects: ComponentDefinition {
            id: pageDefinition
            source: "PageTwo.qml"
        }
    }
  ]
}
onPopTransitionEnded: {
   page.destroy();
}


}

2.second page

     import bb.cascades 1.0

     Page {
         id: pageTwo
         Container {
             background: Color.Gray
             layout: DockLayout {

            }
         Label {
            text: "Second page"
            horizontalAlignment: HorizontalAlignment.Center
     }


    Container {
        layout: StackLayout {

        }
        horizontalAlignment: HorizontalAlignment.Center
        verticalAlignment: VerticalAlignment.Center

        Button {

        text: qsTr("Next Page")
        imageSource: "asset:///images/picture1thumb.png"
        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: "PageTwoOne.qml"
             }
         ]
      }

        Button {
          text: "Previous Page"
          onClicked: {
            navigationPane.pop();
          }

        }
      }
   }

/* ------------- Use this Code If back button visibility is "True"-----------------

paneProperties: NavigationPaneProperties {

    backButton: ActionItem {
        title: "Back"
     // imageSource: "asset:///back.png"
        onTriggered: {
            navigationPane.pop();
        }
        }
  } */
}

3.last page

     import bb.cascades 1.0

     Page {
        id: pageTwoone

       Container {
            background: Color.DarkGray
            layout: DockLayout {}

      Label {
           horizontalAlignment: HorizontalAlignment.Center
           text: "Last Page"
     }


     Container {
           layout: StackLayout {}
           horizontalAlignment: HorizontalAlignment.Center
           verticalAlignment: VerticalAlignment.Center


     Button {
         horizontalAlignment: HorizontalAlignment.Center
         verticalAlignment: VerticalAlignment.Center
         text: qsTr("Goto Home Page")

         onClicked: {
            // show detail page when the button is clicked
            navigationPane.navigateTo(rootPage);
             }
            }
        Button {
            horizontalAlignment: HorizontalAlignment.Center
            verticalAlignment: VerticalAlignment.Center
            text: qsTr("Goto Back")

            onClicked: {
                // show detail page when the button is clicked
                navigationPane.pop();
            }

           }
         }
      }
    }

------------ ADD More pages to navigate using this code----------------------------

-------------copy this code and run.. get sample app from above link if needed ------

NavigationPane pop from "C++" BB10, not QML :p, anyway i figured out like i said on Remi Laplace comments — desgraci, Sep 03 '13 at 17:32

Juanmabs22 · Answer 3 · 2015-02-12T19:12:30.997

Have you checked this? https://developer.blackberry.com/native/reference/cascades/bb__cascades__navigationpane.html

NavigationPane* navigationPane; // Global var to change current Page with push/pop

void initializeNavigationPane()
{
ActionItem* nextAction = ActionItem::create()
    .title("Next page")
    .onTriggered(this, SLOT(pushPage()));

navigationPane = NavigationPane::create();
QObject::connect(navigationPane, SIGNAL(popTransitionEnded(bb::cascades::Page*)), 
    this, SLOT(popFinished(bb::cascades::Page*)));

// Put a new page
navigationPane->push(Page::create()
    .content(Label::create("First page"))
    .addAction(nextAction, ActionBarPlacement::OnBar));

Application::instance()->setScene(navigationPane);
}

void popFinished(bb::cascades::Page* page){
delete page;
}

//You have to connect this method when you want a new Page pushed.
Q_SLOT void pushPage(){
ActionItem* backAction = ActionItem::create()
    .title("Previous page")
    .imageSource(QUrl("asset:///back.png"))
    .onTriggered(navigationPane, SLOT(pop()));

navigationPane->push(Page::create()
    .content(Label::create("Second page"))
    .paneProperties(NavigationPaneProperties::create()
        .backButton(backAction)));
}

Explication:

An instance of the object NavigationPane allows change the current page to others with the push/pop effect (see image): developer.blackberry.com/native/files/reference/cascades/images/navigation_pane_push_pop.png

You have to inicialice with:
navigationPane = NavigationPane::create();

And tell to the Application you will use this instance to change page:
Application::instance()->setScene(navigationPane);

Now you app got a NavigationPane, but nothing is inside, if you run it, you will get a black screen, to add a page (the principal page - page0) use push:
navigationPane->push(Page::create() .content(Label::create("First page")));

To add a new Page that It can go back to the page0 we just push use Push again, Remeber include the back button to go back:
navigationPane->push(Page::create() .content(Label::create("Second page")) .paneProperties(NavigationPaneProperties::create() .backButton(ActionItem::create() .title("Previous page") .imageSource(QUrl("asset:///back.png")) //You should add manually this image. .onTriggered(navigationPane, SLOT(pop()))));

Q_INVOKABLE void insert (intindex, bb::cascades::Page *page ) https://developer.blackberry.com/native/reference/cascades/bb__cascades__NavigationPane.html#function-insert-index-page
Inserts a page at a specified index in the NavigationPane.

The page that is passed must not be 0 or it will be ignored. If the page is already present in the navigation stack, the operation will fail. This operation will not trigger a transition effect, even if the page is added to the top of the stack. If a transition effect is desired, use push() instead. The topChanged() signal will be emitted if the operation affects the top node.

Parameters

1- index
The index where the page will be placed. If the index < 0 the the page is inserted in the bottom. If the index > the number of pages in the navigation stack, it is added on top of the stack.
2- page
The page to be inserted, must not be 0.

Since: BlackBerry 10.0.0

An idea is

You could use:
navigationPane.count()
To get the current pages in the nagationPane stack, and use:
navigationPane.insert(navigationPane.count()-1, myPageToBeBack);
To push a page between the current page and the previous one

You should clarify how this answers the question, if at all. — h7r, Feb 11 '15 at 22:06

NavigationPane pop from C++ BB10

3 Answers3

Explication:

An idea is