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: 146
Registered: ‎02-19-2011
My Device: Bold 9930 and PlayBook
Accepted Solution

NavigationPane not popping

I'm trying to rewright my app from JavaScript to C++/QML.  I'm new to QML but I thought it would make sense to write the UI in a QML and then the logic and UI control in C++.  The problem I'm seeing is when I call the pop() function from C++ the screen never pops.  Does anyone have any ideas? 

 

Main.cpp

#include "wpapp.hpp"

// include JS Debugger / CS Profiler enabler
// this feature is enabled by default in the debug build only
#include <Qt/qdeclarativedebug.h>


using ::bb::cascades::Application;

Q_DECL_EXPORT int main(int argc, char **argv)
{
    // this is where the server is started etc
    Application app(argc, argv);

    WPApp *wpApp = new WPApp (&app);

    // we complete the transaction started in the app constructor and start the client event loop here
    return Application::exec();
    // when loop is exited the Application deletes the scene which deletes all its children (per qt rules for children)
}

wpapp.hpp

// Application with UI adaptability support template
#ifndef WPApp_HPP_
#define WPApp_HPP_

#include <QtCore/QObject>
#include <bb/cascades/Application>
#include <bb/cascades/NavigationPane>
#include <string>
#include <vector>
#include "library/StatData.h"

using std::vector;
using std::string;
using namespace bb::cascades;

namespace bb {
	namespace cascades {
		class Application;
	}
}

/*!
 * @brief Application pane object
 *
 *Use this object to create and init app UI, to create context objects, to register the new meta types etc.
 */
class WPApp : public QObject
{

	Q_OBJECT
public:

    WPApp(Application *);

    virtual ~WPApp();

    Q_INVOKABLE	void addStats(QString);
    Q_INVOKABLE	void showAddScreen();

	void addRemoveStat(string identifiers, bool add);

private:
    vector<StatData*> mActiveStats;
    Page *mRootPane;
    NavigationPane *mNavPane;
    Application *mApp;
};


#endif /* WPApp_HPP_ */

 

 

wpapp.cpp

// Application with UI adaptability support template
#include "wpapp.hpp"
#include <string>
#include <vector>
#include <bb/cascades/Application>
#include <bb/cascades/QmlDocument>
#include <bb/cascades/AbstractPane>
#include <bb/cascades/Container>
#include <bb/cascades/Button>
#include <bb/cascades/StackLayout>
#include <bb/cascades/NavigationPane>
#include <bb/system/SystemToast>

#include "Utilities.h"
#include "connector/WConnector.h"
#include "library/StatData.h"

using std::string;
using std::vector;
using namespace bb::cascades;
using namespace bb::system;

WPApp::WPApp(Application *app) :
		QObject(app)
	{
	QmlDocument *qml = QmlDocument::create("asset:///main.qml").parent(this);
	qml->setContextProperty("app", this);
	//qml->setContextProperty("second", m_pane);
	if (!qml->hasErrors()) {

		mRootPane = qml->createRootObject<Page>();

		mNavPane = new NavigationPane();

		// set created root object as a scene
		//mNavPane->push(mRootPane);
		//Application::instance()->setScene(mNavPane);
		mApp = app;
		mApp->setScene(mRootPane);
	}
}

WPApp::~WPApp() {

}

void WPApp::addStations(QString text) {
	SystemToast *st = new SystemToast(Application::instance());

	string sIdentifiers = text.toStdString();
	NavigationPane *mNavPane = mNavPane->findChild<NavigationPane*>("navigationPane");
	int ct = mNavPane->count();
	mNavPane->pop();
	st->setBody(text);
	st->setPosition(SystemUiPosition::MiddleCenter);
	st->show();
	addRemoveStat(sIdentifiers, true);

}

void WPApp::showAddStat() {
	QmlDocument *qml = QmlDocument::create("asset:///AddScreen.qml").parent(
			this);
	qml->setContextProperty("app", this);
	Page *page = qml->createRootObject<Page>();
	mNavPane->push(page);
}

void WPApp::addRemoveStat(string sIdentifiers, bool bAdd) {
	
}

 

 

Main.qml

// Application with UI adaptability support template
import bb.cascades 1.0
import bb.system 1.0

