什么是GUI?
GUI代表图形用户界面(Graphical User Interface),发音为’gooey’。如果你以前编写过Python程序,你所有的输入和输出都可能通过屏幕上显示的文本或用户输入的内容来处理。将GUI添加到程序中,用户可以使用按钮,下拉菜单,文本框,菜单和其他熟悉的用户界面控件来与其交互。
入门
在开始之前,请确保已经安装了guizero库。
打开Python 3(IDLE)。
点击File> New File并保存你的文件。
在文件的开头添加一行代码,从guizero库中导入App类: from guizero import App
现在添加两行代码来创建一个,然后将其显示在屏幕上:
保存您的文件,然后按F5运行它。你应该看到一个如下所示的GUI窗口:
恭喜,你已经建立了你的第一个GUI应用程序!
添加小部件
我们开始向GUI添加内容。我们将把可以添加到GUI的项目(如文本,文本框,按钮等)称为小部件。添加小部件时需遵循一些规则。
如果您想使用新类型的小部件,则必须导入它。程序中的第一行代码如下所示:from guizero import App
举个例子,如果你想使用这个小部件,你可以把它添加到导入行中,像这样:from guizero import App, Text
在本指南中,我们将要求您导入各种类型的小部件。每种类型的小部件只需要添加到导入列表中一次,然后可以在GUI上多次使用它。
所有创建窗口小部件的代码都必须添加到事件循环之前,这意味着在创建应用程序的代码行和代码行之间:
这是因为代码行启动事件循环。GUI将等待用户执行诸如点击按钮之类的事情 – 这些被称为事件。它会不断检查是否有新的事情发生,并在必要时自动更新显示。事件循环会阻塞(就像循环一样),所以在事件循环之后编写的代码将永远不会执行。
在本指南中,我们将要求您在GUI中添加小部件,这意味着在这两行代码之间的任何位置添加小部件。
文本小部件
您可以添加的最简单的小部件可能是文本小部件,它在屏幕上显示一些文本。
添加到导入语句(如果您不确定如何执行此操作,请阅读“添加小部件”部分的第1步)。
在GUI中添加一个小部件(如果您不确定放置此代码的位置,请阅读“添加小部件”部分的第2步):
welcome_message = Text(app, text="Welcome to my app")
在这里,我们已经创建了一个名称的小部件。第一个参数(在括号中)告诉小部件谁是老板!更具体地说,我们告诉这个小部件,它将由我们之前创建的对象来控制。给任何小部件的第一个参数总是告诉它的老板(或“主”)的名称。
按F5运行您的代码。你应该看到这个文本显示在你的GUI上。
你有没有注意到我们可以告诉小部件我们想要显示哪些内容?这被称为关键字参数,因为我们已经指定了关键字和我们想要的值。我们也可以指定其他关键字参数,只要将它们添加到最后,用逗号分隔即可。
welcome_message = Text(app, text="Welcome to my app", size=40, font="Times New Roman", color="lightblue")
在这里,我们使用关键字参数的,和(注意美式拼写!)。
您可以指定您的计算机安装的任何字体。可以将颜色指定为颜色名称,但不是每个可能的颜色都有一个名称,所以也可以使用十六进制代码(例如#ff0000)来定义颜色。
TextBox小部件
TextBox小部件用于让用户键入数据 – 有点像您以前可能使用的GUI 函数的版本。以下是如何添加一个:
将小部件添加到您的导入语句。
添加一个到GUI:
按F5运行您的代码。你应该看到一个小文本框出现。有一个关键字参数,你可以添加,如果你想使框更广泛。
PushButton小部件
PushButton小部件创建一个按钮。按下按钮时,将调用一个函数。
在创建GUI应用程序的代码之前,编写一个按钮被按下时调用的函数。将所有的功能代码放在程序的开始处,紧跟在行之后是一个好主意。
这个函数引用了widget()并将它的值设置为键入到widget()中的值。
您可以使用和功能与许多小部件来检索他们的当前值或将其设置为新的东西。
将小部件添加到您的导入语句。
添加一个到GUI:
update_text = PushButton(app, command=say_my_name, text="Display my name")
第一个参数告诉PushButton应用程序是它的老板。然后我们使用两个关键字参数 – 告诉按钮哪个函数在被按下时调用,并且是将在按钮上显示的文本。
按F5运行您的代码。在文本框中输入你的名字,然后按下按钮。你应该看到你的名字显示在顶部的大文本。
您现在已经体验到事件循环如何工作的基础。GUI等待事件(在这种情况下,您单击按钮),并调用一个函数来响应事件。这个函数可能包含代码来改变GUI上的某些东西,如果是的话,显示会相应地更新。
滑块小部件
一个滑块可让用户轻松移动一系列值,就像移动音量控制一样。
在创建GUI应用程序的代码之前,编写一个将在滑块移动时调用的函数。
这个函数有一个叫做参数。当滑块移动时,滑块的当前值将自动发送给函数,所以我们必须给它一个名字。我们选择了调用这个参数。函数内的代码设置的到当前滑块值。
将小部件添加到您的导入语句。
添加一个到GUI:
text_size = Slider(app,command = change_text_size,start = 10,end = 80)
这是在移动滑块(即我们刚创建的函数)时将被调用的函数。并为滑块可以具有的最大值和最小值指定值。我们已经指定了这些字体不会太大或太小 – 最小的可以是10pt,最大的是80pt。
保存你的代码并按F5运行它。将滑块左右移动并观察文本更改的大小。
图片小部件
您可以将图片添加到您的图形用户界面,只要它们是GIF格式。可悲的是,动画GIF只会显示为静止。
以GIF格式查找想要使用的图片,或将现有图片保存为GIF。将图片保存在Python文件所在的文件夹中。
将小部件添加到您的导入语句。
添加一个到GUI:
按F5运行你的代码。你应该看到你的图片出现在GUI上。
评论
您现在已经学会了如何使用一些简单的GUI小部件。如果你想看到一个完整的工作示例,可以在这里找到这个指南的完整代码。
现在让我们看一些更复杂的GUI小部件:组合框,复选框,单选按钮和菜单栏。我们将制作一个简单的电影预订GUI来演示这些小部件。
一个新的应用程序
创建一个新文件并保存为。
在文件的开头添加一行代码,从guizero库中导入App类:
现在添加两行代码来创建一个,然后将其显示在屏幕上:
这一次,我们已经指定了一些新的关键字参数:和改变应用程序窗口的大小,并允许我们设置了我们的小部件上一个无形的网格。
组合部件
该组合部件,您可以选择从下拉列表中选择一个选项。
将小部件添加到您的导入语句。
在GUI中添加一个小部件:
film_choice = Combo(app, options=["Star Wars", "Indiana Jones", "Batman"], grid=[0,1], align="left")
我们已经像往常一样指定参数来告诉组合,该应用程序是它的主人。
该参数是我们希望在显示选项列表控件。
因为我们在应用程序中指定,我们现在必须包含每个小部件的参数,告诉它在哪里出现。网格参数应该是一个包含[x,y]值的列表,您希望窗口小部件出现在网格上,网格上的[0,0]是左上角。我们也可以在网格的正方形内对齐这个小部件,在这种情况下,在左边。
保存你的代码并按F5运行它。请注意,即使我们将网格位置指定为[0,1],组合仍会出现在屏幕的最左上角。这是因为空网格没有高度或宽度,所以网格方形[0,0]是空的,实际上是不存在的。
添加到您的导入语句,然后添加一个小部件在网格广场[0,0]提供一些什么人将使用的选择的描述:
film_description = Text(app, text="Which film?", grid=[0,0], align="left")
运行该程序检查和两者都正确显示。
CheckBox小部件
该复选框控件允许您选择或取消选择一个真或假的选择。
将小部件添加到您的导入语句。
在GUI中添加一个小部件:
vip_seat = CheckBox(app, text="VIP seat?", grid=[1,1], align="left")
我们还选择在网格中添加一个小部件来解释复选框的用途。
按F5运行您的代码。您应该看到复选框出现,并能够勾选并取消选中。
ButtonGroup小部件
该ButtonGroup的小工具,可以创建一组单选按钮,让你可以选择一组选项中的一个。
将小部件添加到您的导入语句。
在GUI中添加一个小部件:
row_choice = ButtonGroup(app, options=[ ["Front", "F"], ["Middle", "M"],["Back", "B"] ],selected="M", horizontal=True, grid=[2,1], align="left")
让我们仔细看看这个:
我们还添加了另一个小部件来解释按钮的用途。
告诉按钮,该应用程序是他们的老板。
是一个显示为按钮的选项列表。每个选项也是一个包含将出现的文本的列表,以及与该选项关联的隐藏值。
告诉按钮哪一个被选择开始。
告诉按钮以水平线显示。
是这些按钮将被放置在网格上的地方。
说定位在网格正方形的左边的按钮。
按F5运行您的代码。你应该看到按钮。程序开始时应该选择“中间”选项,你应该能够在它们之间切换。
完成程序
最后,添加到导入列表中,然后添加一个窗口小部件,其中调用按下时调用的函数。
book_seats = PushButton(app, command=do_booking, text="Book seat", grid=[3,1], align="left")
将(全部小写)添加到导入语句,以允许我们使用guizero中的信息框功能。
在GUI之外,编写函数。这将弹出一个信息框。
您可能想知道如何检索用户选择的选项。将此代码添加到您的功能:
请注意,返回如果未选中它,如果它被选中,而返回的隐含价值(,或),而不是全文。
接下来是什么?
尝试制作自己的GUI程序。也许你可以采取一个你写的旧程序,并给它一个GUI?
领取专属 10元无门槛券
私享最新 技术干货