前面，學委寫了一個保姆級别UI教程，展示了 【 一個視窗放兩個按鈕，點選來提示不同消息
】，挺受歡迎的。
但那布局比較簡單，本來打算安排開發簽到程式的，但有必要教會一下布局（打好基礎之後，幹啥都快，還能勝任複雜的UI應用開發！）
什麼是布局？
布局就是謀劃部署幹一件大事，跑偏了。這裡的布局描述的是UI應用中的元件擺放。
簡單了解布局，就像搞室内設計定制一樣，在大廳定制個桌椅，搞個茶具，通過精心布置設計讓住戶心情愉悅！
搞UI類/界面應用開發，也是如此，再界面放置幾個按鈕，表格，給使用者直接操作回報資料（這個也是開發需要掌握學習的基礎，就加進來分享了）
好了，Python内置的Tk UI套件有三種布局，但是下面主要談談Grid（網格布局）。
談談Tk的網格布局
網格布局，很直覺，就是網格化，像表格一樣
第一行第一列 第一行第二列
第二行第一列 第二行第二列
這就是網格布局的原型了，沒錯就這麼簡單。我們将要開發的UI應用如下：
2x2 的表格布局，上面放置4個按鈕，每行兩個。
直接看下面代碼
這個代碼在前一篇的基礎上修改，使用grid方法，傳入了一些方位的參數。
儲存下面代碼為tkui_lxw_demo.py并運作。
# -*- coding: utf-8 -*-
# @Time : 2021/8/29 11:58 上午
# @Author : LeiXueWei
# @CSDN/Juejin/Wechat: 雷學委
# @XueWeiTag: CodingDemo
# @File : tkui_layout.py
# @Project : hello
from tkinter import *
import tkinter.messagebox as mb
top = Tk()
top.title("雷學委的Tkinter布局Demo")
top.geometry('600x400')
def open_msg_box():
mb.showinfo("[學委溫馨提示]", "簡單的消息彈出視窗！")
def open_err_box():
mb.showerror("[學委溫馨提示]", "示範錯誤消息視窗！")
#這裡加上01和02在按鈕顯示文本上。
first = Button(top, text="點選01->檢視消息", fg="tomato", command=open_msg_box)
second = Button(top, text="點選02->檢視錯誤", fg="tomato", command=open_err_box)
#學委前一篇文章這裡注釋掉
# first.pack()
# second.pack()
#--- 雷學委CSDN代碼展示 ---#
#然後添加兩個按鈕放在第二行
button03 = Button(top, text="點選03->檢視消息", fg="tomato", padx=8, pady=8,
background="blue",
highlightbackground="blue")
button04 = Button(top, text="點選04->檢視錯誤", fg="tomato", padx=8, pady=8,
background="green",
highlightbackground="green")
#好，下面學委展示用grid布局（也就是網格布局）
first.grid(row=0, column=0, sticky=W)
second.grid(row=0, column=1, sticky=W)
button03.grid(row=1, column=0, sticky=W)
button04.grid(row=1, column=1, sticky=W)
#老套路，調用事件循環保持UI程式不退出。
top.mainloop()
代碼講解
通過觀察，我們主要是使用了grid函數，它接受了3個參數。
- row 把ui元件放在第幾排，從0開始
- column 把ui元件放在第幾列，從0開始
- sticky 放置的方位W是表示朝向西邊。
上面的grid放置元件的代碼就是告訴程式：
學會了嗎？運作程式就能看到上面的布局了。
in或in_ 這個選項，可以将該元件放到該選項指定的父元件中, 指定的元件必須是該元件的父元件。這個預設即可。
我們下面試試把，上面的表格可以多看無需記憶！
代碼如下：
這裡學委不貼全部了，直接在上面代碼的按鈕3(就是這一行開始*#— 雷學委CSDN代碼展示 —#*)的位置開始覆寫為下面的代碼。
儲存檔案，重新運作即可。
#--- 雷學委CSDN代碼展示 ---#
# 然後添加兩個按鈕放在第二行
button03 = Button(top, text="點選03->檢視消息", fg="tomato", padx=8, pady=8,
background="blue",
highlightbackground="blue")
button04 = Button(top, text="點選04->檢視錯誤", fg="tomato", padx=8, pady=8,
background="green",
highlightbackground="green")
button05 = Button(top, text="點選05 放滿第三行", fg="tomato", padx=8, pady=8,
background="green",
highlightbackground="green")
# 好，下面學委展示用grid布局（也就是網格布局）
first.grid(row=0, column=0, sticky=W)
second.grid(row=0, column=1, sticky=W)
button03.grid(row=1, column=0, sticky=W)
button04.grid(row=1, column=1, sticky=W)
button05.grid(row=2, column=0, columnspan=2, sticky=W+E) #放在在第三排，列合并，同時設定W+E鋪滿第三列。
# 老套路，調用事件循環保持UI程式不退出。
top.mainloop()
延伸
很多大型複雜的UI其實就是一個一個網格布局不斷套用疊代起來的。掌握上面的核心布局可以推演，開發出更多層次的界面。
Tk還有其他兩種布局，學委主要并非UI開發，我認為另外的要麼過于粗放要麼過于細緻，不便于快速開發（喜歡細摳的可以看看place布局）。布局思想不僅限于Tk，或者Python，很多UI方案都有類似的概念（流式布局，網格布局，精準位置擺放），掌握一種其實可以通吃，因為雷學委十年前就玩Swing應用開發很熟練了。。。
後面再分享更多應用，沒事多把上面的參數試試。
如果讀到這，會想一下上面第一排的按鈕都有很大縫隙的？請問怎麼鋪滿？歡迎評論區作答。