【python】tkinter编程三大布局管理器pack、grid、place应用实战解析

在这里插入图片描述

✨✨ 欢迎大家来到景天科技苑✨✨

🎈🎈 养成好习惯,先赞后看哦~🎈🎈

🏆 作者简介:景天科技苑
🏆《头衔》:大厂架构师,华为云开发者社区专家博主,阿里云开发者社区专家博主,CSDN全栈领域优质创作者,掘金优秀博主,51CTO博客专家等。
🏆《博客》:Python全栈,前后端开发,小程序开发,人工智能,js逆向,App逆向,网络系统安全,数据分析,Django,fastapi,flask等框架,linux,shell脚本等实操经验,网站搭建,数据库等分享。

所属的专栏:python图形化GUI编程tkinter精讲
景天的主页:景天科技苑

文章目录

  • tkinter布局管理器
    • 1.grid 布局管理器
    • 2.pack 布局管理器
    • 3.place 布局管理器

tkinter布局管理器

一个 GUI 应用程序必然有大量的组件,这些组件如何排布?
这时候,就需要使用 tkinter提供的布局管理器帮助我们组织、管理在父组件中子组件的布局方式。
tkinter 提供了三种管理器:pack、grid、place。

1.grid 布局管理器

grid 表格布局,采用表格结构组织组件。子组件的位置由行和列的单元格来确定,并
且可以跨行和跨列,从而实现复杂的布局。
在这里插入图片描述

【示例】grid 布局用法-登录界面设计

"""测试Grid布局管理器的基本用法,使用面向对象的方式"""

from tkinter import *
from tkinter import messagebox


class Application(Frame):

    def __init__(self, master=None):
        super().__init__(master)        # super()代表的是父类的定义,而不是父类对象
        self.master = master
        self.pack()
        self.createWidget()


    def createWidget(self):
        """通过grid布局实现登录界面"""
        self.label01 = Label(self,text="用户名")
        self.label01.grid(row=0,column=0,pady=10)
        self.entry01 = Entry(self)
        self.entry01.grid(row=0,column=1,pady=10)
        Label(self,text="用户名为手机号",foreground="gray").grid(row=0,column=2)

        Label(self, text="密码").grid(row=1, column=0,pady=10)
        self.entry02 = Entry(self, show="*")
        self.entry02.grid(row=1, column=1,pady=10)

        #EW表示组件在水平方向上拉满该栅格
        Button(self, text="登录",command=self.mylogin).grid(row=2, column=1, sticky=EW)
        Button(self, text="取消", command=root.destroy).grid(row=2, column=2, sticky=E)


    def mylogin(self):
        username = self.entry01.get()
        pwd = self.entry02.get()

        print("去数据库比对用户名和密码!")
        print("用户名:"+username)
        print("密码:"+pwd)

        if username=="13333333333" and pwd=="123456":
            messagebox.showinfo("景天科技苑学习系统", "登录成功!欢迎开始学习!")
        else:
            messagebox.showinfo("景天科技苑学习系统","登录失败!用户名或密码错误!")



if __name__ == '__main__':
    root = Tk()
    root.geometry("500x120+200+300")
    root.title("用户登录")
    app = Application(master=root)
    root.mainloop()

运行
在这里插入图片描述

当输入错误的用户名或密码
在这里插入图片描述

当输入正确的用户名和密码
在这里插入图片描述

【示例】基于grid布局的计算器软件的设计案例
根据实际简易计算器的按键分布,设计一个相仿的计算器界面,相应的功能暂不需要实现。
在这里插入图片描述

如上界面,实际可以设计成一个 7 行 4 列的表格布局,然后将相应的按钮放置进去即可。

"""计算器软件界面的设计"""

from tkinter import *
from tkinter import messagebox
import random



