首页 > 其他分享 >Tkinter制作登录界面以及登陆后页面切换

Tkinter制作登录界面以及登陆后页面切换

时间:2024-09-25 14:48:38浏览次数:12  
标签:__ 界面 self label tk Tkinter button def 页面

Tkinter制作登录界面以及登陆后页面切换

前言

本帖子,默认您已了解Tkinter的基础操作,以及原理,文中仅会对部分逻辑描述,不会对Tkinter讲解.

序言

1. 由来

入职以来,很长时间都是在做网页版的后台,用到最多的就是Java语言,框架主要是:Spring Boot,Spring Cloud 。中间件大多用:Mq,Redis,Nacos等,但是随着项目的发展,网页版已经无法满足客户的需求以及业务生态的发展,需要增加客户端应用,由于公司没有此类开发经验,重担就留给了俺,一个小趴菜(报头痛哭)…好了,废话不多说,开搞。说到客户端第一时间想到的就是python的PyQt5,因为以前了解过。但是随着深入了解,好是好,功能也齐全,但是由于作者比较笨,也比较懒实在不想去烧脑学习了,就盯上了较为简单快捷的Tkinter。

2. 思路

制作客户端主要流程被我分为(不考虑后台服务情况下):明白需求(了解业务)、设计架构(主要是使用的语言以及怎么模块化开发,方便后续升级管理)、打包部署(Inno setup 打包)、测试调优(测试人员)。

3. 项目结构描述

下文中出现的如: login/ui.py 这样的文件名称时则代表的是,在包login下的ui.py文件,后续可以自行修改。

4. 项目实战

1. 登录界面实现(代码)

  1. 图片展示:
    在这里插入图片描述

  2. login/ui.py

    from tkinter import *
    from tkinter.ttk import *
    
    
    class WinGUI(Tk):
        def __init__(self):
            super().__init__()
            self.__win()
            self.iconbitmap('favicon.ico')
            self.tk_input_username_label = Entry(self, )
            self.tk_input_username_label.place(relx=0.5367, rely=0.2471, relwidth=0.4000, relheight=0.1471)
            self.tk_input_password_label = Entry(self, show='*')
            self.tk_input_password_label.place(relx=0.5367, rely=0.4441, relwidth=0.4000, relheight=0.1471)
            self.tk_button_login_button = Button(self, text="立即登录", takefocus=False, )
            self.tk_button_login_button.place(relx=0.5367, rely=0.6824, relwidth=0.4000, relheight=0.1471)
            self.tk_label_register = Label(self, text="还没有账号?立即注册", anchor="center", )
            self.tk_label_register.place(relx=0.6933, rely=0.8676, relwidth=0.2250, relheight=0.0882)
            self.tk_canvas_login_canvas = Canvas(self, )
            self.tk_canvas_login_canvas.place(relx=0.0000, rely=0.0000, relwidth=0.4667, relheight=1.0000)
            self.tk_label_welcome = Label(self, text="项目介绍(自定义)", anchor="center", )
            self.tk_label_welcome.place(relx=0.4667, rely=0.0588, relwidth=0.5333, relheight=0.1471)
    
        def __win(self):
            self.title("登录界面")
            width, height = 600, 340
            screenwidth = self.winfo_screenwidth()
            screenheight = self.winfo_screenheight()
            geometry = '%dx%d+%d+%d' % (width, height, (screenwidth - width) / 2, (screenheight - height) / 2)
            self.geometry(geometry)
            self.minsize(width=width, height=height)
    
        def login(self):
            username = self.tk_input_username_label.get()
            password = self.tk_input_password_label.get()
            return username, password
    
    
    class Win(WinGUI):
        def __init__(self, controller):
            self.ctl = controller
            super().__init__()
            self.__event_bind()
            self.__style_config()
            self.ctl.init(self)
    
        def __event_bind(self):
            self.tk_input_password_label.bind('<Return>', self.ctl.login_submit)
            self.tk_button_login_button.bind('<Button-1>', self.ctl.login_submit)
            self.tk_button_login_button.bind('<Return>', self.ctl.login_submit)
            self.tk_label_register.bind('<Button-1>', self.ctl.register)
            pass
    
        def __style_config(self):
            pass
    
  3. login/control.py

    import tkinter.messagebox
    
    from login.ui import WinGUI
    
    
    class Controller:
        # 导入UI类后,替换以下的 object 类型,将获得 IDE 属性提示功能
        ui: WinGUI
    
        def __init__(self):
            self.url = "登录地址"
    
        def init(self, ui):
            """
            得到UI实例,对组件进行初始化配置
            """
            self.ui = ui
    
        def close_windows(self):
            print("点击了菜单")
            if self.ui:
                self.ui.destroy()
    
        def version(self):
            print("点击了菜单")
            tkinter.messagebox.showinfo("版本信息", "当前版本: V1.0.0")
    
        def login_submit(self, evt):
            u, p = self.ui.login()
            if u is None or len(u) == 0:
                tkinter.messagebox.showinfo("登录提示", "请输入登录用户名!")
            elif p is None or len(p) == 0:
                tkinter.messagebox.showinfo("登录提示", "请输入登录密码!")
            print(
                f"触发了登录操作,地址:{self.url},账号:{u},密码:{p}")
            # 模拟登录操作
            if u == 'admin' and p == 'admin':
                print(f'登录成功')
                # 关闭登录窗口
                self.ui.destroy()
                from home.control import Controller as HomeUIController
                from home.ui import Win as MainWin
                # 这里创建首页界面,并进入GUI循环,可以将登陆后的Token统一管理,不想管理的可以当作参数传过去不过比较麻烦
                app = MainWin(HomeUIController())
                app.mainloop()
            else:
                tkinter.messagebox.showinfo("登录提示", "登陆失败了,请检查账号密码是否正确.")
    
        def register(self, evt):
            print(f"触发了注册操作,地址:{self.url}")
    
    
  4. 启动类main.py

    # 导入窗口控制器
    from login.control import Controller as MainUIController
    # 导入布局文件
    from login.ui import Win as MainWin
    
    if __name__ == "__main__":
        app = MainWin(MainUIController())
        app.iconbitmap('favicon.ico')
        # 启动
        app.mainloop()
    

