teratail
回答率
85.29%
質問するログイン新規登録
トップTkinterに関する質問tkinter tk.TEXTの表示崩れ

Q&A

解決済

2回答

1099閲覧

tkinter tk.TEXTの表示崩れ

shirasu543
shirasu543

総合スコア4

Tkinter

Tkinterは、GUIツールキットである“Tk”をPythonから利用できるようにした標準ライブラリである。

Python

Pythonは、コードの読みやすさが特徴的なプログラミング言語の1つです。 強い型付け、動的型付けに対応しており、後方互換性がないバージョン2系とバージョン3系が使用されています。 商用製品の開発にも無料で使用でき、OSだけでなく仮想環境にも対応。Unicodeによる文字列操作をサポートしているため、日本語処理も標準で可能です。

1グッド

0クリップ

投稿2022/09/30 05:09

編集2022/10/03 03:09

1

0

前提

tkinterでUIの練習をしている初心者です。
書籍のデータを入力する簡単なUI画面を作ろうとしている途中、tk.TEXTのみ
配置が上手くいかず試行錯誤中です。

実現したいこと

画面

発生している問題・エラーメッセージ

left_frameでフレーム内を７等分しているのと同じ比率で、right_frameも７等分し、１：６でnote_labelとnote_area(テキストフィールド)を設置したいのですが、
うまく分割されず、テキストフィールドが７つ分を占有して、note_labelが上部に追い出されてしまいます。

該当のソースコード

Python
1　  import tkinter as tk
2    from tkinter import ttk
3   
4    window = tk.Tk()
5    window.geometry('400x400')
6    window.title('data window')
7    
8    #上下フレーム
9    up_frame = tk.Frame(window, width=400, height=350) 
10    under_frame = tk.Frame(window, width=400, height=50)
11    
12    #上フレームを左右フレームに分ける
13    left_frame = tk.Frame(up_frame, width=200, height=300)
14    right_frame = tk.Frame(up_frame, width=200, height=300)
15    
16    up_frame.grid_propagate(False)
17    under_frame.grid_propagate(False)
18    left_frame.grid_propagate(False)
19    right_frame.grid_propagate(False)
20    
21    #up_frameのconfigure
22    up_frame.columnconfigure(0,weight=1)
23    up_frame.columnconfigure(1,weight=1)
24
25    #left_frameのconfigure
26    left_frame.columnconfigure(0,weight=1)
27    left_frame.columnconfigure(1,weight=1)
28    left_frame.rowconfigure(0,weight=1)
29    left_frame.rowconfigure(1,weight=1)
30    left_frame.rowconfigure(2,weight=1)
31    left_frame.rowconfigure(3,weight=1)
32    left_frame.rowconfigure(4,weight=1)
33    left_frame.rowconfigure(5,weight=1)
34    left_frame.rowconfigure(6,weight=1)
35    
36    #right_frameのconfigure
37    right_frame.columnconfigure(0, weight=1)
38    right_frame.rowconfigure(0, weight=1)
39    right_frame.rowconfigure(1, weight=1)
40    right_frame.rowconfigure(2, weight=1)
41    right_frame.rowconfigure(3, weight=1)
42    right_frame.rowconfigure(4, weight=1)
43    right_frame.rowconfigure(5, weight=1)
44    right_frame.rowconfigure(6, weight=1)
45   
46    #under_frameのconfigue
47    under_frame.columnconfigure(0, weight=1)
48    under_frame.columnconfigure(1, weight=1)
49    under_frame.columnconfigure(2, weight=1)
50    
51    """left_frame"""
52    #各ラベル
53    number_label = tk.Label(left_frame, text='書誌番号')
54    title_label = tk.Label(left_frame, text='タイトル')
55    author_label = tk.Label(left_frame, text='著者')
56    time_label = tk.Label(left_frame, text='出版年')
57    publisher_label = tk.Label(left_frame, text='出版社')
58    type_label = tk.Label(left_frame, text='形態')
59    janle_label = tk.Label(left_frame, text='ジャンル')
60
61    labels = [number_label, title_label, author_label, time_label, publisher_label, type_label, janle_label]
62    for i, label in enumerate(labels):
63        label.grid(row=i, column=0)
64
65    #各entry
66    number_entry = tk.Entry(left_frame)
67    title_entry = tk.Entry(left_frame)
68    author_entry = tk.Entry(left_frame)
69    time_entry = tk.Entry(left_frame)
70    publisher_entry = tk.Entry(left_frame)
71
72    entrys = [number_entry, title_entry, author_entry, time_entry, publisher_entry]
73    for i, entry in enumerate(entrys):
74        entry.grid(row=i, column=1)
75
76    #combobox 
77    type_list = ['1', '2', '3']
78    type_choice_combo = ttk.Combobox(left_frame, state='readonly', values=type_list)
79    type_choice_combo.current(0)
80
81    #entry 
82    janle_entry = tk.Entry(left_frame)
83
84    #combo, entry設置
85    type_choice_combo.grid(column=1, row=5)
86    janle_entry.grid(column=1, row=6)
87
88
89    """right_frame"""
90    #上右側:テキストフィールド　UI生成・設置・データ反映
91    note_label = tk.Label(right_frame, text='note')
92    note_label.grid(row=0, column=0)
93    
94    note_area = tk.Text(right_frame)
95    note_area.grid(row=1, column=0, rowspan=6)
96    
97
98    #under_frame
99    renew_bt = tk.Button(under_frame, text='データ更新', command=None)
100    delete_bt = tk.Button(under_frame, text='データ削除', command=None)
101    new_save_bt = tk.Button(under_frame, text='新規作成', command=None)
102
103    renew_bt.grid(row=0, column=0)
104    delete_bt.grid(row=0, column=1)
105    new_save_bt.grid(row=0, column=2)
106
107    #フレーム設置
108    left_frame.grid(row=0, column=0)
109    right_frame.grid(row=0, column=1)
110    up_frame.grid(row=0, column=0)
111    under_frame.grid(row=1, column=0)
112
113    window.mainloop()

