Python/tkinter チェックボックス入りの表とスクロールバー

2019 9/03
Python/tkinter チェックボックス入りの表とスクロールバー

Python初心者がブログの検索順位取得ツールを作っています。

前回は、画面案を作り、とりあえずtkinterでファイル選択ボタンを実装してみました。

今回は、作りたい画面の中心的機能である検索キーワード等を表形式に表示する部分を作ってみます。

作りたい画面は下の通りです。

作りたい画面
Pythonで作りたい画面

表は複数の列からなり、チェックボックスを埋め込みたい。
さらにスクロールバーを付けたい
この要望がなかなか大変なことになりました。

tkinterでチェックボックスを埋め込んだ複数列の表を作り、スクロールバーを付ける方法は、簡単には見つかりませんでしたので、いろいろ組み合わせて自分で実装してみました。

目次

チェックボックス入りの表とスクロールバーを表示するコード

今回はtkinterを使って検索キーワードや順位を表形式で表示する部分を作っていきます。

やったことは

  • grid機能でLabelとチェックボックスを配置
  • 背景色をつける
  • スクロールバー用にFrameとCanvasを設定

です。

表形式に表示する方法は、ListBoxやTreeviewがあります。
しかし、ListBoxは複数列ができない、Treeviewは複数列はできるけど、チェックボックスを埋め込めないので、諦めました。
(※あくまでも、調べた範囲でやり方が分からなかった)

Labelとチェックボックス(checkbutton)をgridで並べることで表のように表示させることにしました。

また、表をスクロールできるようにしたかったため、CanvasやFrameといったwidgetを使用しています。

参考ページ
表のようにLabelを配置する方法⇒How to delete entire row in Tkinter grid layout
スクロールバーの設定方法⇒Tkinterでスクロールできるようにしたい

余談ですが、上記参考ページである「stackoverflow」はプログラミングの難しい課題も解決できちゃうので、めっちゃ参考になります。
ありがたいです。

では、今回作成部分のソースコードです。

表示するデータは、今回は埋め込みでリストを作りました。
今後ファイル読み込みでリストを取得する予定。

コードの注意点

上記コード、長いので個別の説明は省きます(というか、理解不足でできない)。

今回のキモでもあり、少々躓いたgrid機能のみ紹介します。

Labelでもチェックボックスでも、画面上のどこに配置するかは「grid」で設定します。

object.grid(row=0,column=0)

といったように、行(row)と列(column)で指定します。番号は0始まりです。

今回、row=0にファイル選択ボタンを配置し、row=1に表のヘッダーを、row=2以降に表の中身を配置しています。

column=0がチェックボックス、column=1が検索キーワード、column=2が検索順位、column=3が記事タイトルです。

スクロールバーは、

vbar.grid(row=1,rowspan=7,column=5,sticky=’ns’)

と、row=1から7行にわたって設置。列はcolumn=5としています。なぜかcolumn=4だと上手くいきませんでした(謎)。
「sticky」オプションで”ns”(上下に引き延ばす)を指定しています。

また、Labelとチェックボックスでは余白の指定もしています。
これは背景の色の塗り具合を調整するためです。
  padxが外側の横の余白
  padyが外側の縦の余白
  ipadxが内側の横の余白
  ipadyが内側の縦の余白
です。すべて0にしました。

スポンサーリンク

実行結果

上記のソースコードを実行してみます。

python/tkinterでチェックボックス入りの表を表示し、スクロールバーを付けた画面1
表示した画面
python/tkinterでチェックボックス入りの表を表示し、スクロールバーを付けた画面1
下にスクロールした画面

なんとかそれっぽい表が表示されました。
スクロールバーも機能しています。

ここまで表示できるようになるのに、かなり時間がかかりました。
はっきり言って、難しい。(VBAやC#のが楽)

今後の課題

●マウス対応

スクロールバーを設置したものの、マウスホイールを動かした場合にスクロールできません。
そういう機能は別でバインドさせないといけないようです。
マウスで動いた方がユーザー的には楽なので、こちらは対応する予定。

●表の大きさを可変にしたい

現状は表の幅(canvas,frame,label)が固定になっていて、画面のサイズをドラッグで変えた場合に対応できていません。
画面の大きさに合わせて表の幅も変えられるようにしたいです。

今回作った部分についての課題はとりあえず2つです。

あとは他のボタン機能を実装しないと。

なかなか大変になってきました。
いつ完成するのでしょう・・・

んじゃ、また~

関連記事

応援よろしくお願いします☆

この記事を書いた人

理系夫婦の妻のほうです。
大学、大学院(修士)で物理を専攻。
2016年に長女を出産。
フルタイム勤務ワーママ→休職中。
「CrowdWorks(クラウドワークス)」でお仕事受け付けております!
(ツール開発、記事執筆など)
「まゆみ1101」というユーザー名です!

コメント

コメントする

目次
閉じる