NavigationPane {
    backButtonsVisible: true
    id: navigationPane
    objectName: navPane

// create application UI page
Page {
    actions: [
        ActionItem {
            title: "Add"
            onTriggered: { 
                //navigationPane.push(newPage);
                app.showAddScreen();
            }
            ActionBar.placement: ActionBarPlacement.OnBar
            imageSource: "images/ic_add.png"
        },
        ActionItem {
            title: "Refresh"
            onTriggered: app.initiateRequest()
            ActionBar.placement: ActionBarPlacement.OnBar
            imageSource: "images/ic_rotate.png"
        },
        ActionItem {
            title: "Remove All"
            onTriggered: app.initiateRequest()
            imageSource: "images/ic_delete.png"
        },
        ActionItem {
            title: "Settings"
            onTriggered: app.initiateRequest()
            imageSource: "images/ic_settings.png"
        }
    ]

    Container {
        layout: DockLayout {
        }
        AppBackground {
            // setup application background
            background: Color.Black
            verticalAlignment: VerticalAlignment.Fill
            horizontalAlignment: HorizontalAlignment.Fill
        }
        Container {
            horizontalAlignment: HorizontalAlignment.Fill
            Container {
                layoutProperties: StackLayoutProperties {
                    spaceQuota: 1.0
                }
                layout: DockLayout {
                }
                verticalAlignment: VerticalAlignment.Fill
                horizontalAlignment: HorizontalAlignment.Fill
                Container {
                    property int padding: 10
                    layout: StackLayout {
                        id: stationStacks

                        // change layout direction according to current device orientation
                        // this feature is disabled for 720x720 devices in current template
                        // see: assets/720x720/AppOrientationHandler.qml
                        orientation: (orientationHandler.orientation == UIOrientation.Portrait) ? LayoutOrientation.TopToBottom : LayoutOrientation.LeftToRight
                    }
                    // create 9-sliced frame for this container
                    background: frame.imagePaint

                    topPadding: padding
                    bottomPadding: padding
                    leftPadding: padding
                    rightPadding: padding
                    verticalAlignment: VerticalAlignment.Center
                    horizontalAlignment: HorizontalAlignment.Center
                }
            }
        }
        attachedObjects: [
            AppOrientationHandler {
                // custom orientation handler
                // the different handler is used for 720x720 in this template
                // to disable oriantation adaptability for this kind of devices
                id: orientationHandler
            }
        ]

    }
    attachedObjects: [
        // Create the ComponentDefinition that represents the custom
        // component in myPage.qml
        ComponentDefinition {
            id: addStation
            source: "AddScreen.qml"
        }
    ]
} // Page
} // NavigationPane

 


AddScreen.qml

import bb.cascades 1.0
import bb.system 1.0

Page {
    actions: [
        ActionItem {
            title: "Search"
            ActionBar.placement: ActionBarPlacement.OnBar
            imageSource: "images/ic_search.png"
        },
        ActionItem {
            title: "Add"
            onTriggered: {
                app.addStat(identifierInput.text)
            }
            ActionBar.placement: ActionBarPlacement.OnBar
            imageSource: "images/ic_add.png"
        }
    ]
    titleBar: TitleBar {
    	title: "Add Stats"
        appearance: TitleBarAppearance.Plain
    }
    
    Container {
        layout: StackLayout {
            orientation: LayoutOrientation.TopToBottom
        }
        background: Color.DarkGray
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.LeftToRight
            }

            Label {
                text: "<div style='font-weight: bold; font-size: 55px; vertical-align: middle'>Identifiers:</div>"
                textFormat: TextFormat.Html
            }
            
            TextField {
                id: identifierInput
                hintText: "XXX YYY"
                horizontalAlignment: HorizontalAlignment.Left
                verticalAlignment: VerticalAlignment.Top
                inputMode: TextFieldInputMode.Text
                /*onTextChanging: {
                    app.mNewIdentifiers = text
                    console.log("Idents " + app.mNewIdentifiers)
                }*/
            }
        }
        Container {
            layout: StackLayout {
                orientation: LayoutOrientation.TopToBottom
            }
            Label {
                text: ""
            }
            Picker {
                id: favoritesPicker
            	title: "Favorites"
            }
        }
    }// Container
} // Page

 

"Not to know what happened before you were born is to be forever a child." Marcus Tullius Cicero
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: NavigationPane not popping

You've set up two navigationPanes is the first thing I see one in your qml and one in c++ main, is this intentional?

 

If not use findChild() to get a reference and use that instead.

 


If you've been helped click on Like Button, if you've been saved buy the app. :smileyhappy:

Developer of stokLocker, Sympatico and Super Sentences.
Retired
Posts: 749
Registered: ‎12-16-2008
My Device: BlackBerry Z30
My Carrier: Bell

Re: NavigationPane not popping

It's also quite reasoable to do all of your UI stuff in QML, and only go down to C for things like business logic or more intensive operations.

 

That's usually accomplished by supplying a C++ object to QML with setContextProperty and then calling Q_INVOKABLE methods on it from QML. That keeps the UI nice and separate from the business logic.

 

Up to you though. As BBSJdev says, your current problem is probably due to having two navigation panes.

Paul Bernhardt
Application Development Consultant
BlackBerry
@PBernhardt

Did this answer your question? Please accept this post as the solution.
Found a bug? Report it to the Developer Issue Tracker
Developer
Posts: 146
Registered: ‎02-19-2011
My Device: Bold 9930 and PlayBook

Re: NavigationPane not popping

[ Edited ]

Thanks, that was left over from when I was trying to control the navigationpane from C++.  Cleaned that up and the main screen isn't even appearing.  No biggie, probably some other leftover code in QML I need to cleanup. 

 

The reason I was putting some of the control in the C++ was because after the second screen is popped I need to take the information put in the second screen and add UI objects to the main screen.  Figured it made sense to have the add button in the second screen call the C++ code to retrieve the values from the screen, pop the second screen off and then add the new UI objects to the first screen.

"Not to know what happened before you were born is to be forever a child." Marcus Tullius Cicero
Developer
Posts: 146
Registered: ‎02-19-2011
My Device: Bold 9930 and PlayBook

Re: NavigationPane not popping

So I fixed the UI not appearing but when I call

mApp->findChild<NavigationPane*>("navigationPane");

or

Application::instance()->findChild<NavigationPane*>("navigationPane");

 in order to get the navigation pane to push the screen I always get null, 0x0.  What am I missing?

 

"Not to know what happened before you were born is to be forever a child." Marcus Tullius Cicero
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: NavigationPane not popping

Well in the code above you've used the object name 'navPane' not navigationPane. This should be your find Child parameter.

If you've been helped click on Like Button, if you've been saved buy the app. :smileyhappy:

Developer of stokLocker, Sympatico and Super Sentences.
Developer
Posts: 1,023
Registered: ‎03-20-2013
My Device: Red LE Developer Z10
My Carrier: Fido

Re: NavigationPane not popping

Rats... you beat me to it by two minutes. LOL

 

I've seen this a lot on the forums, confusion between "id" and "objectName". Any place the documentation says to supply a string with the name of an object, they mean "objectName", which must, of course, be set. I always keep my id and objectName the same to avoid confusion like this.

 


BBSJdev wrote:
Well in the code above you've used the object name 'navPane' not navigationPane. This should be your find Child parameter.





Developer of Built for BlackBerry certified multiFEED RSS/Atom feed reader and aggregator.  multiFEED Icon

Play nice: Clicking Like Button on posts that helped you not only encourages others to continue sharing their experience, but also improves your own rating on this board. Also, don't forget to accept a post if it solves your problem or answers your question.
Developer
Posts: 146
Registered: ‎02-19-2011
My Device: Bold 9930 and PlayBook

Re: NavigationPane not popping

I updated the main.qml to have this at the top of the page

 

NavigationPane {
    backButtonsVisible: true
    id: navigationPane
    objectName: navigationPane

 

but still both of the calls to get the navigationPane return a null pointer in the WPApp::showAddStat() function

 

Application::instance()->findChild<NavigationPane*>("navigationPane");

mApp->findChild<NavigationPane*>("navigationPane");

return null

"Not to know what happened before you were born is to be forever a child." Marcus Tullius Cicero
Developer
Posts: 1,523
Registered: ‎12-18-2012
My Device: Z30, Z10 LE, DevAlpha C, PlayBook

Re: NavigationPane not popping

Hi,
Add quotes around objectName:

objectName: "navigationPane"

Andrey Fidrya, @zmeyc on twitter
Developer
Posts: 6,152
Registered: ‎07-05-2012
My Device: Playbook, Dev Alpha C, Z10 LE, Z30
My Carrier: Orange

Re: NavigationPane not popping

objectName in the qml must be in quotes objectName: "navigationPane"

If you've been helped click on Like Button, if you've been saved buy the app. :smileyhappy:

Developer of stokLocker, Sympatico and Super Sentences.