質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

ただいまの
回答率

88.91%

Python(TkInter)  GUIアプリの開発を終えて 自分の端末以外で 実行したら 同じ画面イメージで表示されなかった

解決済

回答 1

投稿 編集

  • 評価
  • クリップ 0
  • VIEW 231

saya24

score 140

標題の件、大変初歩的なことと思いますが 教えてください。

解像度が異なる端末であっても
自分が 従来まで開発してきた端末と同じように各フォームを表示させたいのですが、悉く無駄な余白が現れ
同じように表示されていませんでした。

自分の開発端末で表示されてたイメージ同様、縦横の縮尺率だけが違うだけの 表示を達成するには どういった設定を行う・気を付ければよいでしょうか

ご見解を頂けたら幸いです、よろしくお願いします。

20200703 14:45 現況コードと画像追加

from tkinter import *
import tkinter.ttk as ttk
import tkinter.scrolledtext as tksc
import math



class Apprication(ttk.Frame):

    def __init__(self, app):


        super().__init__(app)
        self.pack(fill = BOTH, expand=True)

        btn1 = ttk.Button(self, text="Script", command=self.openDialog1)
        btn1.bind('<Return>', self.openDialog1)
        btn1.pack(fill = BOTH, expand=True)
        btn1.focus_set()

        btn2 = ttk.Button(self, text="Mail")
        btn2.pack(fill = BOTH, expand=True)

        btn3 = ttk.Button(self, text="Job")
        btn3.pack(fill = BOTH, expand=True)

        btn4 = ttk.Button(self, text="Quit", command=app.quit)
        btn4.bind('<Return>', lambda _: app.quit())
        btn4.pack(fill = BOTH, expand=True) 

        self.menu()



    def menu(self):
        menu_top = Menu(app)
        menu_file = Menu(menu_top, tearoff=False)
        menu_open = Menu(menu_top, tearoff=False)

        menu_help = Menu(menu_top, tearoff=False)   #★


        app.configure(menu=menu_top, bg="#F0FFFF")

        menu_top.add_cascade (label='File(F)', menu=menu_file, underline=0)
        #★menu_top.add_command(label='Help(H)', underline=0)
        menu_top.add_cascade(label='Help(H)', menu=menu_help, underline=0)  #★

        menu_file.add_cascade(label='Open(O)', underline=0, menu=menu_open)
        menu_open.add_command(label='Script(S)', underline=0, command=self.openDialog1) 
        menu_open.add_command(label='Job(J)', underline=0) 
        menu_open.add_command(label='Mail(M)', underline=0)
        menu_file.add_command(label='Quit(Q)',underline=0, command=app.quit)

        #★
        menu_help.add_command(label='Display(D)', underline=0) 
        menu_help.add_command(label='Version(V)', underline=0)
        #★




    # 子画面①開く Script Menu
    def openDialog1(self, event=None):

        global pngfile

        # メモリにDB一覧を作る




        self.dialog = Toplevel(self)
        self.dialog.title("Script Menu")

        #フォームサイズを実行端末から導き、ド真中に配置表示
        lw = math.ceil(ww * 0.408)
        lh = math.ceil(wh * 0.477)
        self.dialog.geometry(str(lw)+"x"+str(lh)+"+"+str(int(ww/2-lw/2))+"+"+str(int(wh/2-lh/2)))

        self.dialog.configure(bg="#F0FFFF")
        self.dialog.resizable(0,0)
        self.dialog.protocol('WM_DELETE_WINDOW', (lambda: 'pass')())

        # 当該ダイアログのカーソルを変更し、関数側でもカーソルを変更できるように
        self.dialog['cursor'] = 'hand2'
        self.this = self.dialog

        # modalに
        self.dialog.grab_set()



        # DataBaseを選択するためのコンボボックス
        self.cmbox1 = ttk.Combobox(self.dialog, width=5, justify=CENTER, state='readonly', takefocus=1)
        self.cmbox1.grid(row=0, column=0, padx=(10, 0), pady=(10,0), sticky=W+E)
        self.cmbox1.focus_set()

        # DataBaseという文字
        self.txt1 = Entry(self.dialog, state="readonly", takefocus=1)
        self.txt1.grid(row=0, column=1, columnspan=7, sticky=W+E, pady=(10,0))




        # 登録SQL文のコンボボックス
        self.v2 = StringVar()
        self.cmbox2 = ttk.Combobox(self.dialog, width=5, justify=CENTER, state='disable', textvariable=self.v2, takefocus=1)
        self.cmbox2.grid(row=1, column=0, padx=(10, 0), sticky=W+E)

        self.txt2 = Entry(self.dialog, state="readonly", takefocus=1)
        self.txt2.grid(row=1, column=1, columnspan=7, sticky=W+E)

        # 登録SQL文のコンボボックスの有効無効切替え
        self.chbox1_var = BooleanVar(self.dialog)
        self.chbox1 = Checkbutton(self.dialog, variable=self.chbox1_var, bg="#F0FFFF", takefocus=1, activebackground="#F0FFFF")
        self.chbox1.grid(row=1, column=8)

        self.btn4 =  Button(self.dialog, text='Delete', state=DISABLED, takefocus=1)
        self.btn4.grid(row=1, column=10, padx=(0,10), sticky=W+E)




        # 発行するSQL文の入力エリア
        self.scrtxt1 = tksc.ScrolledText(self.dialog, bg="black", fg="orange", font=("Helvetica",11), insertbackground="orange", blockcursor=False, height=6, state="disable", takefocus=1)
        self.scrtxt1.grid(row=2, column=0, columnspan=11, sticky=W+E, padx=10)

        self.update()
        scrtxt1_width = self.scrtxt1.winfo_width()
        scrtxt1_height = self.scrtxt1.winfo_height()
        middle_x = scrtxt1_width / 2
        middle_y = scrtxt1_height / 2

        self.cvs = Canvas(self.dialog, height=scrtxt1_height)
        self.cvs.create_image(middle_x, middle_y, anchor=CENTER)
        self.cvs.grid(row=2, column=0, columnspan=11, sticky=W+E, padx=10)




        self.lb1 = Label(self.dialog, bg="#F0FFFF", fg="red")
        self.lb1.grid(row=3, column=0, padx=(10, 0), pady=(0, 20), sticky=N+W)

        self.lb2 = Label(self.dialog, bg="#F0FFFF", fg="red")
        self.lb2.grid(row=3, column=2, pady=(0, 20), sticky=N+W)

        # SQL文の表示を許すか許さないかの切替え
        self.chbox2_var = BooleanVar(self.dialog)
        self.chbox2 = Checkbutton(self.dialog, variable=self.chbox2_var, bg="#F0FFFF", takefocus=1, activebackground="#F0FFFF")
        self.chbox2.grid(row=3, column=8, pady=(0, 40), )

        # ★SQL発行ボタン★
        self.btn1  = Button(self.dialog, text='Execute', width=10, state=DISABLED, takefocus=1)
        self.btn1.grid(row=3, column=10, pady=(0, 20), padx=(0,10), sticky=N)




        # SQL発行結果(表示専用)
        self.scrtxt2 = tksc.ScrolledText(self.dialog, bg="SystemButtonFace", font=("Helvetica",11), height=6, takefocus=1)
        self.scrtxt2.grid(row=4, column=0, columnspan=11, sticky=W+E, padx=10)




        # SQL登録ボタン
        self.btn2 =  Button(self.dialog, text='Save', state=DISABLED, takefocus=1)
        self.btn2.grid(row=5, column=0, padx=(10,0), sticky=W+E)

        # SQL登録ID
        self.lb3 = Label(self.dialog, bg="black", fg="orange", width=7, takefocus=1)
        self.lb3.grid(row=5, column=1, sticky=W+E)

        self.txt3 = Entry(self.dialog, state='readonly', takefocus=1)
        self.txt3.grid(row=5, column=2, columnspan=10, sticky=W+E, padx=(0,10))




        # EXCEL出力ボタン
        self.btn3 =  Button(self.dialog, text='Excel', state=DISABLED, takefocus=1)
        self.btn3.grid(row=6, column=0, padx=(10,0), sticky=W+E)

        self.prbar1 = ttk.Progressbar(self.dialog, orient=HORIZONTAL, length=100, mode='determinate')
        self.prbar1.grid(row=6, column=1, columnspan=3, pady=(5,0), sticky=N+W)

        # SQL文の提供を受けることを想定し インポートメニューを追加
        btn5 = Button(self.dialog, text='Import', width=10, takefocus=1)
        btn5.grid(row=6, column=8, pady=10)


        # 閉じるボタン
        btn4 = Button(self.dialog, text='Quit', command=self.closeDialog, width=10, takefocus=1)
        btn4.grid(row=6, column=10, pady=10, padx=(0,10))
        btn4.bind('<Return>', self.closeDialog)



        self.dialog.grid_rowconfigure(1, weight=1)
        self.dialog.grid_rowconfigure(3, weight=1)

        self.dialog.grid_columnconfigure(2, weight=1)





    # 子画面閉じる
    def closeDialog(self, event=None):
        self.dialog.destroy()



