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
Contributor
nanyaran
Posts: 19
Registered: ‎06-21-2012
My Device: z10

How can i use c++ and qml at the same time?

I am making an app and currently the qml file contain noly images and texts. I have another C++ file that can grab sensor information and process the information. I am wondering how can I use those infromation that got from cpp file at qml file? (Or how can i do print sensor information on the display?) Thanks.

Developer
thubalek
Posts: 323
Registered: ‎10-01-2012
My Device: Dev Alpha C, Playbook 32 GB

Re: How can i use c++ and qml at the same time?

Absolutely it is possible. You can freely mix C++ code and QML. 

 

Look at this - https://developer.blackberry.com/cascades/documentation/dev/integrating_cpp_qml/index.html

 

Tom

--------------------------------------------------------------------------------------------
-- My Blackberry 10 app at http://blackberry.hubalek.net
-- My Android apps at http://android.hubalek.net
Contributor
nanyaran
Posts: 19
Registered: ‎06-21-2012
My Device: z10

Re: How can i use c++ and qml at the same time?

Thank you for your replying, and I wnt throught the page. I am still confused about how to do it at my program.

Basically, I have my own implemented object that in a cpp file and hpp file. Based on what that page said, if i want to pass an object to qml, I have to impelment another header file that contains what the page said. I dont clearly know what is necessary for me to include in my project and what is the portion that I am going to impelment by myself? If you could explain me more, it will be really appreciate. Thank you very much.

Developer
thubalek
Posts: 323
Registered: ‎10-01-2012
My Device: Dev Alpha C, Playbook 32 GB

Re: How can i use c++ and qml at the same time?

[ Edited ]

If you want to expose your C++ objects into QML then they need to implement some stuff. 

 

  • extend QObject
  • add Q_OBJECT macro
  • add Q_PROPERTY macro if you want to expose properties of the object
  • add Q_INVOKABLE macro if you wan to call objects methods from QML
  • you need to register them into QML in your apps' CPP file

Please note that QML is interpretted so it needs some interface to your C++ objects.

 

Please look at linked web page it is quite easy to implement.
 

--------------------------------------------------------------------------------------------
-- My Blackberry 10 app at http://blackberry.hubalek.net
-- My Android apps at http://android.hubalek.net
Developer
simon_hain
Posts: 16,282
Registered: ‎07-29-2008
My Device: Z10 LE, Z30, Passport

Re: How can i use c++ and qml at the same time?

this was also helpful for me to understand the Q_PROPERTY mechanism:
http://www.developer.nokia.com/Community/Wiki/How_to_use_Q_PROPERTY
----------------------------------------------------------
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
Contributor
nanyaran
Posts: 19
Registered: ‎06-21-2012
My Device: z10

Re: How can i use c++ and qml at the same time?

I tried that method, but it doesnt work for me. I may did something wrong or it may not work at my situation. If I have a cpp file that contains with objects. Currently, it can print variables on the console. Instead of that, i want to use cpp or qml (either one of them) to print variable changing on the display. Would this method work as well?

Contributor
doug1010
Posts: 17
Registered: ‎04-25-2011
My Device: Playbook and Bold 9700

Re: How can i use c++ and qml at the same time?

[ Edited ]

I am having a similar problem. So Hopefully it is ok to post it here.  I've been trying for a few days now after reading a few different examples.  I tried to make a simple example but just couldn't get it to work the way I want. I am clearly missing something :smileyhappy:

 

Any help would be greatly appreciated.  I am quite stuck.  :smileysad:

 

I read these.But I can't get it to work the way I'd like.  See my comments in the code below. Hopefully it's readable on here.

https://developer.blackberry.com/cascades/documentation/dev/integrating_cpp_qml/index.html

 

http://blog.tediscript.com/how-to-bind-imageview-in-qml-from-c-in-bb10-cascades/

 

http://apidocs.meego.com/1.2/qt4/qtbinding.html

 

http://upadhyayjiteshbb10.blogspot.ca/2012/12/blackberry-10-c-and-qml-integration.html

 

 

main.qml

import bb.cascades 1.0

Page {
    property alias labelText: label.text
    Container {
        Label {
            id: label
            text: "Label"
            objectName: "mLabel"
        }
        Button {
            
            text: "Button"
            onClicked: {
                MyApp.chgText("snarf");
            }
        }
    }
}

 

MyApp.cpp

 

#include "MyApp.hpp"

#include <bb/cascades/Application>
#include <bb/cascades/QmlDocument>
#include <bb/cascades/AbstractPane>
#include <QObject>

using namespace bb::cascades;

//~~~It works for me when I do it here~~~ MyApp::MyApp(bb::cascades::Application *app) : QObject(app) { QmlDocument *qml = QmlDocument::create("asset:///main.qml").parent(this); AbstractPane *root = qml->createRootObject<AbstractPane>(); //This works fine in here. root->setProperty("labelText", "New text"); app->setScene(root); }
//~~~But I would like to do it here. I'm not sure if it "worked" for me but it just wasn't updating the screen? I must be missing something... void MyApp::chgText(QString myString) { //should something like this go here? I tried it but it didn't work /* QmlDocument *qml = QmlDocument::create("asset:///main.qml").parent(this); AbstractPane *root = qml->createRootObject<AbstractPane>(); app->setScene(root); */

