GUI

[wxPython] wx.Notebookの使い方 – タブを作成する

wxPythonのwx.Notebookは、タブ付きインターフェースを作成するためのウィジェットです。

wx.Notebookを使用するには、まず親ウィンドウにwx.Notebookオブジェクトを作成し、各タブに対応するページ(通常はwx.Panel)を追加します。

AddPageメソッドを使ってタブを追加し、タブのラベルやアイコンを設定できます。

タブの切り替えイベントはEVT_NOTEBOOK_PAGE_CHANGEDで処理可能です。

目次から探す

wx.Notebookとは
- 特徴
wx.Notebookの基本的な使い方
wx.Notebookのイベント処理
wx.Notebookのカスタマイズ
- タブの外観をカスタマイズ
- タブのアイコンを追加
実践例：wx.Notebookを使った簡単なアプリケーション
wx.Notebookを使う際の注意点
まとめ

wx.Notebookとは

wx.Notebookは、wxPythonライブラリにおけるタブ付きインターフェースを提供するウィジェットです。

このウィジェットを使用することで、複数のページをタブ形式で表示し、ユーザーが簡単に異なるコンテンツにアクセスできるようになります。

タブは、特定のページを選択するための視覚的な手段を提供し、アプリケーションのユーザビリティを向上させます。

特徴

タブの追加・削除: 動的にタブを追加したり削除したりできます。
ページの切り替え: ユーザーはタブをクリックすることで、異なるページに簡単に切り替えられます。
カスタマイズ可能: タブの外観や動作をカスタマイズすることができます。

wx.Notebookは、設定画面や情報表示画面など、複数の関連情報を整理して表示する際に特に有用です。

例えば、ユーザー設定、アプリケーション情報、ヘルプセクションなどをそれぞれのタブに配置することができます。

このように、wx.Notebookは、ユーザーが情報を効率的に管理し、操作できるようにするための強力なツールです。

wx.Notebookの基本的な使い方

wx.Notebookを使用するためには、まずwxPythonをインポートし、アプリケーションの基本的なウィンドウを作成する必要があります。

以下に、wx.Notebookを使った基本的なアプリケーションの例を示します。

import wx
class MyApp(wx.App):
    def OnInit(self):
        # メインウィンドウの作成
        frame = wx.Frame(None, title="wx.Notebookの基本例", size=(400, 300))
        
        # wx.Notebookの作成
        notebook = wx.Notebook(frame)
        
        # タブページの作成
        page1 = wx.Panel(notebook)
        page2 = wx.Panel(notebook)
        
        # タブにページを追加
        notebook.AddPage(page1, "タブ1")
        notebook.AddPage(page2, "タブ2")
        
        # 各ページにコンテンツを追加
        page1_sizer = wx.BoxSizer(wx.VERTICAL)
        page1_text = wx.StaticText(page1, label="これはタブ1の内容です。")
        page1_sizer.Add(page1_text, 0, wx.ALL | wx.CENTER, 5)
        page1.SetSizer(page1_sizer)
        
        page2_sizer = wx.BoxSizer(wx.VERTICAL)
        page2_text = wx.StaticText(page2, label="これはタブ2の内容です。")
        page2_sizer.Add(page2_text, 0, wx.ALL | wx.CENTER, 5)
        page2.SetSizer(page2_sizer)
        
        # メインウィンドウを表示
        frame.Show()
        return True
# アプリケーションの実行
app = MyApp()
app.MainLoop()

このコードを実行すると、以下のようなウィンドウが表示されます。

タブ1を選択すると、「これはタブ1の内容です。」というテキストが表示されます。
タブ2を選択すると、「これはタブ2の内容です。」というテキストが表示されます。

このサンプルコードでは、wx.Frameを使用してメインウィンドウを作成し、その中にwx.Notebookを配置しています。

wx.Panelを使用して各タブのページを作成し、AddPageメソッドでタブに追加しています。

これにより、ユーザーはタブを切り替えることで異なる内容を表示できます。

wx.Notebookのイベント処理

wx.Notebookでは、タブの切り替えやタブの追加・削除などの操作に対してイベントを処理することができます。

これにより、ユーザーの操作に応じてアプリケーションの動作をカスタマイズすることが可能です。

以下に、タブの切り替えイベントを処理する方法を示します。