2. 首页界面实现(代码)

  1. 图片展示
    在这里插入图片描述

  2. home/ui.py

    from tkinter import *
    from tkinter.ttk import *
    
    
    class WinGUI(Tk):
        def __init__(self):
            super().__init__()
            self.__win()
            # 当前页数
            self.index = 1
            self.total = 10
            self.data = []
            self.tk_table_m1ef1meg = self.__tk_table_m1ef1meg(self)
            self.tk_label_m1ef4id7 = self.__tk_label_m1ef4id7(self)
            self.tk_input_query = self.__tk_input_query(self)
            self.tk_button_query = self.__tk_button_query(self)
            self.tk_button_head = self.__tk_button_head(self)
            self.tk_button_previous__page = self.__tk_button_previous__page(self)
            self.tk_button_next_page = self.__tk_button_next_page(self)
            self.tk_button_last = self.__tk_button_last(self)
    
        def __win(self):
            self.title("项目名称")
            # 设置窗口大小、居中
            width = 800
            height = 600
            screenwidth = self.winfo_screenwidth()
            screenheight = self.winfo_screenheight()
            geometry = '%dx%d+%d+%d' % (width, height, (screenwidth - width) / 2, (screenheight - height) / 2)
            self.iconbitmap('favicon.ico')
            self.geometry(geometry)
    
            self.minsize(width=width, height=height)
    
        def scrollbar_autohide(self, vbar, hbar, widget):
            """自动隐藏滚动条"""
    
            def show():
                if vbar: vbar.lift(widget)
                if hbar: hbar.lift(widget)
    
            def hide():
                if vbar: vbar.lower(widget)
                if hbar: hbar.lower(widget)
    
            hide()
            widget.bind("<Enter>", lambda e: show())
            if vbar: vbar.bind("<Enter>", lambda e: show())
            if vbar: vbar.bind("<Leave>", lambda e: hide())
            if hbar: hbar.bind("<Enter>", lambda e: show())
            if hbar: hbar.bind("<Leave>", lambda e: hide())
            widget.bind("<Leave>", lambda e: hide())
    
        def v_scrollbar(self, vbar, widget, x, y, w, h, pw, ph):
            widget.configure(yscrollcommand=vbar.set)
            vbar.config(command=widget.yview)
            vbar.place(relx=(w + x) / pw, rely=y / ph, relheight=h / ph, anchor='ne')
    
        def h_scrollbar(self, hbar, widget, x, y, w, h, pw, ph):
            widget.configure(xscrollcommand=hbar.set)
            hbar.config(command=widget.xview)
            hbar.place(relx=x / pw, rely=(y + h) / ph, relwidth=w / pw, anchor='sw')
    
        def create_bar(self, master, widget, is_vbar, is_hbar, x, y, w, h, pw, ph):
            vbar, hbar = None, None
            if is_vbar:
                vbar = Scrollbar(master)
                self.v_scrollbar(vbar, widget, x, y, w, h, pw, ph)
            if is_hbar:
                hbar = Scrollbar(master, orient="horizontal")
                self.h_scrollbar(hbar, widget, x, y, w, h, pw, ph)
            self.scrollbar_autohide(vbar, hbar, widget)
    
        def __tk_table_m1ef1meg(self, parent):
            # 表头字段 表头宽度
            columns = {"序列": 79, "姓名": 239, "民族": 79, "年龄": 79, "简介": 319}
            tk_table = Treeview(parent, show="headings", columns=list(columns), )
            for text, width in columns.items():  # 批量设置列属性
                tk_table.heading(text, text=text, anchor='center')
                tk_table.column(text, anchor='center', width=width, stretch=False)  # stretch 不自动拉伸
    
            tk_table.place(relx=0.0000, rely=0.1817, relwidth=0.9988, relheight=0.7500)
            return tk_table
    
        def __tk_button_next_page(self, parent):
            btn = Button(parent, text="下一页", takefocus=False, )
            btn.place(relx=0.8313, rely=0.9500, relwidth=0.0625, relheight=0.0500)
            return btn
    
        def __tk_button_previous__page(self, parent):
            btn = Button(parent, text="上一页", takefocus=False, )
            btn.place(relx=0.7462, rely=0.9500, relwidth=0.0625, relheight=0.0500)
            return btn
    
        def __tk_label_m1ef4id7(self, parent):
            label = Label(parent, text="当前第3页/总130页", anchor="center", )
            label.place(relx=0.4625, rely=0.9500, relwidth=0.1938, relheight=0.0500)
            return label
    
        def __tk_input_query(self, parent):
            ipt = Entry(parent, )
            ipt.place(relx=0.0000, rely=0.1183, relwidth=0.2500, relheight=0.0500)
            return ipt
    
        def __tk_button_query(self, parent):
            btn = Button(parent, text="搜索", takefocus=False, )
            btn.place(relx=0.2612, rely=0.1183, relwidth=0.0788, relheight=0.0500)
            return btn
    
        def __tk_button_head(self, parent):
            btn = Button(parent, text="首页", takefocus=False, )
            btn.place(relx=0.6675, rely=0.9500, relwidth=0.0625, relheight=0.0500)
            return btn
    
        def __tk_button_last(self, parent):
            btn = Button(parent, text="尾页", takefocus=False, )
            btn.place(relx=0.9187, rely=0.9500, relwidth=0.0625, relheight=0.0500)
            return btn
    
        def page_add_index(self):
            # 下一页
            if self.index < self.total:
                self.index += 1
            return self.index
    
        def page_sub_index(self):
            # 上一页
            if self.index > 1:
                self.index -= 1
            return self.index
    
        def update_table(self):
            if self.data and len(self.data) > 0:
                if self.tk_table_m1ef1meg.get_children():
                    for get_child in self.tk_table_m1ef1meg.get_children():
                        self.tk_table_m1ef1meg.delete(get_child)
                for index, datum in enumerate(self.data):
                    self.tk_table_m1ef1meg.insert("", "end", text='',
                                                  values=(
                                                      index + 1, datum.get('name', ''), datum.get('nation', ''),
                                                      datum.get('age', ''), datum.get('info', '')))
    
    
    class Win(WinGUI):
    
        def __init__(self, controller):
            self.ctl = controller
            super().__init__()
            self.__event_bind()
            self.__style_config()
            self.config(menu=self.create_menu())
            self.ctl.init(self)
    
        def create_menu(self):
        	"""
        	创建自定义的菜单,可以不要
        	"""
            menu = Menu(self, tearoff=False)
            menu.add_cascade(label="设置", menu=self.menu_m1ecaoyu(menu))
            menu.add_cascade(label="帮助", menu=self.menu_m1eccdqt(menu))
            return menu
    
        def menu_m1ecaoyu(self, parent):
            menu = Menu(parent, tearoff=False)
            menu.add_command(label="关闭界面", command=self.ctl.close_windows)
            return menu
    
        def menu_m1eccdqt(self, parent):
            menu = Menu(parent, tearoff=False)
            menu.add_command(label="版本信息", command=self.ctl.version)
            return menu
    
        def __event_bind(self):
        	"""
        	此处对组件绑定事件
        	"""
        	# 搜索框绑定回车事件,回车直接搜索
            self.tk_input_query.bind('<Return>', self.ctl.select_member_data)
            # 搜索按钮绑定点击事件
            self.tk_button_query.bind('<Button-1>', self.ctl.select_member_data)
            # 首页事件
            self.tk_button_head.bind('<Button-1>', lambda event: self.ctl.load_member_data_next(self.index))
            self.tk_button_last.bind('<Button-1>', lambda event: self.ctl.load_member_data_next(self.total))
            self.tk_button_previous__page.bind('<Button-1>',
                                               lambda event: self.ctl.load_member_data_next(self.page_sub_index()))
            self.tk_button_next_page.bind('<Button-1>', lambda event: self.ctl.load_member_data_next(self.page_add_index()))
    
            pass
    
        def __style_config(self):
            pass
    