試したこと

記述の順番の入れ替えや、configureでの設定比率の調整を試みましたが、改善されませんでした。

teamiklが👍を押しています

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

shiracamus
shiracamus

2022/09/30 05:53

base_parts.py も提示してくれないと動作確認できません。 ついでに、、、変数名や関数名に大文字を使うのはやめましょう。
teamikl
teamikl

2022/10/02 04:39

"tk", "ttk", "db", "p_window" が未定義、 left_frame, right_frame が未配置等 base_parts.py があったとしても、 実行してるファイルと掲載されてるスクリプトが異なってます。 まずは、質問用に問題を単純化したコードを作成し、 単体で実行可能な形で掲載してください。 （レイアウトの問題では db は不要なので、適当な仮データに置き換える等。 質問は７等分ですが、３等分４等分で同じ問題が発生するかを試してください、 質問する際のコードの分量も減るはずです）
shirasu543
shirasu543

2022/10/03 02:05

投稿のための単純化が中途半端になっていました。申し訳ありません。先ほど細かい不備を修正いたしました。（大文字の部分はモジュールの方でclassを使っておりました） 当初の問題以外の不備が発生しないコードに直しましたので、教えていただいた確認方法や コードをこれから試す予定です。
shirasu543
shirasu543

2022/10/03 03:00 編集

teamiklさんにご指摘頂いた、rowを減らしてのトライと、左右フレームの廃止ですが、不備を直したコードで実験してみた結果、どちらもnote_labelとnote_areaが画面いっぱいに表示され、ほかのウィジェットが表示されない結果となりました。（under_frameのみ正確に表示されます)
shiracamus
shiracamus

2022/10/03 03:14 編集

renew_bt.grid(row=0, column=0) left_frame.grid(row=0, column=0) up_frame.grid(row=0, column=0) 衝突してませんか？
shirasu543
shirasu543