class Application(Frame):

    def __init__(self, master=None):
        super().__init__(master)        # super()代表的是父类的定义,而不是父类对象
        self.master = master
        self.pack()
        self.createWidget()


    def createWidget(self):
        """通过grid布局实现计算器的界面"""
        btnText = (("MC","M+","M-","MR"),
                   ("C","±","/","x"),
                   (7,8,9,"-"),
                   (4,5,6,"+"),
                   (1,2,3,"="),
                   (0,"."))

        Entry(self).grid(row=0,column=0,columnspan=4,pady=10)

        for rindex,r in enumerate(btnText):
            for cindex,c in enumerate(r):
                if c == "=":
                    #等号跨行
                    Button(self,text=c,width=2)\
                    .grid(row=rindex+1,column=cindex,rowspan=2,sticky=NSEW)
                elif c == 0:
                    #0跨列
                    Button(self,text=c,width=2)\
                    .grid(row=rindex+1,column=cindex,columnspan=2,sticky=NSEW)               
                elif c == ".":
                    # 由于0跨列了,所以点的列要加1
                    Button(self,text=c,width=2)\
                    .grid(row=rindex+1,column=cindex+1,sticky=NSEW)
                else:
                    #其他普通的正常显示
                    Button(self,text=c,width=2)\
                    .grid(row=rindex+1,column=cindex,sticky=NSEW)


if __name__ == '__main__':
    root = Tk()
    root.geometry("230x230+200+300")
    root.title('科学计算器')
    app = Application(master=root)
    root.mainloop()

运行,显示计算器界面
在这里插入图片描述

【示例】带有计算功能的计算器

import tkinter as tk

def calculate(event):
    """根据用户输入计算结果并显示"""
    try:
        result = eval(entry.get())
        entry.delete(0, tk.END)
        entry.insert(tk.END, str(result))
    except Exception as e:
        entry.delete(0, tk.END)
        entry.insert(tk.END, "Error")

def button_click(number):
    """在输入框中添加点击的数字或符号"""
    current = entry.get()
    entry.delete(0, tk.END)
    entry.insert(tk.END, current + str(number))

# 初始化Tkinter窗口
root = tk.Tk()
root.title("简易计算器")
root.geometry("400x360+500+300")

# 创建一个输入框用于显示和输入数字
entry = tk.Entry(root, width=40, borderwidth=6)
entry.bind("<Return>", calculate)  # 绑定回车键触发计算
entry.grid(row=0, column=0, columnspan=4, padx=10, pady=10)

# 定义按钮
buttons = [
    ('7', 1, 0), ('8', 1, 1), ('9', 1, 2), ('/', 1, 3),
    ('4', 2, 0), ('5', 2, 1), ('6', 2, 2), ('*', 2, 3),
    ('1', 3, 0), ('2', 3, 1), ('3', 3, 2), ('-', 3, 3),
    ('0', 4, 0), ('.', 4, 1), ('=', 4, 2), ('+', 4, 3)
]

# 创建按钮并放置在界面上
for (text, row, col) in buttons:
    if text == "=":
        tk.Button(root, text=text, padx=35, pady=20, command=lambda: calculate(None)).grid(row=row, column=col)
    else:
        tk.Button(root, text=text, padx=35, pady=20, command=lambda t=text: button_click(t)).grid(row=row, column=col)

# 运行Tkinter事件循环
root.mainloop()

运行
在这里插入图片描述

按下等号得到结果
在这里插入图片描述

2.pack 布局管理器

pack 按照组件的创建顺序将子组件添加到父组件中,按照垂直或者水平的方向自然排
布。如果不指定任何选项,默认在父组件中自顶向下垂直添加组件。
pack 是代码量最少,最简单的一种,可以用于快速生成界面。
pack()参数详解:
编写一个程序的界面,就是要把各个组件,以适当大小,定位到界面的某个位置。
  tkinter以提供3种界面组件布局管理的方法,分别是:pack,grid,place 这篇文章先来讲解pack 方法。
  pack() 方法的参数有:side, fill, padx/pady, ipadx/ipady, anchor, expand等。
在这里插入图片描述

【老鸟建议】如上列出了 pack 布局所有的属性,但是不需要挨个熟悉,了解基本的即可。
pack 适用于简单的垂直或水平排布,如果需要复杂的布局可以使用 grid 或 place。

【示例】pack 布局用法,制作钢琴按键布局

