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

Thank you for visiting the BlackBerry Support Community Forums.

BlackBerry will be closing the BlackBerry Support Community Forums Device Forums on April 1st (Developers, see below)

BlackBerry remains committed to providing excellent customer support to our customers. We are delighted to direct you to the CrackBerry Forums, a well-established and thorough support channel, for continued BlackBerry support. Please visit http://forums.crackberry.com or http://crackberry.com/ask. You can also continue to visit BlackBerry Support or the BlackBerry Knowledge Base for official support options available for your BlackBerry Smartphone.

"When we launched CrackBerry.com 10 years ago, we set out to make it a fun and useful destination where BlackBerry Smartphone owners could share their excitement and learn to unleash the full potential of their BlackBerry. A decade later, the CrackBerry community is as active and passionate as ever and I know our knowledgeable members and volunteers will be excited to welcome and assist more BlackBerry owners with their questions."

- Kevin Michaluk, Founder, CrackBerry.com

Developers, for more information about the BlackBerry Developer Community please review Join the Conversation on the BlackBerry Developer Community Forums found on Inside BlackBerry.

Posts: 1,006
Registered: ‎05-22-2009
My Device: Not Specified

How do i add the background image to container



I want to know how do i add the assets image to the container background.Background of container supports paint,how do i add the image from assests folder to it?



Rakesh Shankar.P

Posts: 42
Registered: ‎05-30-2012
My Device: Simulator
My Carrier: Developer

Re: How do i add the background image to container

You don't add it directly to the Container. You add an ImageView into the container which will hold your image. The Container should have DockLayout set, whereas the ImageView can be centered. You might want to assure that the Container and the ImageView are the same size by setting the preferredWidth and preferredHeight properties of both. Be sure that the ImageView is the first child of the container, so that everything else (the true contents of the container) are above the ImageView. Take a look at DockLayout, and the first sample application they offer on the Cascades website.

Posts: 112
Registered: ‎10-10-2010
My Device: Torch
My Carrier: Verizon

Re: How do i add the background image to container

You can set the background color of it...


Container {
               background: Color.create ("#262626")



But I don't think there's any way of setting an image type directly to the container properties. You would have to use ImageView inside the container.


// snippet of some of my sample code

 Container {
                 background: Color.create ("#262626")

                 layout: StackLayout {
                 topPadding: 20
                 rightPadding: topPadding
                 leftPadding: rightPadding
                ImageView {
                imageSource: "asset:///images/header2.png"
                preferredWidth: 768
                preferredHeight: 250





If there is a way directly then I'm listening.

Android dev jumping ship to BB. Cascade newbie. Any help would be great. Miss the Visual Basic days.

Updated my pin
Posts: 1,006
Registered: ‎05-22-2009
My Device: Not Specified

Re: How do i add the background image to container

Hi Guys,I finally added the background as you suggested,I will share the code with you,Can anyone tel me ,is there any short way ,other than this

	/***Page Declaration****/
	Page *initialPage  = new Page();

    /***Layout Properties Declaration ****/
	DockLayoutProperties* layoutProperties = DockLayoutProperties::create()

	 stacklayoutProperties = StackLayoutProperties::create()

	//***Dock Layout for Getting Background***/ 

	basecontainer = Container::create()
	    	    	         .preferredSize(1024, 600)
	    	    	        .layout(new DockLayout());

	ImageView *background = new ImageView();
	Image backgroundAsset = Image(QUrl("asset:///images/background.png"));

	//**StackLayout which containes header with its Image View ***/
	Container *Rollcontainer = Container::create()
	    	    	        .layout( new StackLayout());

	StackLayout* myLayout = StackLayout::create()
	//**Another StackLayout which displays data contents of the page ***
	container = Container::create()


    ImageView *object1 = new ImageView();
    Image imageAsset = Image(QUrl("asset:///images/Header1.png"));
    //Image View added to the former stack Layout

    Label *label = Label::create().text("Demo Application");

    //Data Elements Will be added to Later Container


    QString buttonText = "DemoButton";
    Button *button = new Button();
    QObject::connect(button, SIGNAL(clicked()), this, SLOT(HandleClick()));

   // mRoot->push(initialPage);



Rakesh Shankar.P

Posts: 1,006
Registered: ‎05-22-2009
My Device: Not Specified

Re: How do i add the background image to container

Is there anyother thing that needs to be done properly can be suggested Smiley Happy

Posts: 26
Registered: ‎07-22-2012
My Device: Z10
My Carrier: Telstra

Re: How do i add the background image to container

You can do it using ImagePaint with respective ImagePaintDefinition and attachedObjects property of Container.


Here is sample code how to do it:


Container {
    id: rootContainer
    background: back.imagePaint
    attachedObjects: [
        ImagePaintDefinition {
            id: back
            repeatPattern: RepeatPattern.XY
            imageSource: "asset:///container/tiled/core16x16"




Check documentation here:



And source code on GitHub:


Posts: 350
Registered: ‎01-21-2011
My Device: Curve 8900 (Personal) / Bold 9650 (Work)
My Carrier: Regional

Re: How do i add the background image to container

Does anyone know of a way to just make the background image bleed, so to speak? I don't want it stretching to fill the container, or repeating, I just want the image in the container, and then to let other things overlap the image.
Posts: 107
Registered: ‎05-11-2011
My Device: BlackBerry Z10 LE
My Carrier: AirTel

Re: How do i add the background image to container





ImagePaint paint(Image(QUrl("asset:///Imagessplash_screen_portrait.png")));

Container * container = Container::create();