2022/10/03 04:19

それぞれのウィジェットの設置先は renew_bt→under_frame left_frame→up_frame up_frame→window で別にしているのですが、 指摘して頂いた通り、記述上は同じrow,columnなので何かの原因になっていたりするかもしれません… 記述の順番など色々試してみようと思います。
shiracamus
shiracamus

2022/10/03 05:52 編集

なるほど。それなら問題ないように思えますね。
teamikl
teamikl

2022/10/03 11:32 編集

> 左右フレームの廃止ですが、不備を直したコードで実験してみた結果、どちらもnote_labelとnote_areaが画面いっぱいに表示され、ほかのウィジェットが表示されない結果となりました。 ここはコードを提示してもらわないと解りません。 現状のコードの問題点はレイアウト管理が別々のフレームに別れている事なので、 gridで等分配置したい場合は、同一のフレームに配置するのは必須です。 ウィンドウのリサイズを考慮しないなら代案は幾つか有りますが、 例えば note_label の grid の引数に pady=15 等を追加して、 縦幅を増やして調整するなどは如何でしょう。
shirasu543
shirasu543

2022/10/04 01:36

ありがとうございます。言葉が足りずに申し訳ありません。細かい修正を終えた上記のコードから更に左右フレームの設定だけを無くして実行してみたのですが、note_areaだけが表示される状態が続いております。 padyなどの細かい調整も試してみます。
teamikl
teamikl

2022/10/04 02:29 編集

ここは実際のコードを元に話した方が良さそうですね。 回答にサンプルコードを追加しました。 表示されない問題については、レイアウト設定に誤りがあるとしか言えないので、 質問文を編集し、実際に試したコードを提示してください。
shiracamus
shiracamus

2022/10/04 02:29

left_frame とright_frame の height を up_frame と同じ 350 にしてみてはいかが？
teamikl
teamikl

2022/10/04 02:46

grid の自動計算に頼らずに、自前で 固定長でレイアウトを組むことになりますね。 ウィンドウのリサイズ対応が不要なら、それでもいいかもしれません。 一応、使えそうな設定項目としては、 rowconfigure の minsize=50 で行の最小サイズの設定が出来ます。
guest

回答2件

0

自己解決

かなり放置してしまい、誠に申し訳ありません。
本当は回答を頂いた回答をベストアンサーにさせて頂くつもりだったのですが、お二方の御意見を取り入れつつ思考錯誤した結果、自己解決しました。後々同じような問題で調べにくる方々のために、複数の方法をここに残しておいた方が良いと思い、自己解決として閉じさせていただきます。

以下、解決後の自分のコードです。
問題解決のために行った当初からの変更点：
・up_frameへの左右フレーム設置の廃止
・textフィールドに文字数の設定を追加
（なおコードの長さを短縮するためfor文を追加し、より整った形にしました。）

import tkinter as tk
from tkinter import ttk
   
window = tk.Tk()
window.geometry('400x400')
window.title('data window')
    
#上下フレーム
up_frame = tk.Frame(window, width=400, height=350) 
under_frame = tk.Frame(window, width=400, height=50)

#up_frameのconfigure
column_list = [0, 1, 2, 3]
row_list = [0, 1, 2, 3, 4, 5, 6]
for number in column_list:
    up_frame.columnconfigure(number, weight=1)
for number in row_list:
    up_frame.rowconfigure(number, weight=1)

#under_frameのconfigue
under_frame.columnconfigure(0, weight=1)
under_frame.columnconfigure(1, weight=1)
under_frame.columnconfigure(2, weight=1)

#上左側
#各ラベル
name_list = ["書誌番号", "タイトル", "著者", "出版年", "出版社", "形態", "ジャンル"]
for i, name in enumerate(name_list):
    label = tk.Label(up_frame, text=name)
    label.grid(row=i, column=0)

#各entry
number_entry = tk.Entry(up_frame)
title_entry = tk.Entry(up_frame)
author_entry = tk.Entry(up_frame)
time_entry = tk.Entry(up_frame)
publisher_entry = tk.Entry(up_frame)

