Discussion :

[Feneck91]

Bonjour à tous et à toutes.

Dans le cadre de mon travail, j'étudie la possibilité d'utiliser des thèmes grâce à des fichier de styles (css).
Déjà, partout, il faut utiliser un fichier qrc qui nous embarque toutes les ressources dans l'exécutable. Très bien, rapide à l'exécution, mais si on veut laisser le choix à l'utilisateur d'ajouter un style par la suite, on est mort car tout est dans l'exe !

Après de longues recherches, j'ai trouvé une solution :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
/* Fichier CSS pour Theme 1 */
QPushButton#PushButtonStyled
{
	font-weight: bold;
	color: rgb(200, 200, 200);
	background-image: url(:/Theme1/Btn5757);
	width: 57px;
	height: 57px;
	min-width: 57px;
	min-height: 57px;
	max-width: 57px;
	max-height: 57px;
}

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
13
/* Fichier CSS pour Theme 2 */
QPushButton#PushButtonStyled
{
	font-weight: bold;
	color: rgb(200, 200, 200);
	background-image: url(Theme2:/Btn5758.png);
	width: 57px;
	height: 57px;
	min-width: 57px;
	min-height: 57px;
	max-width: 57px;
	max-height: 57px;
}

Le thème 1 est dans le qrc :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
<RCC>
    <qresource prefix="/Theme1">
        <file alias="Application.css">Resources/Theme1/Application.css</file>
        <file alias="Btn5757">Resources/Theme1/Btn5757.png</file>
        <file alias="Btn5757Off">Resources/Theme1/Btn5757Off.png</file>
        <file alias="Btn5757On">Resources/Theme1/Btn5757On.png</file>
    </qresource>
</RCC>

Dans le main, il suffit d'ajouter le Theme2 dans searchPath du QDir et d'utiliser partout Theme2:/nom_de_ma_ressource.
Le thème2 est alors uniquement sur le disque et ne fait pas parti du qrc (d'ailleurs les liens vers les images dans les deux css sont écrit différemment).

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
	QDir::addSearchPath("Theme2",QString("%1/%2").arg(qApp->applicationDirPath()).arg("Resources/Theme2"));
//	QFile styleFile("Theme2:/Application.css");
	QFile styleFile(QString(":/Theme1/Application.css"));
	if (styleFile.open(QIODevice::ReadOnly | QIODevice::Text))
	{
		qApp->setStyleSheet(QString::fromUtf8(styleFile.readAll()));
	}

Ce code fonctionne parfaitement.
Il suffit de mettre en commentaire le chargement du css du thème 1 ou deux pour que cela fonctionne.
Voilà, je donne ça comme ça, au cas où ce n'est pas la bonne façon de faire... S'il y a des solutions plus élégantes !!

Passons aux choses sérieuses : le problème c'est que l'application peut-être lancée sur plusieurs type de machines ayant des résolutions différentes...
Et donc un PPI (pixel per inch) différent. Le but ? Définir la taille d'un bouton de tel sorte qu'il ai toujours la même taille quelque soit la résolution et la taille de l'écran. Pourquoi ?
Notre application est tactile et il faut au moins une certaine taille pour que les boutons et autres widgets soient utilisable avec les doigts.
J'ai remarqué dans les exemples de Qt (C:\Qt\4.8.4\examples\widgets\stylesheet) que le fichier coffee.qss défini un QPushButton comme ceci :

Code :

Sélectionner tout - Visualiser dans une fenêtre à part

1
2
3
4
5
6
7
8
9
10
11
12
/* We provide a min-width and min-height for push buttons
   so that they look elegant regardless of the width of the text. */
QPushButton {
    background-color: palegoldenrod;
    border-width: 2px;
    border-color: darkkhaki;
    border-style: solid;
    border-radius: 5;
    padding: 3px;
    min-width: 9ex;
    min-height: 2.5ex;
}

Or, je ne trouve nulle part comment est défini ce ex (pour min-width et min-height). A quoi ex correspond-il ?
Y-a-t-il un moyen de travailler en ppi ?
Une des solutions est de mettre ppi dans le fichier css et à la relecture de le parser et de faire des calculs en fonction du ppi courant, mais ça m'étonnerais que Qt n'ai pas prévu ce type de problème.

Vous avez une idée ?

[LittleWhite]

Bonjour,

Pour votre introduction, vous pouvez choisir d'utiliser un QFileChooser, pour donner la possibilité à l'utilisateur de choisir directement le fichier.
J'ai trouvé ceci :

px: pixels
pt: the size of one point (i.e., 1/72 of an inch)
em: the em width of the font (i.e., the width of 'M')
ex: the ex width of the font (i.e., the height of 'x')

Il semble que le ppi, soit proche de "pt", non ?

[Feneck91]

Super, où as-tu trouvé ça ? Tu as un lien ?

Pour ppi, je disais ça comme ça (en fait DPI : dot per inch), mais pt a l'air en effet d'être ce que je recherche...
A condition bien entendu que ce pt soit modifiable en fonction de la résolution / taille de l'écran.
C'est bien entendu supporté par QT ?
Comment est-il initialisé ?

Pour le QFileChooser c'est pas la peine, il faut que l'application détecte les thèmes présents et qu'elle propose à l'utilisateur l'utilisation de tel ou tel thème.

Je vais faire des essais et je vous tient au courant !

EDIT : Bon, j'ai trouvé mais lorsque je mets max-width: 57pt; ça ne fonctionne pas. Je pense que le problème n'est pas simple !

[LittleWhite]

J'avais trouvé ça dans la doc : http://qt-project.org/doc/qt-4.8/sty...reference.html
Il faut chercher au niveau de Measure si je me rappelle bien.