if __name__ == '__main__':

    #世間でいうrootをappとしています
    app  = Tk()

    #実行端末の画面サイズを取得
    ww = app.winfo_screenwidth()
    wh = app.winfo_screenheight()

    app.update_idletasks()

    #フォームサイズを実行端末から導き、ド真中に配置表示
    lw = math.ceil(ww * 0.208)
    lh = math.ceil(wh * 0.277)
    app.geometry(str(lw)+"x"+str(lh)+"+"+str(int(ww/2-lw/2))+"+"+str(int(wh/2-lh/2)) )

    #タイトルを指定
    app.title("Main Menu")


    #フォームの最大化、×ボタン操作を無効化
    app.resizable(0,0)
    app.protocol('WM_DELETE_WINDOW', (lambda: 'pass')())

    # カーソル変更
    app["cursor"] = "hand2"



    # フレームを作成する
    frame =  Apprication(app)
    # 格納したTkインスタンスのmainloopで画面を起こす
    app.mainloop()


端末Aでの実行(立ち上げ時メニューでSCRIPTを押してください)
大きな解像度での実行
端末Bでの実行(立ち上げ時メニューでSCRIPTを押してください)
SCRIPT

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

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

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

    クリップを取り消します

  • 良い質問の評価を上げる

    以下のような質問は評価を上げましょう

    • 質問内容が明確
    • 自分も答えを知りたい
    • 質問者以外のユーザにも役立つ

    評価が高い質問は、TOPページの「注目」タブのフィードに表示されやすくなります。

    質問の評価を上げたことを取り消します

  • 評価を下げられる数の上限に達しました

    評価を下げることができません

    • 1日5回まで評価を下げられます
    • 1日に1ユーザに対して2回まで評価を下げられます

    質問の評価を下げる

    teratailでは下記のような質問を「具体的に困っていることがない質問」、「サイトポリシーに違反する質問」と定義し、推奨していません。

    • プログラミングに関係のない質問
    • やってほしいことだけを記載した丸投げの質問
    • 問題・課題が含まれていない質問
    • 意図的に内容が抹消された質問
    • 過去に投稿した質問と同じ内容の質問
    • 広告と受け取られるような投稿

    評価が下がると、TOPページの「アクティブ」「注目」タブのフィードに表示されにくくなります。

    質問の評価を下げたことを取り消します

    この機能は開放されていません

    評価を下げる条件を満たしてません

    評価を下げる理由を選択してください

    詳細な説明はこちら

    上記に当てはまらず、質問内容が明確になっていない質問には「情報の追加・修正依頼」機能からコメントをしてください。

    質問の評価を下げる機能の利用条件

    この機能を利用するためには、以下の事項を行う必要があります。

