今回もToDoアプリのGUI版をバージョンアップしたいと思います。
現在のアプリ上の問題点
今GUIでこのような「ToDoアプリ」を作っています。これまでの経緯はPython_ToDoアプリ編として、こちらからご覧いただけます（→更新履歴）
今の状態で画面を見てみると一覧表示部分には、罫線が無いので、行を見間違えるおそれがありますね。
改善対策
プログラム修正の概要
そこで、行の見間違えを防止するのと、画面を少し華やかにする、という効果を得るために、行（レコード）を２色に設定してみたいと思います。
１行ごとに色違いにして、ゼブラ状態にします。
では、始めます。
このようなプログラムに修正してみました。
#レコードの検索結果をリストボックスに表示
i=0
for row in get_search_todos(ToDo,date,id):
tree.insert(parent='', index='end', tags=i, iid=row ,values=(str(row[0]), str(row[1]) ,str(row[2])))
if i % 2 == 0:
# tagが偶数(レコードは奇数)の場合のみ、背景色の設定
tree.tag_configure(i,background="#e6e6fa")
i+=1
プログラムの修正箇所を簡単に説明します。
treeviewに.tag_configureで、偶数の行に色を付けることにします。そのために、カウンターとして変数iを使います。
iを2で割って余りがでない行を偶数行として色付けします。
if文で偶数行のみ色付けして表示するという条件分岐にしています。
iはタグの役割も果たしていて、insert()で指定されたタグを.tag_configureでも指定することで、色付けする行を特定しています。
これに気付かず、「tree.insert()」に 「tags=i」を追加していないため、エラーが発生し、解決にかなり時間を要しました。
画面表示用の関数が２つありますので、 view_todos関数とview_search_todos関数に追加します。
treeviewに.tag_configureで、偶数の行に色を付けることにします。そのために、カウンターとして変数iを使います。
iを2で割って余りがでない行を偶数行として色付けします。
if文で偶数行のみ色付けして表示するという条件分岐にしています。
iはタグの役割も果たしていて、insert()で指定されたタグを.tag_configureでも指定することで、色付けする行を特定しています。
これに気付かず、「tree.insert()」に 「tags=i」を追加していないため、エラーが発生し、解決にかなり時間を要しました。
画面表示用の関数が２つありますので、 view_todos関数とview_search_todos関数に追加します。
プログラム修正後の結果
では、実際にプログラムを実行して試してみます。
このように１行おきに色付けがされました。
まとめ
最後に
以上、GUI版「ToDoアプリ」の見直しをしてみました。
これからも見た目や、使い勝手をよくしていこうと思っています。
プログラム修正後の全サンプルコードは、こちらからご覧いただけます（→参照）
実行形式のファイルにする（exe化）場合は、こちらを参考にしてください（→過去記事）
0 件のコメント:
コメントを投稿