tkinter的GUI设计:界面与逻辑分离(一)-- 初次见面

PyQt实现界面与逻辑分离的设计很是方便,详情可以见我的第一篇博文。

 

不过本文将使用python的标准库 tkinter,来实现界面与逻辑分离的GUI 设计。

 

我们来设计一个很简单的程序:

  目的:长度单位英尺(feet)到米(meter)的转化

  实现:输入框输入英尺(feet),标签显示对应的长度米(meter)。可以点击按钮,亦可按回车键。

  说明:界面使用了 ttk.Frame 容器,各个部件的定位皆使用了 grid() 方法,3行3列

                   

  效果:如下

                       

  代码: 眼力好的你一定会发现,下面的代码风格有点像PyQt:

import tkinter as tk
from tkinter import ttk

class Application(tk.Tk): # 继承自 tk.Tk
    '''界面、逻辑分离示例'''

    def __init__(self):
        '''初始化'''
        super().__init__() # 有点相当于tk.Tk()

        self.createWidgets()

    def createWidgets(self):
        '''界面'''
        self.mainframe = ttk.Frame(self, padding="3 3 12 12") # 注意ttk.Frame()的第一个参数为self,因为这个类继承自tk.Tk类
        self.mainframe.grid(column=0, row=0, sticky=(tk.N, tk.W, tk.E, tk.S))
        self.mainframe.columnconfigure(0, weight=1)
        self.mainframe.rowconfigure(0, weight=1)

        # 定义了两个变量(下面会将它们绑定到输入部件 Entry 和标签部件 Label 上)
        # self.feet = StringVar()
        self.feet = tk.DoubleVar()
        self.meters = tk.StringVar()

        # 定义Entry部件,并把它赋给一个变量,方便在别处引用它。
        self.feet_entry = ttk.Entry(self.mainframe, width=7, textvariable=self.feet)
        self.feet_entry.grid(row=1, column=2, sticky=(tk.W, tk.E))
        self.feet_entry.focus()

        # 定义Label部件
        ttk.Label(self.mainframe, textvariable=self.meters).grid(row=2, column=2, sticky=(tk.W, tk.E))

        # 定义Button部件
        ttk.Button(self.mainframe, text="Calculate", command=self.calculate).grid(row=3, column=3, sticky=tk.W)

        # 定义三个Label部件
        ttk.Label(self.mainframe, text="feet").grid(row=1, column=3, sticky=tk.W)
        ttk.Label(self.mainframe, text="is equivalent to").grid(row=2, column=1, sticky=tk.E)
        ttk.Label(self.mainframe, text="meters").grid(row=2, column=3, sticky=tk.W)

        # 设置每格的 padding
        for child in self.mainframe.winfo_children():
            child.grid_configure(padx=5, pady=5)

        # 给窗口绑定回车键事件
        self.bind('<Return>', self.calculate)

    def calculate(self, *args): # 注意:参数必须是带!星!号!的 *args. 否则无论如何都会报类型错误:TypeError
        '''逻辑'''
        try:
            #value = float(self.feet.get()) # 如果前面定义为stringVar: self.feet = StringVar()
            value = self.feet.get()
            self.meters.set('{:.4f}'.format((0.3048 * value * 10000.0 + 0.5)/10000.0))
        except ValueError:
            pass

if __name__ == '__maint__':
    # 实例化Application
    app = Application()

    # 设置窗口标题
    app.title("Feet to Meters")

    # 主消息循环:
    app.mainloop()

 

 

参考:

http://www.360doc.com/content/14/0328/02/9482_364311622.shtml

http://www.liaoxuefeng.com/wiki/001374738125095c955c1e6d8bb493182103fac9270762a000/0013868326118089581a091a04e4c30b2b7896392bdde5c000

时间: 2024-08-01 22:34:27

tkinter的GUI设计:界面与逻辑分离(一)-- 初次见面的相关文章

tkinter的GUI设计:界面与逻辑分离(二)-- 菜单栏

由于要用到文件对话框和消息对话框,所以先给出下面的列表. py2 与 py3 中 tkinter 的变化: Tkinter → tkinter tkMessageBox → tkinter.messagebox tkColorChooser → tkinter.colorchooser tkFileDialog → tkinter.filedialog tkCommonDialog → tkinter.commondialog tkSimpleDialog → tkinter.simpledia

tkinter的GUI设计:界面与逻辑分离(三)-- 多页面

知识点: 使用 tkinter.Frame.tkraise() 函数去提升当前 tkinter.Frame 的 z 轴顺序,使得多个 tkinter.Frame 的可见性得以切换   本文基于:win7 + python34   1 2 3 4 5 import matplotlib matplotlib.use("TkAgg")from matplotlib.backends.backend_tkagg import FigureCanvasTkAgg, NavigationTool