entrys = [number_entry, title_entry, author_entry, time_entry, publisher_entry]
for i, entry in enumerate(entrys):
    entry.grid(row=i, column=1)

#combobox 
type_list = ['1', '2', '3']
type_choice_combo = ttk.Combobox(up_frame, state='readonly', values=type_list)
type_choice_combo.current(0)

#entry 
janle_entry = tk.Entry(up_frame)

#combo, entry設置
type_choice_combo.grid(column=1, row=5)
janle_entry.grid(column=1, row=6)

#上右側
note_label = tk.Label(up_frame, text='note')
note_label.grid(row=0, column=2, columnspan=2)
    
note_area = tk.Text(up_frame, width=25)
note_area.grid(row=1, column=2, columnspan=2, rowspan=6)

#under_frame
renew_bt = tk.Button(under_frame, text='データ更新', command=None)
delete_bt = tk.Button(under_frame, text='データ削除', command=None)
new_save_bt = tk.Button(under_frame, text='新規作成', command=None)

renew_bt.grid(row=0, column=0)
delete_bt.grid(row=0, column=1)
new_save_bt.grid(row=0, column=2)

#フレーム設置
up_frame.grid(row=0, column=0)
under_frame.grid(row=1, column=0)

window.mainloop()

投稿2022/12/07 03:24

編集2022/12/07 07:33
shirasu543
shirasu543

総合スコア4

teamikl
teamikl

2022/12/07 07:20

＞コードの長さを短縮するためfor文を追加し for で回すリスト内容が、添字と値を混同されてるので、 添字を値としているため問題なく動いていますが、 for 内で column_list[number] とアクセスするのは、この場合は間違いです。 column_list が連番で亡くなった場合に問題になるので、number でよいです。row_list も同様。 ちなみに、grid の row/column configure の第一引数は for で回さなくても python 3.x であれば、リストで一括指定可能です。
shirasu543
shirasu543

2022/12/07 07:34

御指摘ありがとうございます。先程修正いたしました。 python3.xについても勉強していきたいと思います。
guest

0

left_frameでフレーム内を７等分しているのと同じ比率で、right_frameも７等分し、１：６でnote_labelとnote_area(テキストフィールド)を設置したいのですが、

これは現際のフレーム構成では （リサイズ不可能の固定サイズにする以外は)
left_frame と right_frame に別れているので出来ません。
right_frame 側は left_frame がどのような配分かは知る事が出来ない為。

解決策:
同一フレーム上にgridで配置する必要があります。
左右のframeを廃止し、up_frame に
column=0 の row=0..6 に Label
column=1 に Entry
column=2 row=0 に note の Label
column=2 row=1 rowspan=6 に Text
という配置にして見て下さい。

イメージ説明

python
1import tkinter as tk
2
3root = tk.Tk()
4frame = tk.Frame(root)
5
6ROWS = 6
7for num in range(ROWS):
8    label = tk.Label(frame, text=f"{num:02}")
9    entry = tk.Entry(frame)
10
11    label.grid(row=num, column=0, pady=10, padx=5)
12    entry.grid(row=num, column=1, pady=10, padx=5)
13
14label = tk.Label(frame, text="Note")
15label.grid(row=0, column=2)
16text = tk.Text(frame)
17text.grid(row=1, column=2, rowspan=ROWS-1, padx=10, pady=10, sticky=tk.NSEW)
18
19frame.grid_rowconfigure(list(range(ROWS)), weight=1)
20frame.pack(fill=tk.BOTH, expand=tk.YES)
21root.mainloop()

投稿2022/10/02 04:47

編集2022/10/04 02:51
teamikl
teamikl

総合スコア8824

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

質問の解決につながる回答をしましょう。 サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。 また、読む側のことを考えた、分かりやすい文章を心がけましょう。

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.29%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問

トップTkinterに関する質問

tkinter tk.TEXTの表示崩れ