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
Highlighted
Developer
Posts: 163
Registered: ‎12-06-2012
My Device: Z10, Q10
My Carrier: BlackBerry
Accepted Solution

How to set a jpg or png file as the backgournd of a page

I tried to use ImagePaintDefinition to set a background of a container and added that container in the page. But doesn't work. Also it needs to have picture dimension as power of 2. Is there any way I can set suppose 768X 1280 dimensional picture as my Page background? Thanks.

Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Re: How to set a jpg or png file as the backgournd of a page

Normally I add a container to the page and set the background of the container using ImagePaintDefinition. This should work. If this isn't working for you, could you show us the code you were using and describe how it wasn't working?

Developer
Posts: 656
Registered: ‎02-03-2010
My Device: Z10 LE
My Carrier: Rogers

Re: How to set a jpg or png file as the backgournd of a page

You can try this :  

 

 
Page

{
    Container {
            layout: DockLayout {
            }
            ImageView {

                imageSource: "yourimagenae.png"
                verticalAlignment: VerticalAlignment.Top
                horizontalAlignment: HorizontalAlignment.Left
            }
          /*** then the rest of your elements here **/

     ]
}

 


Steven Kader at JaredCo
   Follow me on Twitter    |     Mipixi.com :  Web App for Photo Sharing
Developer
Posts: 163
Registered: ‎12-06-2012
My Device: Z10, Q10
My Carrier: BlackBerry

Re: How to set a jpg or png file as the backgournd of a page

hi my code is,

 

list = new ListView;;
	list->setDataModel(&dataModel);


	Container *container = new Container();


	container->add(list);

	ImagePaint paint(QUrl("app/native/assets/background.png"), RepeatPattern::XY);
	container->setBackground(paint);


	Page *page = new Page();
	page->setContent(container);

	ActionItem *nextPage =  ActionItem::create().title("Next");
	page->addAction(nextPage, ActionBarPlacement::OnBar);


	TitleBar* titleBar = TitleBar::create().visibility(ChromeVisibility::Visible).title(QString("Question of ")+QString::number(id+1)+QString("/")+QString::number(4));

	page->setTitleBar(titleBar);

	nav = new NavigationPane;
	nav->push(page);
	app->setScene(nav);
	connect(nextPage,SIGNAL(triggered()),this,SLOT(nextPage()));
	connect(list, SIGNAL(triggered(const QVariantList)), this,SLOT(onTriggered(const QVariantList)));

 Doesn't work Smiley Sad

Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Re: How to set a jpg or png file as the backgournd of a page

It appears there's nothing in the container and because you haven't set a preferred width and height, the container's size is zero.
Developer
Posts: 656
Registered: ‎02-03-2010
My Device: Z10 LE
My Carrier: Rogers

Re: How to set a jpg or png file as the backgournd of a page

I recommend you try using QML instead...mouth the preview you can quickly learn what works and doesn't. I have some apps fine completely in QML. Much easier and faster

Steven Kader at JaredCo
   Follow me on Twitter    |     Mipixi.com :  Web App for Photo Sharing
Developer
Posts: 163
Registered: ‎12-06-2012
My Device: Z10, Q10
My Carrier: BlackBerry

Re: How to set a jpg or png file as the backgournd of a page

I changed the container creation line to this
Container *container = Container::create().preferredSize(1024.0,1024.0); But still it doesn't show up. I can see the the datas from datamodel fine. But there is a white background. Is there any size constraints on the image?
Developer
Posts: 541
Registered: ‎05-17-2009
My Device: Not Specified

Re: How to set a jpg or png file as the backgournd of a page

It looks like the url is formatted incorrectly. I believe if you make it "asset:///background.png" it should work. The url format you were using was valid only in a beta SDK.
Developer
Posts: 163
Registered: ‎12-06-2012
My Device: Z10, Q10
My Carrier: BlackBerry

Re: How to set a jpg or png file as the backgournd of a page

Thanks so much Smiley Very Happy It works perfectly Smiley Happy