tkinter的GUI设计:界面与逻辑分离(四)-- 与 matplotlib 结合

有些场合,我们需要对数据可视化.单是靠 tkinter 难度太大,而且做出来的效果不一定理想. 此时,将 tkinter 与 matplotlib 结合,是最好的选择. 知识点: 将 tkinter 与 matplotlib 结合的整个套路是固定的,只需要关心我们的绘图逻辑和程序逻辑即可     import matplotlib matplotlib.use('TkAgg') import numpy as np from matplotlib.backends.backend_tkagg i

GUI设计:让用户快速准确地读懂符号和含义

GUI设计中的写实性 原文:Realism in UI Design 翻看一下近些年来用户界面的视觉设计你一定会发现"写实风格"正逐步变成主流.我们所使用的电脑越来越强劲,速度越来越快,设计师们也有了更多的发挥空间.为了增加细节,我们已经可以使用3D效果.阴影.透明甚至一些物理特性来修饰界面.这其中有些效果能显著改善可用性,比如阴影能够更好地帮助用户区别激活与非激活状态的窗口.iPhone系统中的丰富但有效的动画效果也能极大减少用户的学习成本. 但在其他方面,这些新技术对可用性却未必作

网易应用下载站WEB端GUI设计的小分享

前言: 网易应用下载站WEB端开发进度日渐收尾,伴随陆续的测试优化工作,借此机会浅谈一下GUI设计实践上的皮毛经验.网易应用的特点在于服务用户下载应用和社交分享,因此GUI的设计作用在于把用户交互体验抽象化任务流程和操作方式表达得尽量准确尽量自然: Ⅰ.样式的意义 例a.不要分散用户的焦点注意力: GUI设计中不应该分散用户对自己任务目标的注意力.不要让人们总是去考虑他们正在使用界面.任务操作应该在用户意识的背景中,而不是前景中.这便 是整个界面的设计定稿所在.首页的主要任务有观看应用.下载应用

GUI设计中的不假思索

第一次接触到"不假思索"这个概念,是通过一篇名为<深泽直人(Naoto Fukasawa):<意识的核心>>的博文,里面列举了一些例子来阐明作者的观点. 照片上有一个铁栏杆,人们为什么会把牛奶盒放在上面呢? 当我们徒步走累了时,为什么会在光滑的石板上席地而坐? 人们在地铁上看书或者玩游戏,为什么下意识里喜欢背贴着车厢? -- 为什么会出现上述的诸多情形,为什么会有如此多的"without thinking"? 因为上图栏杆的方形和这个牛奶盒的

网站设计经验分享:浅谈设计中的逻辑推论

逻辑(理则学),源自古典希腊语λόγος (logos),最初的意思是"词语"或"言语",还引申出意思"思维"或"推理".逻辑经常被认为对论证评价准则的研究,尽管逻辑的精确定义在哲学家之间尚有争议的事情.这个主题还是有所依据的,逻辑学家的任务是相同的:提出大量的有效和谬误的推论,从而允许人们区别出好论证和坏论证. 逻辑,也就是思维的规律.小时候有人问我一群羊加一群羊等于多少群羊,我二话不说是两群羊,他说错了,是一大群羊.1+1

网站设计分析:浅谈设计中的逻辑

逻辑(理则学),源自古典希腊语λόγος (logos),最初的意思是"词语"或"言语",还引申出意思"思维"或"推理".逻辑经常被认为对论证评价准则的研究,尽管逻辑的精确定义在哲学家之间尚有争议的事情.这个主题还是有所依据的,逻辑学家的任务是相同的:提出大量的有效和谬误的推论,从而允许人们区别出好论证和坏论证. 逻辑,也就是思维的规律.小时候有人问我一群羊加一群羊等于多少群羊,我二话不说是两群羊,他说错了,是一大群羊.1+1

多语言GUI设计

多语言GUI设计 SDK只提供了英文界面的参考,这肯定是不适合逐渐国际化的市场需求,因此我们进行软件功能设计的很重要的一个任务是开发PMP多国语言显示界面,方便各个地区的用户以母语界面对PMP进行操作. 在GUI语言支持方面,系统可以支持简体中文.繁体中文.英语.日语.韩语.丹麦.荷兰.法语.德语.俄语.西班牙等语言中任意几种语言的组合,可以根据实际产品的需要来选择.GUI上所有的标题.选项.文字提示都能用多国语言显示.在设置窗口添加语言选项,语言切换后就可以进入到所选语言的用户界面中去,这样既