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
Raestloz
Posts: 93
Registered: ‎02-23-2011
My Device: Z10 STL100-1
Accepted Solution

Custom QML component not recognized

[ Edited ]

From my understanding, to create a custom QML component, you basically just create a new QML file, create the UI, and you can call the component by filename immediately. It doesn't work that way for my app.

 

Currently, I have in my asset folder the main.qml, and I want to create a custom Divider, so I create a new folder in asset called Common, and I create a new QML file with QML Container template, called CustomDivider.qml. So far, I'm following the cookbook example just fine.

 

The end result of my CustomDivider.qml is literally this:

 

import bb.cascades 1.0

 

Container{

Divider{

topMargin:10

bottomMargin:1

}

}

 

In my main.qml, I call CustomDivider{}, and it's not recognized by the IDE. When I run my app, the screen goes black, indicating that something's wrong

 

Can someone tell me what exactly is wrong?

BlackBerry Z10
Developer
mdodd
Posts: 188
Registered: ‎07-19-2012
My Device: Z10 LE

Re: Custom QML component not recognized

[ Edited ]

The QML parser can't find components in subdirectories by itself. Try creating a file called qmldir in the same folder as main.qml, and add the following:

 

CustomDivider ./Common/CustomDivider.qml

 qmldir acts as a nice way to index all your custom components, and telling the QML parser exactly where it can find each component. Any future custom components just need to be referenced in this qmldir file in the same format.



Did this post help you? If so, please make sure to "like" it!
Developer
simon_hain
Posts: 16,282
Registered: ‎07-29-2008
My Device: Z10 LE, Z30, Passport

Re: Custom QML component not recognized

you can also use import "foldername"
----------------------------------------------------------
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
Developer
Raestloz
Posts: 93
Registered: ‎02-23-2011
My Device: Z10 STL100-1

Re: Custom QML component not recognized

What extension would that "qmldir" be?

 

I looked around the Cookbook sample and I don't see any of that qmldir file. Strange. It is true that the dicumentation says that the component should be within the same directory as the caller, but in the cookbook sample, it seems to have found it by itself!

BlackBerry Z10
Developer
Raestloz
Posts: 93
Registered: ‎02-23-2011
My Device: Z10 STL100-1

Re: Custom QML component not recognized

That's it! the cookbook example indeed uses "import Common". Never thought of that, thanks!
BlackBerry Z10
Developer
mdodd
Posts: 188
Registered: ‎07-19-2012
My Device: Z10 LE

Re: Custom QML component not recognized

Thanks for the import suggestion, that seems like a better approach for smaller projects.

As for qmldir, there is no extension. It's literally just called qmldir.


Did this post help you? If so, please make sure to "like" it!