Les composants graphiques usuels

Après avoir abordé la gestion d’un composant graphique simple dans la page Premier bouton, nous allons considérer ici quelques autres composants graphiques usuels : la case à cocher, l’étiquette et le champ de texte. Nous travaillons ici avec PyQt, voir Les bases de la programmation des interfaces graphiques avec Qt et PyQt.

Les cases à cocher - QCheckBox

Une case à cocher permet d’effectuer un choix (coché/non coché) pour une case. Elle est instanciée grâce à la classe QCheckBox.

class QCheckBox(text)

Case à cocher dont le constructeur reçoit un libellé qui sera affiché à côté de la case pour en préciser le rôle.

Paramètres:text (string) – libellé qui sera affiché à côté de la case
checkState()

Renvoie la valeur de l’état de la case

Retourne:Qt.Checked ou Qt.Unchecked
setCheckState(state)

Fixe la valeur de l’état de la case.

Paramètres:state – état à prendre : Qt.Checked ou Qt.Unchecked

Exemple

import sys
from PyQt4.QtGui import QApplication, QCheckBox

app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)

case = QCheckBox("Voici ma premiere case a cocher")
case.show()

app.exec_()

Gestion d’une case à cocher

On peut gérer une case à cocher de 2 façons :

  • en gérant une action sur la case
  • en cherchant à connaître son état (coché/non coché)

Gestion de l’action sur une case à cocher

Chaque action de l’utilisateur sur une case à cocher déclenche un événement (comme pour un bouton, sauf que cet événement se produit à la fois quand on coche ou on décoche la case).

On va connecter le signal stateChanged de la classe QCheckBox avec l’appel d’une fonction.

Exemple

import sys
from PyQt4.QtGui import QApplication, QCheckBox

def etat_change():
    print("action sur la case")
    
app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)

# creation de la case a cocher
case = QCheckBox("Voici ma premiere case a cocher")
# on connecte le signal "stateChanged" a la fonction etat_change
case.stateChanged.connect(etat_change)
# la case a cocher est rendue visible
case.show()

app.exec_()

Etat d’une case à cocher

On peut connaître l’état d’une case à cocher en utilisant la méthode checkState() de la classe QCheckBox. On peut aussi changer l’état de la case en utilisant la méthode setCheckState().

Exemple

import sys
from PyQt4.QtGui import QApplication, QWidget, QVBoxLayout, QCheckBox
from PyQt4.QtCore import Qt

class Fenetre(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        self.setWindowTitle("Ma fenetre")
  
        # creation du gestionnaire de mise en forme
        self.layout = QVBoxLayout()
        # on fixe le gestionnaire de mise en forme de la fenetre
        self.setLayout(self.layout)

        # creation de la case a cocher
        self.case = QCheckBox("Voici ma premiere case a cocher")
        # on connecte le signal "stateChanged" a la methode etat_change
        self.case.stateChanged.connect(self.etat_change)
        # ajout de la case a cocher au gestionnaire de mise en forme
        self.layout.addWidget(self.case)
 
        self.show()

    def etat_change(self):
        print("action sur la case")
        if self.case.checkState() == Qt.Checked:
            print("coche")
        else:
            print("decoche") 

app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)
fen = Fenetre()
app.exec_()

Autre exemple

Il également possible de connaître l’état de la case au travers de l’argument transmis à la fonction qui est appelée.

import sys
from PyQt4.QtGui import QApplication, QCheckBox
from PyQt4.QtCore import Qt

def etat_change(etat):
    print("action sur la case")
    if etat == Qt.Checked:
        print("coche")
    else:
        print("decoche") 
    
app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)

case = QCheckBox("Voici ma premiere case a  cocher")
case.stateChanged.connect(etat_change)
case.show()

app.exec_()

Les étiquettes - QLabel

Une étiquette (en anglais label) est un composant de type QLabel qui permet d’afficher un texte non éditable par l’utilisateur, mais que le programme peut faire évoluer.

Le constructeur de QLabel précise le texte initial.

class QLabel(text)

Etiquette dont le constructeur précise le texte initial.

Paramètres:text (string) – texte initial qui sera affiché
setText(text)

Modifie le texte de l’étiquette.

Paramètres:text – texte à afficher

Exemple

import sys
from PyQt4.QtGui import QApplication, QLabel

app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)

label = QLabel("Voici mon premier texte affiche avec un QLabel")
label.show()

app.exec_()

Exemple avec modification du texte

Le programme peut modifier à tout instant le texte d’un QLabel à l’aide de la méthode setText().

import sys
from PyQt4.QtGui import QApplication, QWidget, QPushButton, QVBoxLayout, QLabel

class Fenetre(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        self.setWindowTitle("Ma fenetre")

        self.n = 0 # attribut pour compter le nombre d'appui sur le bouton
  
        # mise en place du gestionnaire de mise en forme
        self.layout = QVBoxLayout()
        self.setLayout(self.layout)

        # mise en place du bouton
        self.bouton = QPushButton("mon bouton avec une gestion d'appui")
        self.bouton.clicked.connect(self.appui_bouton)
        self.layout.addWidget(self.bouton)
 
        # mise en place de l'etiquette
        self.label = QLabel("appui n = " + str(self.n))
        self.layout.addWidget(self.label)
        
        self.show()

    def appui_bouton(self):
        self.n = self.n + 1
        self.label.setText("appui n = " + str(self.n))

app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)
fen = Fenetre()
app.exec_()

Les champs de texte - QLineEdit

Un champ de texte (aussi appelé champ de saisie de texte) est une zone de texte éditable dans laquelle l’utilisateur peut entrer ou modifier un texte. Il s’obtient en instanciant un objet de type QLineEdit.

class QLineEdit(texte)

Champ de texte avec un texte initial facultatif.

Paramètres:texte (string) – texte initial qui sera affiché
text()

Renvoie de le texte contenu dans le champ de texte.

Retourne:texte contenu dans le champ de texte
Type retourné:string

Exemple :

import sys
from PyQt4.QtGui import QApplication, QLineEdit

app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)

champ = QLineEdit("Voici mon premier champ de texte")
champ.show()

app.exec_()

Exploitation usuelle d’un champ de texte

On peut connaître à tout moment le texte contenu dans un champ de texte à l’aide de la méthode text().

Par exemple, on peut associer au champ de texte un bouton destiné à en valider le contenu. Le prélèvement du texte se fera alors simplement lors de l’action sur ce bouton.

Exemple :

import sys
from PyQt4.QtGui import QApplication, QWidget, QPushButton, \
                        QVBoxLayout, QLabel, QLineEdit

class Fenetre(QWidget):
    def __init__(self):
        QWidget.__init__(self)
        self.setWindowTitle("Ma fenetre")
        self.resize(500,250)

        # mise en place du gestionnaire de mise en forme
        self.layout = QVBoxLayout()
        self.setLayout(self.layout)

        # mise en place du champ de texte
        self.champ = QLineEdit("Voici mon champ de texte")
        self.layout.addWidget(self.champ)
        
        # mise en place du bouton
        self.bouton = QPushButton("COPIE")
        self.bouton.clicked.connect(self.appui_bouton)
        self.layout.addWidget(self.bouton)
 
        # mise en place de l'etiquette
        self.label = QLabel()
        self.layout.addWidget(self.label)
        
        self.show()

    def appui_bouton(self):
        self.label.setText(self.champ.text())

app = QApplication.instance() 
if not app:
    app = QApplication(sys.argv)
fen = Fenetre()
app.exec_()