# 测试pack布局管理

from tkinter import *

root = Tk()
root.geometry("700x220")
root.title('钢琴按键分布')

# Frame是一个矩形区域,就是用来放置其他子组件
f1 = Frame(root)
f1.pack()
f2 = Frame(root)
f2.pack()

btnText = ("流行风","中国风","日本风","重金属","轻音乐")

for txt in btnText:
    Button(f1,text=txt).pack(side="left",padx="10")

for i in range(1,13):
    Label(f2,width=5,height=10,borderwidth=1,relief="solid",
          bg="black" if i%2==0 else "white").pack(side="left",padx=2)

root.mainloop()

运行效果
在这里插入图片描述

3.place 布局管理器

place 布局管理器可以通过坐标精确控制组件的位置,适用于一些布局更加灵活的场景。
Place 布局就是其他 GUI 编程中的“绝对布局”,这种布局方式要求程序显式指定每个组件的绝对位置或相对于其他组件的位置。

如果要使用 Place 布局,调用相应组件的 place() 方法即可。在使用该方法时同样支持一些详细的选项,关于这些选项的介绍如下:
在这里插入图片描述在这里插入图片描述

【示例】place 布局管理-基本用法测试

from tkinter import *

root = Tk();root.geometry("500x300")
root.title("布局管理place");root["bg"]="white"

f1 = Frame(root,width=200,height=200,bg="green")
#组件在坐标轴上的绝对位置
f1.place(x=30,y=30)

#如果relx和x同时出现,先根据relx计算距离父组件最左边位置,然后再根据x来加减x像素的位置
Button(root,text="景天科技苑").place(relx=0.2,x=100,y=20,relwidth=0.2,relheight=0.5)
Button(f1,text="百战程序员").place(relx=0.6,rely=0.7)
Button(f1,text="景天老师").place(relx=0.5,rely=0.2)
root.mainloop()

运行,景天科技苑按钮中,通过place布局,同时出现了x和relx,现根据relx计算相对于父组件的布局,然后再根据x来计算绝对布局
在这里插入图片描述

【示例】place 布局管理-扑克牌游戏 demo

"""扑克牌游戏的界面设计"""

from tkinter import *


class Application(Frame):

    def __init__(self, master=None):
        super().__init__(master)        # super()代表的是父类的定义,而不是父类对象
        self.master = master
        self.pack()
        self.createWidget()


    def createWidget(self):
        """通过place布局管理器实现扑克牌位置控制"""
        # self.photo = PhotoImage(file="imgs/puke/puke1.gif")
        # self.puke1 = Label(self.master,image=self.photo)
        # self.puke1.place(x=10,y=50)

        #10张牌的gif图片
        #循环拿出扑克牌
        self.photos = [PhotoImage(file="imgs/puke/puke"+str(i+1)+".gif") for i in range(10)]
        self.pukes = [Label(self.master,image=self.photos[i]) for i in range(10)]

        #将10张扑克布局,折叠形式展示
        for i in range(10):
            self.pukes[i].place(x=50+i*40,y=50)


        # 为所有的Label增加事件处理,<Button-1>表示单击左键
        self.pukes[0].bind_class("Label","<Button-1>",self.chupai)

    def chupai(self,event):
        #event表示事件,包含了被点击的是哪个组件
        #event.widget.winfo_geometry()表示组件的坐标信息
        print(event.widget.winfo_geometry())
        #event.widget.winfo_y()表示组件的y轴坐标信息
        print(event.widget.winfo_y())

        #点击鼠标出牌,如果未出牌,点击某张牌,该牌高度上移30,如果已出牌,就恢复到默认高度50
        if event.widget.winfo_y() == 50:
            event.widget.place(y=30)
        else:
            event.widget.place(y=50)


if __name__ == '__main__':
    root = Tk()
    root.geometry("600x270+200+300")
    root.title('扑克牌游戏')
    app = Application(master=root)
    root.mainloop()

运行
在这里插入图片描述

点击某张牌,会上移
在这里插入图片描述

再点一下,会恢复
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mfbz.cn/a/708670.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

