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

Posts: 136
Registered: ‎02-01-2009
My Device: Not Specified

How to customize the UI of exiting components



While there are lot of components that can be used right of the box, but is there any was of customizing their properties.


Example: If I want to change the background color of the selected and unselected SegmentedControl.


The Design page has a tutorial on creating a CustomQML component, but my query is more of Customizing the existing compoenent ( preferably ideas from both C++ and QML would be appreciated).



Posts: 849
Registered: ‎03-03-2011
My Device: Z10

Re: How to customize the UI of exiting components

Look at https://developer.blackberry.com/cascades/documentation/ui/custom_components/index.html where you can see how to create a custom check box.


If you want to extend, let's say, ToggleButton, you create a new qml file called, let's say,  MyToggleButton.qml and define a ToggleButton with all additional properties, signals, slots and functions.


In another qml then you can use it.




Leader of Ljubljana BlackBerry Developer Group
BlackBerry Certified Builder for Native Application Development
Posts: 136
Registered: ‎02-01-2009
My Device: Not Specified

Re: How to customize the UI of exiting components

While it surely guides if we have to create a new component all together.


However the simplest of the cases that I'm trying to do are with the exisiting compoenents.


Few examples to just give an idea and surely not exhaustive:

a. change the height of a button , while maintaining the text size

b. change the height of the Segment control - the overall height

c. change the width of the Options of the Segment control

d. change the cursor color from a text box

e. change the divider color on a list, and possibly customize it with the thickness.



Posts: 329
Registered: ‎05-07-2012
My Device: BB Alpha
My Carrier: N/A

Re: How to customize the UI of exiting components



a) Standardized; cannot be done, I believe there is an existing feature request for this

b) SegmentedControl: Not sure, I think this is standardized

c) Automatically computed for UI consistency

d) Standardized

e) Standardized


Most of these implemention decisions have been made to reinforce consistent user experiences throughout applications on the BB10 platform. It may be appropriate to create your custom controls for specific use cases, but given that these are the control properties your user base will most likely be familiar with, it may be a good idea to present them with these for the majority of your application.