Python Tkinter GUI プログラミングでフレーム切り替えを実装する方法

1. Frame の tkraise() メソッドの概要

通常、Tkinter アプリケーションは複数の Frame で構成されます。また、ユーザーの選択に関連するフレームを表示するには、フレームを切り替える必要があることがよくあります。

Tkinter を使用すると、フレームをスタックすることができます。特定のフレームを表示するには、1 つのフレームを別のフレームの上に重ねて配置します。上部のフレームが表示されます。

フレームを最上部に配置するには、以下に示すように、フレーム ウィジェットの tkraise() メソッドを使用できます:

frame.tkraise()

2、tkraise の使用例

次のとおりです。温度変換の小さなアプリケーションは、華氏温度と摂氏温度に 2 つの異なるフレームを使用します。UI ウィンドウは次のように構成されます:

ConverterFrame には 2 つのインスタンスがあり、1 つは変換用です華氏から華氏への温度 温度を摂氏に変換し、もう 1 つで温度を摂氏から華氏に変換します。

最初のステップでは、2 つの静的メソッドを使用してTemperatureConverter クラスを定義します。華氏から摂氏と摂氏から華氏。

class TemperatureConverter:
    @staticmethod
    def fahrenheit_to_celsius(f, format=True):
        result = (f - 32) * 5/9
        if format:
            return f'{f} Fahrenheit = {result:.2f} Celsius'
        return result

    @staticmethod
    def celsius_to_fahrenheit(c, format=True):
        result = c * 9/5 + 32
        if format:
            return f'{c} Celsius = {result:.2f} Fahrenheit'
        return result

fahrenheit_to_celsius メソッドと celsius_to_fahrenheit メソッドは、2 番目の引数が省略されている場合、または True が渡されている場合、フォーマットされた文字列を返します。それ以外の場合は、結果を数値として返します。

2 番目のステップでは、温度を華氏から摂氏に、またはその逆に変換するための UI を表示する ConverterFrame を定義します。

これを行うには、次のパラメータを __init__() メソッドに追加して、ConverterFrame をより柔軟にする必要があります。華氏と摂氏の温度文字列

• 温度の変換に使用されるコールバック関数。

• class ConverterFrame(ttk.Frame):
      def __init__(self, container, unit_from, converter):
          super().__init__(container)
  
          self.unit_from = unit_from
          self.converter = converter
  
          # field options
          options = {'padx': 5, 'pady': 0}
  
          # temperature label
          self.temperature_label = ttk.Label(self, text=self.unit_from)
          self.temperature_label.grid(column=0, row=0, sticky='w',  **options)
  
          # temperature entry
          self.temperature = tk.StringVar()
          self.temperature_entry = ttk.Entry(self, textvariable=self.temperature)
          self.temperature_entry.grid(column=1, row=0, sticky='w', **options)
          self.temperature_entry.focus()
  
          # button
          self.convert_button = ttk.Button(self, text='Convert')
          self.convert_button.grid(column=2, row=0, sticky='w', **options)
          self.convert_button.configure(command=self.convert)
  
          # result label
          self.result_label = ttk.Label(self)
          self.result_label.grid(row=1, columnspan=3, **options)
  
          # add padding to the frame and show it
          self.grid(column=0, row=0, padx=5, pady=5, sticky="nsew")
  
      def convert(self, event=None):
          """  Handle button click event
          """
          try:
              input_value = float(self.temperature.get())
              result = self.converter(input_value)
              self.result_label.config(text=result)
          except ValueError as error:
              showerror(title='Error', message=error)
  
      def reset(self):
          self.temperature_entry.delete(0, "end")
          self.result_label.text = ''

  上記のコードはどのように機能しますか?

1) 温度ラベルを表示するには、unit_from パラメーターを使用します。

• 2) 温度をある単位から別の単位に変換するには、convert() メソッドで self.convert コールバックを呼び出します。

• 3) フレームが別のフレームに切り替わったときにエントリ ウィジェットと結果ラベルをクリアするように、reset() メソッドを定義します。

• 3 番目に、表示するフレームを選択するためのラジオ ボタンを表示する ControlFrame クラスを定義します。 ControFrame クラスは ttk.LabelFrame を継承します。

  class ControlFrame(ttk.LabelFrame):
      def __init__(self, container):
  
          super().__init__(container)
          self['text'] = 'Options'
  
          # radio buttons
          self.selected_value = tk.IntVar()
  
          ttk.Radiobutton(
              self,
              text='F to C',
              value=0,
              variable=self.selected_value,
              command=self.change_frame).grid(column=0, row=0, padx=5, pady=5)
  
          ttk.Radiobutton(
              self,
              text='C to F',
              value=1,
              variable=self.selected_value,
              command=self.change_frame).grid(column=1, row=0, padx=5, pady=5)
  
          self.grid(column=0, row=1, padx=5, pady=5, sticky='ew')
  
          # initialize frames
          self.frames = {}
          self.frames[0] = ConverterFrame(
              container,
              'Fahrenheit',
              TemperatureConverter.fahrenheit_to_celsius)
          self.frames[1] = ConverterFrame(
              container,
              'Celsius',
              TemperatureConverter.celsius_to_fahrenheit)
  
          self.change_frame()
  
      def change_frame(self):
          frame = self.frames[self.selected_value.get()]
          frame.reset()
          frame.tkraise()