【成品设计】基于STM32的单相瞬时值反馈逆变器

《基于STM32的单相瞬时值反馈逆变器》 整体功能&#xff1a; 图13 软件框图 如图13所示&#xff0c;由于本设计中需要通过定时器中断执行一些程序&#xff0c;故首先对中断进行初始化。中断初始化以后即为对串口进行初始化&#xff0c;总共初始化了两个串口&#xff0c;第一个…

攻防演练之-成功的钓鱼邮件溯源

书接上文&#xff0c;《网络安全攻防演练风云》专栏之攻防演练之-网络安全产品大巡礼二&#xff0c;这里。 演练第一天并没有太大的波澜&#xff0c;白天的时间过得很快。夜色降临&#xff0c;攻防演练中心内的灯光依旧明亮。对于网络安全团队来说&#xff0c;夜晚和白天并没有…

2024 年勒索软件将比以往更加残酷

如今&#xff0c;世界各地的人们去学校、去医院或去药店时&#xff0c;都会被告知&#xff1a;“抱歉&#xff0c;我们的计算机系统瘫痪了。” 罪魁祸首往往是在世界另一端活动的网络犯罪团伙&#xff0c;他们会要求人们支付系统访问费用或安全归还被盗数据。 尽管警方加大打…

Python数据分析与机器学习在医疗诊断中的应用

文章目录 &#x1f4d1;引言一、数据收集与预处理1.1 数据收集1.2 数据预处理 二、特征选择与构建2.1 特征选择2.2 特征构建 三、模型选择与训练3.1 逻辑回归3.2 随机森林3.3 深度学习 四、模型评估与调优4.1 交叉验证4.2 超参数调优 五、模型部署与应用5.1 模型保存与加载5.2 …

数据治理新视角:质量与真实度提升,让数据更有价值!

在这个信息爆炸的时代&#xff0c;数据已经成为企业决策的重要依据。然而&#xff0c;数据的质量与真实度却往往成为制约其价值发挥的关键因素。本文将为您揭示数据治理的新视角&#xff0c;探讨如何提升数据质量与真实度&#xff0c;让数据真正发挥其应有的价值&#xff01; 数…

机器学习与数据挖掘知识点总结(二)分类算法

目录 1、什么是数据挖掘 2、为什么要有数据挖掘 3、数据挖掘用在分类任务中的算法 朴素贝叶斯算法 svm支持向量机算法 PCA主成分分析算法 k-means算法 决策树 1、什么是数据挖掘 数据挖掘是从大量数据中发现隐藏在其中的模式、关系和规律的过程。它利用统计学、机器学…

GaussDB技术解读——GaussDB架构介绍(三)

目录 9 智能关键技术方案 智能关键技术一&#xff1a;自治运维系统 智能关键技术二&#xff1a;库内AI引擎 智能关键技术三&#xff1a;智能优化器 10 驱动接口关键技术方案 GaussDB架构介绍&#xff08;二&#xff09;从数据持久化存取层(DataNode)关键技术方案、全局事…

记一次 .NET某工控视觉自动化系统 卡死分析

一&#xff1a;背景 1. 讲故事 今天分享的dump是训练营里一位学员的&#xff0c;从一个啥也不会到现在分析的有模有样&#xff0c;真的是看他成长起来的&#xff0c;调试技术学会了就是真真实实自己的&#xff0c;话不多说&#xff0c;上windbg说话。 二&#xff1a;WinDbg …

通用大模型与垂直大模型:双轨并进的人工智能未来

在人工智能(AI)的浩瀚宇宙中&#xff0c;大模型以其强大的学习能力和广泛的适用性&#xff0c;正逐步成为推动技术进步和产业革新的核心动力。在这股浪潮中&#xff0c;通用大模型与垂直大模型如同两颗璀璨的星辰&#xff0c;各自散发着独特的光芒&#xff0c;共同照亮了AI发展…

用python脚本转换图片分辨率

一、使用说明 确定已经安装python&#xff0c;且版本3.6以上&#xff0c;可以用下面指令查看python版本&#xff1a;python --version 配置环境&#xff0c;第一次使用先配置环境&#xff0c;后面不需要 把要转换的图片放到"img"文件夹下 转换&#xff0c;结果保存…

