GUI

[Python Tkinter] Treeviewでマウスドラッグで複数選択する方法

2025-01-18更新日: 2025-01-18

PythonのTkinterライブラリでTreeviewウィジェットを使用して、マウスドラッグで複数選択を可能にするには、Treeviewのselectmodeオプションを"extended"に設定します。

これにより、ShiftキーやCtrlキーを使った複数選択が可能になります。

また、マウスドラッグでの選択を実現するには、<B1-Motion>イベントをバインドし、ドラッグ中に選択範囲を更新する処理を追加する必要があります。

目次から探す

マウスドラッグでの複数選択の実装
コード例：マウスドラッグでの複数選択
応用例：Treeviewのカスタマイズ
まとめ

マウスドラッグでの複数選択の実装

PythonのTkinterライブラリを使用して、Treeviewウィジェットでマウスドラッグによる複数選択を実装する方法を解説します。

これにより、ユーザーは複数のアイテムを直感的に選択できるようになります。

selectmode=”extended”の設定

Treeviewウィジェットで複数選択を可能にするためには、selectmodeオプションを"extended"に設定します。

これにより、ユーザーはShiftキーやCtrlキーを使って複数のアイテムを選択できるようになります。

import tkinter as tk
from tkinter import ttk
root = tk.Tk()
tree = ttk.Treeview(root, selectmode="extended")
tree.pack()

イベントバインドの基本

Tkinterでは、特定のイベントに対して関数をバインドすることで、ユーザーの操作に応じた処理を実行できます。

マウスのボタンが押されたときや動かされたときのイベントをバインドすることで、複数選択の機能を実装します。

def on_mouse_down(event):
    # マウスボタンが押されたときの処理
    pass
def on_mouse_move(event):
    # マウスが動いたときの処理
    pass
tree.bind("<ButtonPress-1>", on_mouse_down)
tree.bind("<B1-Motion>", on_mouse_move)

<B1-Motion>イベントの活用

<B1-Motion>イベントは、左ボタンが押された状態でマウスが動いたときに発生します。

このイベントを利用して、選択範囲を更新する処理を実装します。

def on_mouse_move(event):
    item = tree.identify_row(event.y)  # マウスのY座標からアイテムを特定
    if item:
        tree.selection_add(item)  # アイテムを選択に追加
tree.bind("<B1-Motion>", on_mouse_move)

選択範囲の更新方法

選択範囲を更新するためには、selection_addメソッドを使用します。

このメソッドを使うことで、マウスが動いた際に新たに選択されたアイテムを追加することができます。

def on_mouse_move(event):
    item = tree.identify_row(event.y)  # マウスのY座標からアイテムを特定
    if item and item not in tree.selection():
        tree.selection_add(item)  # アイテムを選択に追加

選択されたアイテムの取得方法

選択されたアイテムを取得するには、selection()メソッドを使用します。

このメソッドは、現在選択されているアイテムのIDをリストとして返します。

def get_selected_items():
    selected_items = tree.selection()  # 選択されたアイテムのIDを取得
    for item in selected_items:
        print(tree.item(item, "text"))  # アイテムのテキストを表示
# 選択されたアイテムを取得するボタンを作成
button = tk.Button(root, text="選択アイテムを表示", command=get_selected_items)
button.pack()

このようにして、TkinterのTreeviewウィジェットでマウスドラッグによる複数選択を実装することができます。

ユーザーは直感的にアイテムを選択でき、選択されたアイテムを簡単に取得することが可能です。

コード例：マウスドラッグでの複数選択

ここでは、TkinterのTreeviewウィジェットを使用して、マウスドラッグによる複数選択の具体的なコード例を示します。

これにより、実際の実装方法を理解しやすくなります。

基本的なコード例

まずは、基本的なTreeviewウィジェットを作成し、アイテムを追加するコードを示します。

これにより、複数選択の機能を実装するための土台を作ります。

import tkinter as tk
from tkinter import ttk
# メインウィンドウの作成
root = tk.Tk()
root.title("Treeview 複数選択の例")
# Treeviewウィジェットの作成
tree = ttk.Treeview(root, selectmode="extended")
tree.pack()
# アイテムの追加
for i in range(10):
    tree.insert("", "end", text=f"アイテム {i+1}")
root.mainloop()

このコードを実行すると、10個のアイテムが表示されたTreeviewウィジェットが作成されます。

イベントバインドを使った複数選択の実装

次に、マウスのボタンが押されたときと動いたときのイベントをバインドし、複数選択を実装します。

def on_mouse_down(event):
    item = tree.identify_row(event.y)  # マウスのY座標からアイテムを特定
    if item:
        tree.selection_set(item)  # アイテムを選択
def on_mouse_move(event):
    item = tree.identify_row(event.y)  # マウスのY座標からアイテムを特定
    if item:
        tree.selection_add(item)  # アイテムを選択に追加
# イベントのバインド
tree.bind("<ButtonPress-1>", on_mouse_down)
tree.bind("<B1-Motion>", on_mouse_move)

このコードを追加することで、マウスドラッグによる複数選択が可能になります。

選択範囲の視覚的フィードバック

選択されたアイテムを視覚的にわかりやすくするために、選択されたアイテムの背景色を変更することができます。

以下のコードを追加します。

def on_select(event):
    for item in tree.selection():
        tree.item(item, tags="selected")
def on_deselect(event):
    for item in tree.get_children():
        tree.item(item, tags="")  # タグをクリア
tree.tag_configure("selected", background="lightblue")  # 選択されたアイテムの色を設定
tree.bind("<<TreeviewSelect>>", on_select)
tree.bind("<ButtonRelease-1>", on_deselect)  # マウスボタンが離されたときに選択解除