上記のコードはどのように機能しますか?

各ラジオ ボタンの値は 0 または 1 です。

• ConverterFrame クラスの 2 つのインスタンスを作成します。1 つは温度を華氏から摂氏に変換する役割を果たし、もう 1 つは温度を摂氏から華氏に変換する役割を果たします。さらに、これらのフレームを格納するための辞書を定義します。 Frameのキーはラジオボタンの値と同じです。

• ラジオ ボタンをクリックすると、change_frame() メソッドが呼び出され、選択されたボタンの値に基づいて辞書から対応するフレームが選択されます。

• Frame の replace() メソッドを呼び出して、入力フィールドと結果ラベルをリセットします。また、tkraise() メソッドを呼び出してフレームを表示します。

• 4 番目に、tk.Tk クラスから継承した App クラスを定義します。

  class App(tk.Tk):
      def __init__(self):
          super().__init__()
  
          self.title('Temperature Converter')
          self.geometry('300x120')
          self.resizable(False, False)

最後に、プログラムを開始します。

if __name__ == "__main__":
    app = App()
    ControlFrame(app)
    app.mainloop()

コードは次のように統合されます。

import tkinter as tk
from tkinter import ttk
from tkinter.messagebox import showerror


class TemperatureConverter:
    @staticmethod
    def fahrenheit_to_celsius(f, format=True):
        result = (f - 32) * 5/9
        if format:
            return f'{f} Fahrenheit = {result:.2f} Celsius'
        return result

    @staticmethod
    def celsius_to_fahrenheit(c, format=True):
        result = c * 9/5 + 32
        if format:
            return f'{c} Celsius = {result:.2f} Fahrenheit'
        return result


class ConverterFrame(ttk.Frame):
    def __init__(self, container, unit_from, converter):
        super().__init__(container)

        self.unit_from = unit_from
        self.converter = converter

        # field options
        options = {'padx': 5, 'pady': 0}

        # temperature label
        self.temperature_label = ttk.Label(self, text=self.unit_from)
        self.temperature_label.grid(column=0, row=0, sticky='w',  **options)

        # temperature entry
        self.temperature = tk.StringVar()
        self.temperature_entry = ttk.Entry(self, textvariable=self.temperature)
        self.temperature_entry.grid(column=1, row=0, sticky='w', **options)
        self.temperature_entry.focus()

        # button
        self.convert_button = ttk.Button(self, text='Convert')
        self.convert_button.grid(column=2, row=0, sticky='w', **options)
        self.convert_button.configure(command=self.convert)

        # result label
        self.result_label = ttk.Label(self)
        self.result_label.grid(row=1, columnspan=3, **options)

        # add padding to the frame and show it
        self.grid(column=0, row=0, padx=5, pady=5, sticky="nsew")

    def convert(self, event=None):
        """  Handle button click event
        """
        try:
            input_value = float(self.temperature.get())
            result = self.converter(input_value)
            self.result_label.config(text=result)
        except ValueError as error:
            showerror(title='Error', message=error)

    def reset(self):
        self.temperature_entry.delete(0, "end")
        self.result_label.text = ''


class ControlFrame(ttk.LabelFrame):
    def __init__(self, container):

        super().__init__(container)
        self['text'] = 'Options'

        # radio buttons
        self.selected_value = tk.IntVar()

        ttk.Radiobutton(
            self,
            text='F to C',
            value=0,
            variable=self.selected_value,
            command=self.change_frame).grid(column=0, row=0, padx=5, pady=5)

        ttk.Radiobutton(
            self,
            text='C to F',
            value=1,
            variable=self.selected_value,
            command=self.change_frame).grid(column=1, row=0, padx=5, pady=5)

        self.grid(column=0, row=1, padx=5, pady=5, sticky='ew')

        # initialize frames
        self.frames = {}
        self.frames[0] = ConverterFrame(
            container,
            'Fahrenheit',
            TemperatureConverter.fahrenheit_to_celsius)
        self.frames[1] = ConverterFrame(
            container,
            'Celsius',
            TemperatureConverter.celsius_to_fahrenheit)

        self.change_frame()

    def change_frame(self):
        frame = self.frames[self.selected_value.get()]
        frame.reset()
        frame.tkraise()


class App(tk.Tk):
    def __init__(self):
        super().__init__()

        self.title('Temperature Converter')
        self.geometry('480x240')
        self.resizable(False, False)


if __name__ == "__main__":
    app = App()
    ControlFrame(app)
    app.mainloop()

実行結果は次のとおりです:

以上がPython Tkinter GUI プログラミングでフレーム切り替えを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。