| Les deux révisions précédentesRévision précédenteProchaine révision | Révision précédente |
| issue194:python [2023/07/03 08:13] – d52fr | issue194:python [2023/07/03 14:42] (Version actuelle) – auntiee |
|---|
| Le mois dernier, nous avons essayé de jouer quelques tours sur le widget TNotebook de ttk avec le module Python de manipulation de style que j'ai écrit et qui s'appelle « mystyles_dark.py ». J'ai également promis que je me concentrerais davantage sur ce module afin de donner un aperçu de son fonctionnement. | Le mois dernier, nous avons essayé de jouer quelques tours sur le widget TNotebook de ttk avec le module Python de manipulation de style que j'ai écrit et qui s'appelle « mystyles_dark.py ». J'ai également promis que je me concentrerais davantage sur ce module afin de donner un aperçu de son fonctionnement. |
| |
| Depuis, j'ai modifié le fichier du thème pour qu'il ne soit pas aussi sombre, et pour qu'il puisse faire d'autres choses que l'original ne pouvait pas faire. Le nouveau fichier s'appelle « mystyles_notsodark.py », et c'est sur lui que nous allons nous concentrer dans l'article de ce mois-ci. Les fichiers seront disponibles dans mon dépôt, que je partagerai avec vous à la fin de l'article. | Depuis, j'ai modifié le fichier du thème pour qu'il ne soit pas aussi sombre, et pour qu'il puisse faire d'autres choses que l'original ne pouvait pas faire. Le nouveau fichier s'appelle « mystyles_notsodark.py », et c'est sur cela que nous allons nous concentrer dans l'article de ce mois-ci. Les fichiers seront disponibles dans mon dépôt, que je partagerai avec vous à la fin de l'article. |
| |
| **The original code was the starting point of my notsodark Tcl theme. I use the styling module as my testbed to make sure that I could make things work using Python, since my knowledge of Tcl/Tk was and still is limited. I looked at almost every Tcl theme I could, including the source for the four Linux “default” themes alt, clam, classic and of course default. I have to admit, it took me a while to figure out how to convert much of the Tcl code into Python. I had various copies of my beginning Tcl books open at the same time as I was trying to code the Python file and I had many false starts, but I eventually figured it all out. Eventually, I got the color schemes all worked out to something that I liked. | **The original code was the starting point of my notsodark Tcl theme. I use the styling module as my testbed to make sure that I could make things work using Python, since my knowledge of Tcl/Tk was and still is limited. I looked at almost every Tcl theme I could, including the source for the four Linux “default” themes alt, clam, classic and of course default. I have to admit, it took me a while to figure out how to convert much of the Tcl code into Python. I had various copies of my beginning Tcl books open at the same time as I was trying to code the Python file and I had many false starts, but I eventually figured it all out. Eventually, I got the color schemes all worked out to something that I liked. |
| That’s enough history, now let’s get started.** | That’s enough history, now let’s get started.** |
| |
| Le code original est le point de départ de mon thème Tcl notsodark. J'ai utilisé le module de style comme banc d'essai pour m'assurer que je pouvais faire fonctionner les choses avec Python, puisque ma connaissance de Tcl/Tk était et est toujours limitée. J'ai examiné presque tous les thèmes Tcl possibles, y compris les sources des quatre thèmes Linux « par défaut » alt, clam, classic et, bien sûr, default. Je dois admettre qu'il m'a fallu un certain temps pour comprendre comment convertir une grande partie du code Tcl en Python. J'avais plusieurs copies de mes livres de début de Tcl ouverts en même temps que j'essayais de coder le fichier Python et j'ai eu de nombreux faux départs, mais j'ai fini par tout comprendre. Finalement, j'ai réussi à mettre au point un schéma de couleurs qui me plaisait. | Le code original est le point de départ de mon thème Tcl notsodark. J'ai utilisé le module de style comme banc d'essai pour m'assurer que je pouvais faire fonctionner les choses avec Python, puisque ma connaissance de Tcl/Tk était et est toujours limitée. J'ai examiné presque tous les thèmes Tcl possibles, y compris les sources des quatre thèmes Linux « par défaut » alt, clam, classic et, bien sûr, default. Je dois admettre qu'il m'a fallu un certain temps pour comprendre comment convertir une grande partie du code Tcl en Python. J'avais plusieurs copies de mes livres de Tcl pour débutants ouverts en même temps que j'essayais de coder le fichier Python et j'ai eu de nombreux faux départs, mais j'ai fini par tout comprendre. Finalement, j'ai réussi à mettre au point un schéma de couleurs qui me plaisait. |
| |
| Assez d'histoire, maintenant commençons. | Assez d'histoire, maintenant commençons. |
| import os.path | import os.path |
| |
| Puisque nous créons un module « autonome », nous devons importer sys et tkinter. L'utilisation de os.path est nécessaire car nous allons rendre le module agnostique au niveau du système d'exploitation (capable de fonctionner sous Windows, Linux et Mac), et nous voulons pouvoir accéder au dossier Assets quel que soit l'endroit où l'utilisateur a installé notre module ; nous pouvons utiliser la méthode os.path.join pour concaténer le séparateur de répertoire correct ("/" ou "\") aux endroits corrects. L'autre chose que nous devons importer est un fichier vide appelé shared.py. Nous l'utilisons normalement pour permettre aux différents modules d'un programme de communiquer entre eux. Cependant, il y a un avantage secondaire à cela, qui deviendra clair dans un petit moment. | Puisque nous créons un module « autonome », nous devons importer sys et tkinter. L'utilisation de os.path est nécessaire car nous allons rendre le module agnostique au niveau du système d'exploitation (capable de fonctionner sous Windows, Linux et Mac), et nous voulons pouvoir accéder au dossier Assets quel que soit l'endroit où l'utilisateur a installé notre module. Nous pouvons utiliser la méthode os.path.join pour concaténer le séparateur de répertoire correct (« / » ou « \ ») aux endroits corrects. L'autre chose que nous devons importer est un fichier vide appelé shared.py. Nous l'utilisons normalement pour permettre aux différents modules d'un programme de communiquer entre eux. Cependant, il y a un avantage secondaire à cela, qui deviendra clair dans un petit moment. |
| |
| |
| We can use the location variable to provide the proper base path when we call the os.path.join statements later on.** | We can use the location variable to provide the proper base path when we call the os.path.join statements later on.** |
| |
| Nous plaçons les trois lignes suivantes juste après la section import afin que les valeurs soient, par portée, implicitement globales. Cela signifie qu'elles sont disponibles pour toutes les fonctions du module tant qu'elles ne sont pas modifiées dans l'une de ces fonctions. Nous devons faire attention à cela (voir ci-dessous). | Nous plaçons les trois lignes suivantes juste après la section import afin que les valeurs soient implicitement globales par définition. Cela signifie qu'elles sont disponibles pour toutes les fonctions du module tant qu'elles ne sont pas modifiées dans l'une de ces fonctions. Nous devons faire attention à cela (voir ci-dessous). |
| |
| Nous pouvons utiliser la variable location pour fournir le chemin de base approprié lorsque nous appelons les instructions os.path.join plus tard. | Nous pouvons utiliser la variable location pour fournir le chemin de base approprié lorsque nous appelons les instructions os.path.join plus tard. |
| La prochaine étape consiste à déclarer une carte pour le style racine qui contrôle la façon dont les couleurs des widgets réagiront aux différents états tels que désactivé, actif, en focus, non en focus, etc. Chaque élément doit être une liste de tuples contenant l'état suivi de la couleur, même si vous ne définissez qu'un seul état (en bas à droite). | La prochaine étape consiste à déclarer une carte pour le style racine qui contrôle la façon dont les couleurs des widgets réagiront aux différents états tels que désactivé, actif, en focus, non en focus, etc. Chaque élément doit être une liste de tuples contenant l'état suivi de la couleur, même si vous ne définissez qu'un seul état (en bas à droite). |
| |
| Nous pouvons maintenant commencer à définir les styles pour chaque widget (au milieu). Je ne vous montrerai que quelques définitions de choix pour vous donner une idée de la façon de procéder. Voici le style du bouton T. | Nous pouvons maintenant commencer à définir les styles pour chaque widget (au milieu). Je ne vous montrerai que quelques définitions de choix pour vous donner une idée de la façon de procéder. Voici le style du Tbutton (bouton T). |
| |
| |
| The TButton also has a special style built in called Toolbutton. This, as well, can be overridden by using the same configure and map settings (top right).** | The TButton also has a special style built in called Toolbutton. This, as well, can be overridden by using the same configure and map settings (top right).** |
| |
| Comme précédemment, il peut y avoir une section pour la carte de l'État à colorier, puis une section pour l'aspect « normal ». Si vous souhaitez créer un style pour tous les widgets d'une classe particulière, comme dans l'extrait ci-dessus, vous devez utiliser le nom du style par défaut. Ce nom commence presque toujours par un « T ». | Comme précédemment, il peut y avoir une section pour la carte de l'état à colorier, puis une section pour l'aspect « normal ». Si vous souhaitez créer un style pour tous les widgets d'une classe particulière, comme dans l'extrait ci-dessus, vous devez utiliser le nom du style par défaut. Ce nom commence presque toujours par un « T ». |
| |
| Lorsque nous voulons définir des attributs que nous ne pouvons pas définir normalement, nous devons utiliser la méthode style.configure. Celle-ci nous permet de définir des éléments tels que les couleurs d'arrière-plan et d'avant-plan, le remplissage (une liste contenant jusqu'à quatre entiers pour la gauche, le haut, la droite et le bas dans cet ordre), la police de caractères, etc. | Lorsque nous voulons définir des attributs que nous ne pouvons pas définir normalement, nous devons utiliser la méthode style.configure. Celle-ci nous permet de définir des éléments tels que les couleurs d'arrière-plan et d'avant-plan, le remplissage (une liste contenant jusqu'à quatre entiers pour la gauche, le haut, la droite et le bas dans cet ordre), la police de caractères, etc. |
| Ensuite, nous devons créer un élément personnalisé qui contient les informations sur l'image utilisée pour chaque état. Bien entendu, ces informations changeront en fonction des différents widgets et des différentes parties de l'élément. Vous pouvez créer des images qui seront utilisées pour contrôler la forme du widget et ainsi de suite (page suivante, en haut à droite). | Ensuite, nous devons créer un élément personnalisé qui contient les informations sur l'image utilisée pour chaque état. Bien entendu, ces informations changeront en fonction des différents widgets et des différentes parties de l'élément. Vous pouvez créer des images qui seront utilisées pour contrôler la forme du widget et ainsi de suite (page suivante, en haut à droite). |
| |
| Enfin, nous devons définir la mise en page. C'est la partie VRAIMENT difficile. En général, un widget se compose d'un ou plusieurs éléments. Pour le bouton TCheckbutton, il y a une bordure, un padding, un focus et une étiquette. C'est variable suivant la classe du widget (page suivante, en bas à droite) | Enfin, nous devons définir la mise en page. C'est la partie VRAIMENT difficile. En général, un widget se compose d'un ou plusieurs éléments. Pour le bouton TCheckbutton, il y a une bordure, un padding (remplissage), un focus et une étiquette. C'est variable suivant la classe du widget (page suivante, en bas à droite) |
| |
| |
| Je ne vais pas passer en revue tous les widgets ttk gérés par le module de style. J'ai essayé de traiter tous les widgets ttk standard disponibles. | Je ne vais pas passer en revue tous les widgets ttk gérés par le module de style. J'ai essayé de traiter tous les widgets ttk standard disponibles. |
| |
| Lors de la création du thème Tcl, j'ai ajouté une fonction qui semblait importante, mais je ne savais pas vraiment ce qu'elle faisait. Elle ne provoquait aucune erreur, donc je l'ai laissée. Finalement, j'ai essayé de nettoyer le code inutile et je suis revenu à la fonction dont je ne savais pas ce qu'elle faisait. Elle n'était pas dans tous les thèmes que j'ai regardés dans mon processus d'apprentissage, alors j'ai décidé de chercher à quoi elle servait. Voici le code (en haut à droite). | Lors de la création du thème Tcl, j'ai ajouté une fonction qui semblait importante, mais je ne savais pas vraiment ce qu'elle faisait. Elle ne provoquait aucune erreur, donc je l'ai laissée. Finalement, j'ai essayé de nettoyer le code inutile et je suis revenu à la fonction dont je ne savais pas ce qu'elle faisait. Parce qu'elle n'était pas dans tous les thèmes que j'ai regardés dans mon processus d'apprentissage, j'ai décidé de chercher à quoi elle servait. Voici le code (en haut à droite). |
| |
| |
| In our demo program, we will skip all the normal imports and jump right into the startup function (bottom right).** | In our demo program, we will skip all the normal imports and jump right into the startup function (bottom right).** |
| |
| Il s'avère que la fonction tk_setPalette a été créée pour permettre aux widgets Tk normalement non-thématisables d'avoir un pseudo-thème appliqué en laissant la fonction tk_setPalette remplacer la base de données normale pour les widgets Tk. Nous en verrons plus lorsque nous entrerons dans le code du programme de démonstration, ce que nous allons faire maintenant. | Il s'avère que la fonction tk_setPalette a été créée pour permettre aux widgets Tk normalement non-thématisables d'avoir un pseudo-thème appliqué en laissant la fonction tk_setPalette outrepasser la base de données normale pour les widgets Tk. Nous en verrons plus lorsque nous entrerons dans le code du programme de démonstration, ce que nous allons faire maintenant. |
| |
| Voici à quoi ressemble la version sur PAGE designer du programme de démonstration. | Voici à quoi ressemble la version sur PAGE designer du programme de démonstration. |
| Here is the fix_TLabels function. I get the background color from the styling module, then create a list of all the TLabel aliases. Then I simply walk through the list, applying the background color (next page, top right).** | Here is the fix_TLabels function. I get the background color from the styling module, then create a list of all the TLabel aliases. Then I simply walk through the list, applying the background color (next page, top right).** |
| |
| Comme vous pouvez le voir, nous définissons notre instance sty de l'objet ttk.Style, puis nous appelons la fonction create_styles du module de stylisme. Malheureusement, les ttk.TLabels n'aiment pas être modifiés par un style, nous utilisons donc la fonction fix_Tlabels pour définir les couleurs d'avant-plan et d'arrière-plan appropriées. Ensuite, je mets des données dans les Tk.Listbox et Tk.Textbox et, enfin, je démarre la TProgressbar qui a été mise en mode Indéterminé dans PAGE. | Comme vous pouvez le voir, nous définissons notre instance sty de l'objet ttk.Style, puis nous appelons la fonction create_styles du module de stylisme. Malheureusement, les ttk.TLabels n'aiment pas être modifiés par un style ; aussi, nous utilisons la fonction fix_Tlabels pour définir les couleurs d'avant-plan et d'arrière-plan appropriées. Ensuite, je mets des données dans les Tk.Listbox et Tk.Textbox et, enfin, je démarre la TProgressbar qui a été mise en mode Indeterminate (Indéterminé) dans PAGE. |
| |
| Voici la fonction fix_TLabels. Je récupère la couleur d'arrière-plan dans le module de style, puis je crée une liste de tous les alias de TLabel. Ensuite, je parcours simplement la liste, en appliquant la couleur de fond (page suivante, en haut à droite). | Voici la fonction fix_TLabels. Je récupère la couleur d'arrière-plan dans le module de style, puis je crée une liste de tous les alias de TLabel. Ensuite, je parcours simplement la liste, en appliquant la couleur de fond (page suivante, en haut à droite). |
| Si vous regardez l'image du programme dans le concepteur de pages, vous remarquerez deux cases à cocher en haut du formulaire, près du côté gauche. L'une est intitulée « Afficher la surprise » et l'autre « Désactiver les widgets ». Nous allons d'abord nous occuper de la fonction de rappel « Désactiver les widgets » (en bas à droite). | Si vous regardez l'image du programme dans le concepteur de pages, vous remarquerez deux cases à cocher en haut du formulaire, près du côté gauche. L'une est intitulée « Afficher la surprise » et l'autre « Désactiver les widgets ». Nous allons d'abord nous occuper de la fonction de rappel « Désactiver les widgets » (en bas à droite). |
| |
| Encore une fois, je ne vais afficher qu'une partie de la liste des widgets. Comme je l'ai fait dans la fonction fix_Tlabels, j'ai créé une liste des alias des widgets dont je veux pouvoir contrôler les états normal et désactivé. De cette façon, je peux démontrer la façon dont les widgets réagissent dans les différents états. La liste actuelle contient à la fois les widgets Tk et ttk qui réagissent à l'état désactivé. J'utilise la variable che56, qui est assignée par PAGE pour savoir si la case à cocher est cochée ou non. En fonction de cela, je parcours la liste des widgets et je règle chaque widget dans l'état, désactivé ou normal. | A nouveau, je ne vais afficher qu'une partie de la liste des widgets. Comme je l'ai fait dans la fonction fix_Tlabels, j'ai créé une liste des alias des widgets dont je veux pouvoir contrôler les états normal et désactivé. De cette façon, je peux démontrer la façon dont les widgets réagissent dans les différents états. La liste actuelle contient à la fois les widgets Tk et ttk qui réagissent quand ils sont désactivés. J'utilise la variable che56, qui est assignée par PAGE pour savoir si la case à cocher est cochée ou non. En fonction de cela, je parcours la liste des widgets et je règle chaque widget dans l'état, désactivé ou normal. |
| |
| |
| Ci-dessous, voici le programme en cours d'exécution. | Ci-dessous, voici le programme en cours d'exécution. |
| |
| Vous pouvez maintenant voir le module de style en action. Les boutons TCheckbuttons et TRadiobuttons utilisent les graphiques personnalisés, et les autres widgets ttk ont maintenant le style commun. J'ai paramétré le TCombobox, le widget TEntry et le TSpinbox pour qu'ils aient une couleur d'arrière-plan complémentaire qui ne soit pas le blanc éclatant standard. | Vous pouvez maintenant voir le module de style en action. Les boutons TCheckbuttons et TRadiobuttons utilisent les graphiques personnalisés et les autres widgets ttk ont maintenant le style commun. J'ai paramétré le TCombobox, le widget TEntry et le TSpinbox pour qu'ils aient une couleur d'arrière-plan complémentaire qui ne soit pas le blanc éclatant standard. |
| |
| Nous pouvons maintenant examiner le rappel du bouton « Afficher la surprise ». L'idée ici est d'appeler la fonction tk_setPalette pour montrer la possibilité d'utiliser le style sur les widgets Tk (page suivante, en haut à droite). | Nous pouvons maintenant examiner le rappel du bouton « Afficher la surprise ». L'idée ici est d'appeler la fonction tk_setPalette pour montrer la possibilité d'utiliser le style sur les widgets Tk (page suivante, en haut à droite). |
| |
| Pour pouvoir remettre la palette aux couleurs « normales » de Tk, j'ai dû dupliquer la fonction set_palette et remettre les couleurs aux couleurs standard. | Pour pouvoir remettre la palette aux couleurs « normales » de Tk, j'ai dû dupliquer la fonction set_palette, puis remettre les couleurs aux couleurs standard. |
| |
| |
| Until next time, as always; stay safe, healthy, positive and creative!** | Until next time, as always; stay safe, healthy, positive and creative!** |
| |
| Voici ce qui se passe lorsque le bouton « Afficher la surprise » et le bouton « Désactiver les widgets » sont cochés en même temps. | Voici ce qui se passe lorsque le bouton « Show The Surprise » (Afficher la surprise) et le bouton « Disable Wedgets » (Désactiver les widgets) sont cochés en même temps. |
| |
| Tous les widgets sont maintenant non seulement thématisés, mais aussi désactivés, et vous pouvez voir qu'il est assez évident que les widgets sont désactivés. Même si le bouton radio ou les boutons de contrôle sont sélectionnés, vous pouvez toujours les reconnaître. | Tous les widgets sont maintenant non seulement thématisés, mais aussi désactivés ; vous pouvez voir qu'il est assez évident que les widgets sont désactivés. Même si le bouton radio ou les boutons de contrôle sont sélectionnés, vous pouvez toujours reconnaître ceux qui sont sélectionnés. |
| |
| La fonction set_Palette permet également de définir la couleur de la barre de menus. | La fonction set_Palette permet également de définir la couleur de la barre de menus. |
| |
| |
| Tous les fichiers de ce projet se trouvent dans mon dépôt à l'adresse https://github.com/gregwa1953/FCM194. | Tous les fichiers de ce projet se trouvent dans mon dépôt à l'adresse https://github.com/gregwa1953/FCM194. |
| First, we need to define the images we want to use.** | First, we need to define the images we want to use.** |
| |
| Ça m'a pris du temps pour comprendre comment faire fonctionner toute l'image personnalisée. | Ça m'a pris du temps pour comprendre comment faire fonctionner toute la personnalisation d'une image. |
| D'abord, nous devons définir les images que nous voulons utiliser. | D'abord, nous devons définir les images que nous voulons utiliser. |
| |
| // Traduction de la ligne noire de l'encadré p 20// | // Traduction de la ligne noire de l'encadré p 20// |
| |
| **Then we can handle the basic widget configuration of colors and so on.* | **Then we can handle the basic widget configuration of colors and so on.** |
| |
| Ensuite, nous pouvons manipuler la configuration du widget de base et ainsi de suite. | Ensuite, nous pouvons gérer la configuration des couleurs du widget de base et ainsi de suite. |