Spring Security——基于MyBatis

目录 项目总结 新建一个项目 pom.xml application.properties配置文件 User实体类 UserMapper映射接口 UserService访问数据库中的用户信息 WebSecurityConfig配置类 MyAuthenticationFailureHandler登录失败后 MyAuthenticationSuccessHandlerw登录成功后 WebSecur…

c++实现二叉搜索树(中)

小吉我今天更新了&#xff0c;惊不惊喜&#xff0c;意不意外&#xff0c;更新频率非常好&#xff08;棒棒的&#xff09;。小吉计划把二叉搜索树的知识更新完&#xff08;预计在这几天更完&#xff09;&#xff0c;然后会有一段时间停更&#xff0c;因为小吉我要准备期末考试&a…

5-1RT-Thread互斥量

5-1RT-Thread互斥量 互斥量斥量的管理方式 互斥量 互斥量又称为互斥型信号量&#xff0c;是一种特殊的二值信号量。以超市的储物柜为例&#xff0c;当用户A存入物品并关闭柜门&#xff0c;则用户A就获得了此格柜子的使用权。此时其他用户无法使用此个柜子&#xff0c;只有当用户…

Idea jdk配置的地方 启动时指定切换的地方

jdk 配置的地方 项目sdk 所在位置 管理添加或删除的地方&#xff0c;增加后&#xff0c;可以在在上面切换 启动时指定版本

正点原子imx6ull 进度条颜色、logo位置上偏或色偏等问题

正点原子imx6ull 进度条改颜色 logo位置上偏或显示色偏等问题 开机进度条logo问题进度条界面全屏logo位置上偏进度条界面logo其他问题进度条界面去掉中间这条杠 uboot界面logo问题不显示uboot界面的打印信息uboot显示logo不理想uboot不显示logo 开机进度条logo问题 进度条界面…

媲美Sora,免费使用!带物理模拟的,文生视频模型

6月13日&#xff0c;知名3D建模平台Luma AI发布最新文生视频模型Dream Machine&#xff0c;向所有用户免费开放使用。 Dream Machine除了支持文本之外&#xff0c;还可使用图片作为引导来生成视频&#xff0c;其生成的视频质量、动作一致性、色彩、光影、饱和度、运镜等方面&a…

EE trade:港股开户指南及所需条件

开通港股账户是许多投资者希望参与香港股票市场的重要步骤。以下是详细的港股开户要求和条件&#xff0c;以及开户流程和注意事项。 一、港股开户的基本条件 1. 证券账户及资金要求 A股证券账户&#xff1a;个人客户申请开通港股账户&#xff0c;需要已经开通上海或深圳的A股…

【YOLOv5/v7改进系列】改进池化层为RT-DETR的AIFI

一、导言 Real-Time DEtection TRansformer&#xff08;RT-DETR&#xff09;&#xff0c;是一种实时端到端目标检测器&#xff0c;克服了Non-Maximum Suppression&#xff08;NMS&#xff09;对速度和准确性的影响。通过设计高效的混合编码器和不确定性最小化查询选择&#xf…

优思学院|如何选择六西格玛黑带的项目?

不管六西格玛的实施着重于变革式的还是渐进式的目标&#xff0c;项目都是六西格玛最核心的部分。选择和使用组织中最好的人才本身并不一定能保证达到最好的结果&#xff0c;项目的选取是领导层无可推卸的责任。选择一个项目意味着什么&#xff1f;领导团队必须将无数的问题、困…

【启明智显分享】Model系列工业级HMI芯片:开源RISC-V+RTOS实时系统,开放!高效!

前言 「Model系列」芯片是启明智显针对工业、行业以及车载产品市场推出的系列HMI芯片&#xff0c;主要应用于工业自动化、智能终端HMI、车载仪表盘、两轮车彩屏仪表、串口屏、智能中控、智能家居、充电桩显示屏、储能显示屏、工业触摸屏等领域。此系列具有高性能、低成本的特点…