3. 打包build.py(与main.py同级目录)

import subprocess


def main_windows_package():
    # 定义 PyInstaller 命令
    pyinstaller_command = [
        'pyinstaller', '--onefile', '-w',
        '--icon', 'favicon.ico', 'main.py']
    try:
        subprocess.run(pyinstaller_command, check=True)
    except subprocess.CalledProcessError as e:
        print(f"An error occurred while running PyInstaller: {e}")


if __name__ == '__main__':
    main_windows_package()

4. 打包安装包

各位可以自行选择工具,由于此处项目过于简单,即开即用没有做打包的脚本,后续做到需要打包时会在后面写出来,当然有需要的也可以留言,看到后可以义务帮助。

执行了 build.py 后同级会出现一个dist目录,里边会有main.exe可执行文件,这个就是程序打包后的啦,好啦,到此结束。

标签:__,界面,self,label,tk,Tkinter,button,def,页面
From: https://blog.csdn.net/qq_45335996/article/details/142521917

相关文章

  • Android Studio制作简单登录界面
    实现目标应用线性布局设计登录界面,要求点击输入学号时弹出数字键盘界面,点击输入密码时弹出字母键盘,出现的文字、数字、尺寸等全部在values文件夹下相应.xml文件中设置好,使用时直接引用。当用户名或密码为空,显示一个提示信息“用户名与密码不能为空!”,当用户名和密码匹配,显示“登录......
  • C# + WPF 音频播放器 界面优雅,体验良好
    C#+WPF音频播放器界面优雅,体验良好 合集-.NET开源工具(18)  阅读目录前言项目介绍项目页面项目源码项目地址最后前言本文介绍一款使用C#与WPF开发的音频播放器,其界面简洁大方,操作体验流畅。该播放器支持多种音频格式(如MP4、WMA、OGG、FLAC......
  • 华为s5735交换机配置开启web页面
    环境win10, 华为s5735交换机配置方法华为交换机(S5735S-L24P4S-A1)该型号交换机默认不开启web管理模式。需要通过Console口配置模式开启web管理模式,方便使用图形化界面升级操作系统1.进入配置命令模式PleasePressENTER.Aninitialpasswordisrequiredforthefirstloginvia......
  • uniapp精仿支付宝UI界面,首页/理财/消息/生活/口碑/我的,还有模拟支付宝扫码支付/收付款
    uniapp精仿支付宝UI界面,首页/理财/消息/生活/口碑/我的,还有模拟支付宝扫码支付/收付款等功能,界面漂亮颜值高,视频商城小工具等,蚂蚁森林种树养鸡农场偷菜样样齐用于视频,商城,直播,聊天等sumer-alipay介绍uniapp精仿支付宝UI界面,首页/理财/消息/生活/口碑/我的,还有模拟支付宝......
  • uniapp精仿微信源码,基于SumerUI和Uniapp前端框架的一款仿微信APP应用,界面漂亮颜值高,视
    uniapp精仿微信源码,基于SumerUI和Uniapp前端框架的一款仿微信APP应用,界面漂亮颜值高,视频商城小工具等,朋友圈视频号即时聊天用于视频,商城,直播,聊天,等等场景,源码分享sumer-weixin介绍uniapp精仿微信,基于SumerUI3.0和Uniapp前端框架的一款仿微信APP应用,界面漂亮颜值高,视频......
  • 在WordPress中使用Simple Custom CSS and JS插件美化页面
    目录一、插件安装二、添加代码三、使用案例1、图片居中2、段落前空两格3、添加版权声明四、代码编写简述WordPress是目前使用最广泛的开源建站框架,其主要功能就是“主题”(Theme)系统,该功能可以让用户自定义主题,也可以直接选择第三方个人或公司开发的主题。不过自定......
  • 页面在移动设备上显示不正常的原因及解决方案
    聚沙成塔·每天进步一点点本文回顾⭐专栏简介页面在移动设备上显示不正常的原因及解决方案1.缺少`viewport`元标签1.1问题描述1.2解决方案1.3注意事项2.响应式设计未实现或设计不当2.1问题描述2.2解决方案示例:媒体查询的使用2.3常见的媒体查询断点3.固......
  • 在虚拟机Linux上运行redis,同时使用Another RedisDesktop Manager图形化界面工具连接
    VMwareWorkstationPro虚拟机启动Centos7MobaXterm连接虚拟机输入个人密码Redis启动进入Redis文件目录cd/usr/local/src/redis-6.2.6Redis自启动systemctlenableredissystemctlstartredis查看Redis进程ps-ef|grepredis进入Redis操作redis-cli-h......
  • 告别页面卡顿:Web Worker 助你解决前端性能瓶颈
    背景随着现代前端开发的复杂度不断提升,网页应用变得越来越丰富,用户期望更加流畅的交互体验。然而,JavaScript是单线程的,意味着它不能同时处理多个任务。一旦有耗时的任务执行,例如大量数据处理、复杂算法的计算、或是繁重的文件解析,页面的主线程很容易被阻塞,导致界面卡顿或无响应,严......
  • UIOTOS示例:自定义弹窗输出表单数据 | 前端低代码 前端零代码 web组态 无代码 amis gov
    目标对话框作为容器组件,可以隐藏掉默认的窗体头和脚,完全由内嵌页自定义,参见对话框自定义外观。并且也能获取弹窗纯表单数据,如下所示: 步骤内嵌页1.新建略。2.拖放组件拖放三个输入框,标识分别施志伟id、name、phone;两个按钮标识分别设置为cancel和ok 主页面1.新......