CustomTkinter anstelle von Tkinter verwenden

von

Für die Erstellung einer grafischen Benutzeroberfläche steht in Python die Bibliothek Tkinter zur Verfügung. Darüber hinaus gibt es mit der UI-Bibliothek CustomTkinter eine moderne Variante, die hinsichtlich des Aussehens mehr Anpassungen erlaubt. In diesem Artikel wird gezeigt, wie mit CustomTKinter ein Fenster mit zwei Textfeldern (Entries), einem Button- und einem Label-Widget erstellt werden kann. Dabei wird ein objekt-orientierter Ansatz verwendet, d.h. eine Klasse mit der Bezeichnung MainWindow verwendet.

Den Anfang macht die Importanweisung für CustomTkinter:

import customtkinter as ctk

Als nächstes können wir mit der Klasse weitermachen:

class MainWindow:

def __init__(self):
    pass

In der __init__-Methode wird zunächst eine Instanz eines CustomTkinter-Fensters erstellt. Dieses Fenster enthält den Title „Custom Tkinter Window“:

# Initialize the main window
self.window = ctk.CTk()

# Set the title of the window
self.window.title("Custom Tkinter Window")

CustomTkinter ermöglicht mehr Gestaltungsmöglichkeiten der Widgets, zum Beispiel hinsichtlich der Farbe oder Schrift. In diesem Beispiel werden das Erscheinungsbild und das Farbschema definiert:

# Set the appearance mode to "dark" and the default color theme to "blue"
ctk.set_appearance_mode("system")
ctk.set_default_color_theme("green")

Dabei bedeutet „system“, dass das vom Betriebssystem genutzte Erscheinungsbild verwendet werden soll. Alternativ könnten hier „light“ oder „dark“ angegeben werden.

Der übrige Code entspricht dem Code in meinen bisherigen Tkinter-Beispielen mit dem Unterschied, dass bei der Erstellung der Widgets beispielsweise ctk.CTkLabel anstelle von tk.Label verwendet werden muss. Die Widgets für dieses Projekt werden also wie folgt erzeugt:

# Entry
self.first_input_field = ctk.CTkEntry(self.window)
self.second_input_field = ctk.CTkEntry(self.window)

# Button
self.calculate_button = ctk.CTkButton(
    self.window, text="Calculate", command=self.calculate
)

# Label
self.result_label = ctk.CTkLabel(self.window, text="Result label")

Unter Verwendung des Grid-Layoutmanagers sieht der komplette Code wie folgt aus, wobei ich in der Methode calculate() keine Logik für die Berechnung hinzugefügt habe.

# Import the required libraries
import customtkinter as ctk


class MainWindow:
    def __init__(self):

        # Initialize the main window
        self.window = ctk.CTk()
        # Set the title of the window
        self.window.title("Custom Tkinter Window")

        # Set the appearance mode to "dark" and the default color theme to "blue"
        ctk.set_appearance_mode("system")
        ctk.set_default_color_theme("green")

        # Set width and height of the window
        self.window.minsize(400, 200)
        self.window.maxsize(600, 400)
        window_width = 400
        window_height = 200

        # Get the screen dimension
        screen_width = self.window.winfo_screenwidth()
        screen_height = self.window.winfo_screenheight()

        # Find the center point
        center_x = int(screen_width / 2 - window_width / 2)
        center_y = int(screen_height / 2 - window_height / 2)

        # Set the position of the window to the center of the screen
        self.window.geometry(f"{window_width}x{window_height}+{center_x}+{center_y}")

        # Window is not resizable
        self.window.resizable(True, True)

        # Entry
        self.first_input_field = ctk.CTkEntry(self.window)
        self.second_input_field = ctk.CTkEntry(self.window)

        # Button
        self.calculate_button = ctk.CTkButton(
            self.window, text="Calculate", command=self.calculate
        )

        # Label
        self.result_label = ctk.CTkLabel(self.window, text="Result label")

        # Configure the main window
        self.window.grid_rowconfigure(2, weight=1)
        self.window.grid_columnconfigure((0, 1), weight=1)

        # Add entries to the content frame
        self.first_input_field.grid(column=0, row=0, padx=10, pady=(10, 5), sticky="ew")
        self.second_input_field.grid(
            column=1, row=0, padx=10, pady=(10, 5), sticky="ew"
        )

        # Add button
        self.calculate_button.grid(
            row=1, column=0, columnspan=2, padx=10, pady=5, sticky="ew"
        )

        # Add label
        self.result_label.grid(
            row=2, column=0, columnspan=2, padx=10, pady=(5, 10), sticky="ew"
        )

    def calculate(self):
        pass

    def mainloop(self):
        self.window.mainloop()


if __name__ == "__main__":
    app_instance = MainWindow()
    app_instance.mainloop()

Nach der Ausführung erhält man schließlich dieses Fenster:

CustomTkinter window
CustomTkinter-Fenster

CustomTkinter eröffnet hoch viel mehr Möglichkeiten. Ihr solltet auf jeden Fall einen Blick in die Dokumentation werfen. Der Entwickler Tom Schimansky hat auf der Homepepage des Projekts zudem ein Tutorial veröffentlicht.