import wx
class MyApp(wx.App):
    def OnInit(self):
        # メインウィンドウの作成
        frame = wx.Frame(None, title="wx.Notebookのイベント処理例", size=(400, 300))
        
        # wx.Notebookの作成
        self.notebook = wx.Notebook(frame)
        
        # タブページの作成
        self.page1 = wx.Panel(self.notebook)
        self.page2 = wx.Panel(self.notebook)
        
        # タブにページを追加
        self.notebook.AddPage(self.page1, "タブ1")
        self.notebook.AddPage(self.page2, "タブ2")
        
        # 各ページにコンテンツを追加
        self.setupPage1()
        self.setupPage2()
        
        # タブ切り替えイベントのバインド
        self.notebook.Bind(wx.EVT_NOTEBOOK_PAGE_CHANGED, self.onTabChanged)
        
        # メインウィンドウを表示
        frame.Show()
        return True
    def setupPage1(self):
        sizer = wx.BoxSizer(wx.VERTICAL)
        text = wx.StaticText(self.page1, label="これはタブ1の内容です。")
        sizer.Add(text, 0, wx.ALL | wx.CENTER, 5)
        self.page1.SetSizer(sizer)
    def setupPage2(self):
        sizer = wx.BoxSizer(wx.VERTICAL)
        text = wx.StaticText(self.page2, label="これはタブ2の内容です。")
        sizer.Add(text, 0, wx.ALL | wx.CENTER, 5)
        self.page2.SetSizer(sizer)
    def onTabChanged(self, event):
        # 現在のタブのインデックスを取得
        current_tab = event.GetSelection()
        wx.MessageBox(f"現在のタブはタブ{current_tab + 1}です。", "タブ切り替え")
# アプリケーションの実行
app = MyApp()
app.MainLoop()

このコードを実行し、タブを切り替えると、以下のようなメッセージボックスが表示されます。

タブ1を選択すると、「現在のタブはタブ1です。」と表示されます。
タブ2を選択すると、「現在のタブはタブ2です。」と表示されます。

このサンプルコードでは、wx.EVT_NOTEBOOK_PAGE_CHANGEDイベントを使用してタブの切り替えを検知しています。

タブが切り替わると、onTabChangedメソッドが呼び出され、現在のタブのインデックスを取得してメッセージボックスに表示します。

このように、イベント処理を活用することで、ユーザーの操作に応じた動的な反応を実装できます。

wx.Notebookのカスタマイズ

wx.Notebookは、デフォルトの外観や動作をカスタマイズすることができ、アプリケーションのデザインやユーザー体験を向上させることができます。

以下に、タブの外観や動作をカスタマイズする方法をいくつか紹介します。

タブの外観をカスタマイズ

タブの色やフォント、サイズを変更することで、アプリケーションのテーマに合わせたデザインを実現できます。

以下のサンプルコードでは、タブの背景色とフォントを変更しています。

import wx
class MyApp(wx.App):
    def OnInit(self):
        # メインウィンドウの作成
        frame = wx.Frame(None, title="wx.Notebookのカスタマイズ例", size=(400, 300))
        
        # wx.Notebookの作成
        self.notebook = wx.Notebook(frame)
        
        # タブページの作成
        self.page1 = wx.Panel(self.notebook)
        self.page2 = wx.Panel(self.notebook)
        
        # タブにページを追加
        self.notebook.AddPage(self.page1, "タブ1")
        self.notebook.AddPage(self.page2, "タブ2")
        
        # タブの外観をカスタマイズ
        self.notebook.SetBackgroundColour(wx.Colour(240, 240, 240))  # 背景色
        self.notebook.SetForegroundColour(wx.Colour(0, 0, 0))        # フォント色
        self.notebook.SetFont(wx.Font(10, wx.FONTFAMILY_DEFAULT, wx.FONTSTYLE_NORMAL, wx.FONTWEIGHT_BOLD))  # フォント
        
        # 各ページにコンテンツを追加
        self.setupPage1()
        self.setupPage2()
        
        # メインウィンドウを表示
        frame.Show()
        return True
    def setupPage1(self):
        sizer = wx.BoxSizer(wx.VERTICAL)
        text = wx.StaticText(self.page1, label="これはタブ1の内容です。")
        sizer.Add(text, 0, wx.ALL | wx.CENTER, 5)
        self.page1.SetSizer(sizer)
    def setupPage2(self):
        sizer = wx.BoxSizer(wx.VERTICAL)
        text = wx.StaticText(self.page2, label="これはタブ2の内容です。")
        sizer.Add(text, 0, wx.ALL | wx.CENTER, 5)
        self.page2.SetSizer(sizer)