//so that this will work here? root->setProperty("labelText", myString); //Then there was an example like this with findChild. It didn't seem to work either. Not sure if "QDeclarativeView" works for cascades. But I think I tried another way with findchild and it still would not work. /* QDeclarativeView view(QUrl("main.qml")); view.show(); // get root object QObject *rootObject = dynamic_cast<QObject *>(view.rootObject()); // find element by name QObject *mLabel = rootObject->findChild<QObject *>(QString("mLabel")); if (mLabel) { // element found mLabel->setProperty("text", QString(myString)); } else { qDebug() << "'mLabel' not found"; } */ }

 MyApp.hpp

 

#ifndef MyApp_HPP_
#define MyApp_HPP_

#include <QObject>

namespace bb { namespace cascades { class Application; }}


class MyApp : public QObject
{
    Q_OBJECT
public:
    MyApp(bb::cascades::Application *app);
    Q_INVOKABLE void chgText(QString myString);
};


#endif /* MyApp_HPP_ */

 

 

Developer
kylefowler
Posts: 526
Registered: ‎05-17-2009
My Device: 9900

Re: How can i use c++ and qml at the same time?

Where are you trying to call chgText from? You probably need to set the context property to be able to call it.

qml->setContextProperty("app",this)

and then call chgText from your qml. app.chgText("what ever")

You dont want to create a new root when that method is called, you can just do app->scene()->setProperty("myprop",text)
Like all of my posts
Developer
thubalek
Posts: 323
Registered: ‎10-01-2012
My Device: Dev Alpha C, Playbook 32 GB

Re: How can i use c++ and qml at the same time?

This is IMHO simples way how to expose your business logic to QML:

 

BusinessLogic.h

 

#include <qobject.h>

class BusinessLogic: public QObject {

	Q_OBJECT
	Q_PROPERTY (int firstNumber READ firstNumber WRITE setFirstNumber NOTIFY firstNumberChanged)
	Q_PROPERTY (int secondNumber READ secondNumber WRITE setSecondNumber NOTIFY secondNumberChanged)
	Q_PROPERTY (int result READ result NOTIFY resultChanged)

public:
	BusinessLogic();
	virtual ~BusinessLogic();

	Q_INVOKABLE
	void calc() { mResult = mFirstNumber + mSecondNumber; emit resultChanged(); }

	int firstNumber() { return mFirstNumber; }
	int secondNumber() { return mSecondNumber; }

	int result() { return mResult; }

	void setFirstNumber(int n ) { mFirstNumber = n; }
	void setSecondNumber(int n ) { mSecondNumber = n; }

signals:
	void firstNumberChanged();
	void secondNumberChanged();
	void resultChanged();

private:
	int mFirstNumber;
	int mSecondNumber;
	int mResult;
};

 main.cpp

 

#include "BusinessLogic.h"

using namespace bb::cascades;

ExposingBizLogicSample::ExposingBizLogicSample(bb::cascades::Application *app)
: QObject(app)
{

	qmlRegisterType<BusinessLogic>("com.example", 1, 0, "BusinessLogic");

    // create scene document from main.qml asset
    // set parent to created document to ensure it exists for the whole application lifetime
    QmlDocument *qml = QmlDocument::create("asset:///main.qml").parent(this);

    // create root object for the UI
    AbstractPane *root = qml->createRootObject<AbstractPane>();
    // set created root object as a scene
    app->setScene(root);
}

 main.qml

// Default empty project template
import bb.cascades 1.0
import com.example 1.0

// creates one page with a label
Page {
    Container {
        TextField {
            id: firstNumberTextField
            hintText: "First Number"
            inputMode: TextFieldInputMode.NumbersAndPunctuation
        }
        TextField {
            id: secondNumberTextField
            hintText: "Second Number"
            inputMode: TextFieldInputMode.NumbersAndPunctuation
        }
        Label {
            id: resultLabel
            text: "No result at the moment"
        }
        Button {
            text: "Calc"
            onClicked: {
                businessLogic.firstNumber = firstNumberTextField.text
                businessLogic.secondNumber = secondNumberTextField.text
                businessLogic.calc();
                resultLabel.text = "Result is: " + businessLogic.result.toString();
            }
        }
    }
    attachedObjects: [
        BusinessLogic {
            id: businessLogic
        }
    ]
}

 

I'll put my working project on my GitHub later.

--------------------------------------------------------------------------------------------
-- My Blackberry 10 app at http://blackberry.hubalek.net
-- My Android apps at http://android.hubalek.net
Developer
thubalek
Posts: 323
Registered: ‎10-01-2012
My Device: Dev Alpha C, Playbook 32 GB

Re: How can i use c++ and qml at the same time?

Here is working project https://github.com/thubalek/bb10-exposing-business-logic-sample
--------------------------------------------------------------------------------------------
-- My Blackberry 10 app at http://blackberry.hubalek.net
-- My Android apps at http://android.hubalek.net