Background image displayed as tiles

[Dcqt]

Hi,

I am using the following code to set background image for a particular window but the image is displayed as tiles instead of stretch, am i missing some thing , please let me know any clues
@
widget -> setAttribute(Qt::WA_PaintOnScreen,true);
widget -> setStyleSheet("background-image: url(:/loc/img.jpeg)");
widget -> setSizePolicy(QSizePolicy(QSizePolicy::Expanding,QSizePolicy :: Preferred));
widget -> setBackgroundRole(QPalette :: Background);
@

[Sam]

Hi,

Use border-image instead of background-image in your stylesheet.

eg

@widget->setStyleSheet(“border-image: url(:/loc/img.jpeg)”);@

[Himanshu Rohilla]

@m_pPalette = new QPalette();
m_pPixmap = new QPixmap("YOUR IMAGE PATH");
m_pPalette->setBrush(QPalette::Background,QBrush(*m_pPixmap));
setPalette(*m_pPalette);
@
I used this code in my project. It works very fine.

[Dcqt]

[quote author="Sam" date="1364210415"]Hi,

Use border-image instead of background-image in your stylesheet.

eg

@widget->setStyleSheet(“border-image: url(:/loc/img.jpeg)”);@[/quote]

Thanks for the fast reply,now i am able to set the image as background.

but there is one more problem , when the background is set the button and label are displayed in a box with black color around them.

i am using the following code.
please suggest how to solve the issue, is thee any other approach for better control of buttons and labels.

Apps class:
@QVBoxLayout * vlayout = new QVBoxLayout();
QPushButton *button ;
QLabel *label ;

button = new PushButton(QIcon(":/junkie/hello.png"),NULL,this);
button -> setGeometry(0,3,50,50);
button -> setIconSize(button->rect().size());

 label = new QLabel(this,0);
 label -> setMaximumSize(80,15);
 label -> setText("Game"+ QString :: number(++i));
 label -> setAlignment(Qt ::AlignCenter );
 vlayout->addWidget(button);
 vlayout->addWidget(label);

@

Mainwindow class:

@
QGridLayout* Gh = new QGridLayout();
Apps *apps[9];
display -> setStyleSheet("border-image: url(:/images/img.jpeg)");
display-> setLayout(Gh);

for(int r = 0; r < 3; r++)
{
for(int c = 1; c <= 3; c++)
{
apps[r] = new Apps;
Gh -> addWidget(apps[r],r,c3,1,3);
apps[r] -> setGeometry(r,c3,100,100);
apps[r] -> setMaximumSize(100,100);
}
}
@

[Chris Kawa]

Those are Cascading Style Sheets, meaning that properties are propagated to children elements.
Just be more specific about which controls you are setting the style for, eg.
@
display -> setStyleSheet("
QPushButton { background: ... } /Style for all buttons/
#somElement { background: .... } /Style for one widget named someElement/
#somElement QLabel { backgound: ... } /Style for all label childrens of someElement/
");
@

[Dcqt]

I want to set the style for nwidg in the following program

mainwindow.cpp

@
#include "mainwindow.h"
#include <QBoxLayout>
#include <QGridLayout>
#include <QtGui>
#include <QString>

MainWindow::MainWindow(QWidget *parent)
: QMainWindow(parent)
{
QWidget *nwidg = new QWidget;
QGridLayout * mainLayout = new QGridLayout();
QPalette pl = QPalette();
Apps *apps[9];

setCentralWidget(nwidg);
nwidg->setLayout(mainLayout);
pl.setColor(QPalette::Window,Qt::black);
nwidg->setAttribute(Qt::WA_PaintOnScreen,true);
nwidg->setPalette(pl);
//mainLayout->addWidget(nwidg); this only adds the widget to layout

nwidg -> setMaximumSize(400,400);
nwidg -> setStyleSheet("border-image: url(:/Images/images.jpeg);");
this -> setMinimumSize(500,500);

for(int i = 0;i<3;i++){
    for (int j = 1 ; j<=3;j++){
        apps[i] = new Apps;
        mainLayout -> addWidget(apps[i],i,j*3,1,3);
        apps[i]  -> setGeometry(i,j,100,100);
        apps[i]  -> setMaximumSize(100,100);

    }
}

}

MainWindow::~MainWindow()
{

}

Apps::Apps(QWidget *parent)
: QWidget(parent)
{
QVBoxLayout * vlayout = new QVBoxLayout();
QPushButton *button ;
QLabel *label ;
static int i;

 button = new QPushButton(QIcon(":/Images/qt.png"),NULL,this);
 button -> setGeometry(0,3,100,100);
 button -> setIconSize(button->rect().size());

 label = new QLabel(this,0);
 label -> setMaximumSize(80,10);
 label -> setText("Game"+ QString :: number(++i));
 label -> setAlignment(Qt ::AlignCenter );

 vlayout->addWidget(button);
 vlayout->addWidget(label);
 setLayout(vlayout);

}

Apps::~Apps()
{

}
@

mainwindow.h

@
#ifndef MAINWINDOW_H
#define MAINWINDOW_H

#include <QtGui/QMainWindow>

class MainWindow : public QMainWindow
{
Q_OBJECT

public:
MainWindow(QWidget *parent = 0);
~MainWindow();
};

#endif // MAINWINDOW_H

class Apps : public QWidget
{
Q_OBJECT
public:
Apps(QWidget *parent = 0);
~Apps();

};
@

As long as this code is not present the UI looks fine
@
nwidg -> setStyleSheet("border-image: url(/Images/images.jpeg);");
@

but after adding the above code the buttons and lables are displayed with back color border.
I want to make my UI look similar to any normal mobile phone UI(Apps images are transparent with background).

I also want few more hints on how to achieve the following.

1.upon lanuching this window the first app should be selected (should be difrentiated with other)

2.As the number of apps increasing the UI is loosing its look
i need to display only 9 apps first , using key arrows up-down/right-left
want to navigate through apps.
0th row apps should be replaaced by 1st row, and 1st row should be replaed by 2nd row and 3rd row should be added in placed of 2nd row.
launch the application when press on Enter.

3.no of apps is decided dynamically so need to remove the hard coded loops
i am downloading the apps into specified folder, so i want to select a png from the app add that as display image for the app

with the approach what i followed here will i be able to control the apps the way i want , OR any other easy way to achieve this

please suggest.

ohhh, 1 more thing .. can i add my scrren shots or images to post , here i found no way. when i click on picture its giving some box with http address, but i dont hav one.