# アプリケーションの実行
app = MyApp()
app.MainLoop()

このコードを実行すると、タブの背景色が薄いグレーに、フォントが太字の10ポイントに変更されたウィンドウが表示されます。

タブのアイコンを追加

タブにアイコンを追加することで、視覚的な情報を提供し、ユーザーがタブの内容をより直感的に理解できるようになります。

以下のサンプルコードでは、タブにアイコンを追加する方法を示します。

import wx

class MyApp(wx.App):
    def OnInit(self):
        # メインウィンドウの作成
        frame = wx.Frame(None, title="wx.Notebookのアイコン追加例", size=(400, 300))
        
        # wx.Notebookの作成
        self.notebook = wx.Notebook(frame)
        
        # イメージリストの作成
        image_list = wx.ImageList(16, 16)  # アイコンのサイズを指定 (16x16)
        
        # アイコンの作成とイメージリストへの追加
        icon1 = wx.ArtProvider.GetBitmap(wx.ART_INFORMATION, wx.ART_OTHER, (16, 16))
        icon2 = wx.ArtProvider.GetBitmap(wx.ART_WARNING, wx.ART_OTHER, (16, 16))
        image_list.Add(icon1)  # 0番目のアイコン
        image_list.Add(icon2)  # 1番目のアイコン
        
        # wx.Notebookにイメージリストを設定
        self.notebook.AssignImageList(image_list)
        
        # タブページの作成
        self.page1 = wx.Panel(self.notebook)
        self.page2 = wx.Panel(self.notebook)
        
        # タブにページを追加(アイコン付き)
        self.notebook.AddPage(self.page1, "タブ1", select=True, imageId=0)
        self.notebook.AddPage(self.page2, "タブ2", imageId=1)
        
        # 各ページにコンテンツを追加
        self.setupPage1()
        self.setupPage2()
        
        # メインウィンドウを表示
        frame.Show()
        return True

    def setupPage1(self):
        sizer = wx.BoxSizer(wx.VERTICAL)
        text = wx.StaticText(self.page1, label="これはタブ1の内容です。")
        sizer.Add(text, 0, wx.ALL | wx.CENTER, 5)
        self.page1.SetSizer(sizer)

    def setupPage2(self):
        sizer = wx.BoxSizer(wx.VERTICAL)
        text = wx.StaticText(self.page2, label="これはタブ2の内容です。")
        sizer.Add(text, 0, wx.ALL | wx.CENTER, 5)
        self.page2.SetSizer(sizer)

# アプリケーションの実行
app = MyApp()
app.MainLoop()

このコードを実行すると、タブ1には情報アイコン、タブ2には警告アイコンが表示されたウィンドウが表示されます。

wx.Notebookのカスタマイズは、アプリケーションの外観やユーザー体験を向上させるために非常に重要です。

タブの色やフォント、アイコンを変更することで、ユーザーにとって使いやすいインターフェースを提供できます。

これにより、アプリケーションの魅力を高めることができます。

実践例：wx.Notebookを使った簡単なアプリケーション

ここでは、wx.Notebookを使用して、簡単なメモアプリケーションを作成します。

このアプリケーションでは、ユーザーが異なるメモをタブで管理できるようにします。

各タブには、メモを入力するためのテキストボックスが配置されます。

import wx
class MyApp(wx.App):
    def OnInit(self):
        # メインウィンドウの作成
        frame = wx.Frame(None, title="メモアプリ", size=(400, 300))
        
        # wx.Notebookの作成
        self.notebook = wx.Notebook(frame)
        
        # タブページの作成
        self.pages = []
        for i in range(3):  # 3つのタブを作成
            page = wx.Panel(self.notebook)
            self.pages.append(page)
            self.notebook.AddPage(page, f"メモ {i + 1}")
            self.setupPage(page, i)
        
        # メインウィンドウを表示
        frame.Show()
        return True
    def setupPage(self, page, index):
        # 各ページにテキストボックスを追加
        sizer = wx.BoxSizer(wx.VERTICAL)
        text_box = wx.TextCtrl(page, style=wx.TE_MULTILINE | wx.TE_PROCESS_ENTER)
        sizer.Add(text_box, 1, wx.EXPAND | wx.ALL, 5)
        page.SetSizer(sizer)
# アプリケーションの実行
app = MyApp()
app.MainLoop()

このコードを実行すると、3つのタブを持つメモアプリケーションが表示されます。