このコードにより、選択されたアイテムの背景色が変更され、視覚的なフィードバックが得られます。

選択解除の実装方法

選択を解除するためには、マウスボタンが離されたときに選択をクリアする処理を追加します。

以下のコードを使用します。

def on_deselect(event):
    for item in tree.selection():
        tree.selection_remove(item)  # 選択を解除
tree.bind("<ButtonRelease-1>", on_deselect)  # マウスボタンが離されたときに選択解除

このようにして、マウスドラッグによる複数選択の実装が完了します。

import tkinter as tk
from tkinter import ttk

# メインウィンドウの作成
root = tk.Tk()
root.title("Treeview 複数選択の例")

# Treeviewウィジェットの作成
tree = ttk.Treeview(root, selectmode="extended")
tree.pack()

# アイテムの追加
for i in range(10):
    tree.insert("", "end", text=f"アイテム {i+1}")

# イベントハンドラの定義
def on_mouse_down(event):
    item = tree.identify_row(event.y)  # マウスのY座標からアイテムを特定
    if item:
        tree.selection_set(item)  # アイテムを選択

def on_mouse_move(event):
    item = tree.identify_row(event.y)  # マウスのY座標からアイテムを特定
    if item:
        tree.selection_add(item)  # アイテムを選択に追加

def on_select(event):
    for item in tree.selection():
        tree.item(item, tags="selected")

def on_deselect(event):
    for item in tree.selection():
        tree.selection_remove(item)  # 選択を解除

# タグの設定
tree.tag_configure("selected", background="lightblue")  # 選択されたアイテムの色を設定

# イベントのバインド
tree.bind("<ButtonPress-1>", on_mouse_down)
tree.bind("<B1-Motion>", on_mouse_move)
tree.bind("<<TreeviewSelect>>", on_select)
tree.bind("<ButtonRelease-1>", on_deselect)  # マウスボタンが離されたときに選択解除

# メインループの開始
root.mainloop()

ユーザーは直感的にアイテムを選択・解除でき、視覚的なフィードバックも得られるため、使いやすいインターフェースが実現できます。

応用例：Treeviewのカスタマイズ

TkinterのTreeviewウィジェットは、基本的な機能だけでなく、さまざまなカスタマイズが可能です。

ここでは、選択されたアイテムの色変更やキーボード操作との組み合わせ、選択範囲の動的フィルタリング、列幅やスタイルのカスタマイズについて解説します。

選択されたアイテムの色を変更する

選択されたアイテムの色を変更することで、ユーザーに視覚的なフィードバックを提供できます。

以下のコードでは、選択されたアイテムの背景色を変更する方法を示します。

def on_select(event):
    for item in tree.selection():
        tree.item(item, tags="selected")
def on_deselect(event):
    for item in tree.get_children():
        tree.item(item, tags="")  # タグをクリア
tree.tag_configure("selected", background="lightblue")  # 選択されたアイテムの色を設定
tree.bind("<<TreeviewSelect>>", on_select)
tree.bind("<ButtonRelease-1>", on_deselect)  # マウスボタンが離されたときに選択解除

このコードを追加することで、選択されたアイテムの背景色が変更され、視覚的にわかりやすくなります。

キーボード操作と組み合わせた複数選択

キーボード操作を組み合わせることで、ユーザーはより効率的にアイテムを選択できます。

以下のコードでは、ShiftキーとCtrlキーを使った選択方法を実装します。

def on_key_press(event):
    item = tree.focus()  # 現在フォーカスされているアイテムを取得
    if event.state & 0x0004:  # Ctrlキーが押されている場合
        if item in tree.selection():
            tree.selection_remove(item)  # 選択を解除
        else:
            tree.selection_add(item)  # 選択に追加
    elif event.state & 0x0001:  # Shiftキーが押されている場合
        # Shiftキーでの選択範囲の拡張処理を実装
        pass
tree.bind("<KeyPress>", on_key_press)

このコードにより、Ctrlキーを押しながらアイテムを選択・解除できるようになります。

Shiftキーを使った範囲選択の処理も追加することで、さらに便利になります。

選択範囲の動的なフィルタリング

選択範囲を動的にフィルタリングすることで、特定の条件に合ったアイテムのみを表示することができます。

以下のコードでは、特定の条件に基づいてアイテムをフィルタリングする方法を示します。

def filter_items(condition):
    for item in tree.get_children():
        if condition in tree.item(item, "text"):
            tree.item(item, open=True)  # 条件に合うアイテムを表示
        else:
            tree.detach(item)  # 条件に合わないアイテムを非表示
# フィルタリングを実行するボタンを作成
filter_button = tk.Button(root, text="フィルタリング", command=lambda: filter_items("条件"))
filter_button.pack()

このコードを使用することで、特定の条件に合ったアイテムのみを表示することができ、ユーザーは必要な情報を迅速に見つけることができます。

Treeviewの列幅やスタイルのカスタマイズ

Treeviewの列幅やスタイルをカスタマイズすることで、見た目を改善し、ユーザーにとって使いやすいインターフェースを提供できます。

以下のコードでは、列幅を設定し、スタイルを変更する方法を示します。

tree["columns"] = ("column1", "column2")
tree.column("#0", width=100)  # デフォルトの列幅
tree.column("column1", width=150)
tree.column("column2", width=200)
tree.heading("column1", text="列1")
tree.heading("column2", text="列2")
# スタイルの設定
style = ttk.Style()
style.configure("Treeview", rowheight=25)  # 行の高さを設定