質問への追記・修正、ベストアンサー選択の依頼

  • hope_mucci

    2020/07/03 16:21

    端末の画像解像度に合わせてウィンドウサイズを変更していますが、それは必要な要件なのでしょうか?

    キャンセル

  • saya24

    2020/07/03 16:27

    いえ、必要ない要件です。

    ただ、ウィンドウサイズを 可変にさせないと 大きな画像のモニタに フォームが極小で表示されてしまったりしないかを 懸念致しました。

    ひょっとして、開発端末と同一の 画像サイズ(縦×横 比率)でないと、同じデザインを保てない、ということでしょうか?? ほんと初心者で 分からないんです。

    キャンセル

  • hope_mucci

    2020/07/03 16:34

    医療用モニタや8Kモニタにdot by dotで表示させない限りは読めないほど小さくならないのでは・・・

    キャンセル

回答 1

checkベストアンサー

0

レイアウトが崩れるのはモニタ解像度によりgeometryでウィンドウサイズを変更しているのが原因です。

app.geometry(str(lw)+"x"+str(lh)+"+"+str(int(ww/2-lw/2))+"+"+str(int(wh/2-lh/2)) )


コメントを見る限りウィンドウサイズは固定でよさそうなので初期表示位置を設定する用途だけに使ってください。

投稿

  • 回答の評価を上げる

    以下のような回答は評価を上げましょう

    • 正しい回答
    • わかりやすい回答
    • ためになる回答

    評価が高い回答ほどページの上位に表示されます。

  • 回答の評価を下げる

    下記のような回答は推奨されていません。

    • 間違っている回答
    • 質問の回答になっていない投稿
    • スパムや攻撃的な表現を用いた投稿

    評価を下げる際はその理由を明確に伝え、適切な回答に修正してもらいましょう。

  • 2020/07/03 22:44

    仰るとおりでした!
    私にとっては貴重なアドバイスでした。ありがとうございます。

    キャンセル

  • 2020/07/06 17:20

    引用頂きましたコードで ww と wh というのが 端末からの画面サイズなのですが
    この比率、つまりは 縦と横の関係さえ維持すれば 開発端末で表示されていフォームイメージが どの端末でも 同じように表示されると思っていたら....違うのですねぇ!!!! 今日改めて気が付きました。

    モニター違いで、縮尺率だけ変わって同じ範囲の内容表示をするのなら 上記ロジックが成り立つのでしょうが 決して そうじゃないんですね?????

    表示できる範囲さえも 変わってくるのですね!(行数とか)

    だから みなさん わざわざ 大きな外付けモニタを購入するのですねぇ....
    今更ですが

    キャンセル

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

  • ただいまの回答率 88.91%
  • 質問をまとめることで、思考を整理して素早く解決
  • テンプレート機能で、簡単に質問をまとめられる

関連した質問

同じタグがついた質問を見る

  • トップ
  • Pythonに関する質問
  • Python(TkInter)  GUIアプリの開発を終えて 自分の端末以外で 実行したら 同じ画面イメージで表示されなかった