GUI的终极选择:Tkinter2 ---Label组件和Button组件

##tkinter 的两大常用组件:Label 和 Button
   Label: Label 组件是用于在界面上输出描述性的标签,
   (例如:提示用户“你所下载的影片含有未成年人限制的内容,请满18周岁后再点击观看!”我们可以使用 Label 的文本输出功能来简单的实现,同时可以在旁边加一个醒目的图片,试图起到一个警示和震慑的作用)
   效果图:
            在这里插入图片描述

from tkinter import *

root = Tk()

textLabel = Label(root,text="您所下载的影片含有未成年人限制内容,请满十八周岁后再点击观看!")
textLabel.pack()

photo = PhotoImage(file="18.gif")
imgLabel=Label(root,image=photo)
imgLabel.pack()

mainloop()

   (解析:这次使用from tkinter import *,这表示把tkinter模块里所有的东西都导进来,如果用mport tkinter as tk,当代码一多的时候,导致一个结果就是满屏的tk。
      同样的先生成一个root顶层窗口,然后再实例化一个Label组件,第一个参数就这个表示这个组件是放在root窗口上,text就是组件的文本的内容了,在调用个pick()方法让他自动地排放一下,这样才能刚看到他显示。
      同时Label是可以显示一个图片的,imgLabel=Label(root,image=photo)他只需要在Label组件的image属性即参数设置值就可以,设置的这个值又应该是tkinter的一个图片对象,叫做 PhotoImage,只要实例化这个 PhotoImage就可以得到一个图片对象啦,如这里:photo = PhotoImage(file=“18.gif”)里边传入一个图片的路径(即这张图片的名字)就好了,这里是支持gif的,如果jpg不行,就改下图片的后缀,然后这个图片的位置要和你的源代码在同一个位置,即同一个文件夹。这样还不显示,最后还需要个mainloop进入事件循)
               在这里插入图片描述
   ※通过设置textLabel和imgLabel的pick()的side参数来改变他们的位置,让文字组件左对齐,18禁图片右对齐
在这里插入图片描述
   ※通过\n可以设置textLabel的文字换行,不让一行文字显示得那么凄凉那么长
在这里插入图片描述

   ※ 可以通过设置组件Label的justify参数来让组件的所有行的文字左对齐,且可以通过padx参数设置文字的左边距
在这里插入图片描述
   (解析:Label组件的justify参数是用于对齐多行文本,他的参数值有LEFT,CENTER,RIGHT,如果不设置这个参数,他的默认值就是CENTER)

   ※可以通过设置Label组件的compound参数来控制 Label 中文本和图像的混合模式
   (有些时候,可能不想要图片和文字分开,例如你想把图片作为背景,文字显示在图片上面,那么只需要简单的设置Label的 compound 选项)

from tkinter import *

root = Tk()

photo = PhotoImage(file="bg.gif")
theLabel = Label(root,
                 text="床前明月光,\n疑是地上霜。\n举头望明月,\n低头思故乡。",
                 justify = LEFT,
                 image = photo,
                 compound=CENTER,
                 font=("行楷",25),
                 fg = "white",
                 )
theLabel.pack()

mainloop()

                                 在这里插入图片描述
   (解析:首先还是先root = Tk()实例化出一个root顶层窗口,然后先弄出一个图片对象photo = PhotoImage(file=“bg.gif”),这次只需要一个Label就可以了,
   这个theLabel组件的第一个参数还是表示把这个组件放在root窗口中,
   第二个参数text就是组件的文字内容咯,
   第三个参数justify就是对这个字符串进行一个左对齐,
   第四个参数就是设置图片了,
   第五参数就是设置compound混合模式,设置为center,那么就是文字在图片的正上方显示,
   第六个参数就是设置文字的字体,
   第七个参数fg就是设置文字的前景色就是颜色
   另外compound属性在默认情况下,如果有指定位图或图片,则不显示文本,该选项设置为 bottom,left,right 或 top,那么图像显示在文本下,左,右,上,大家可以自己测试,然后compound属性默认值是 NONE)

   button: Botton 就是按钮。
       (Button 的绝大多数选项(参数) 都和 Label 是一样的,不过,button有一个功能就是可以接收用户的信息,简而言之,Botton 组件就是用于让用户自己说:“干”,然后通过按钮上的文字和图标让用户清楚按下此按钮是干什么用的,Botton 组件有一个叫做 command 的选项,用于指定一个函数或者方法,它的作用就是当用户点下这个按钮的时候,tkinter 就会自动调用这个指定的函数或是方法。)

   ※如果想让Button的文本发生改变,只需要设置一个 textvariable 的选项就可以了,他的用法就是会显示 Tkinter 里边的变量(通常是一个 StringVar 变量)的内容,如果变量被修改,Label 的文本会自动更新。

from tkinter import *

def callback():
    var.set("吹吧你,我才不信呢~")
    

root = Tk()

frame1 = Frame(root)
frame2 = Frame(root)

var = StringVar()
var.set("您所下载的影片含有未成年人限制内容,\n请满十八周岁后再点击观看!")
textLabel = Label(frame1,
                  textvariable=var,
                  justify=LEFT)
textLabel.pack(side=LEFT)

photo = PhotoImage(file="18.gif")
imgLabel=Label(frame1,image=photo)
imgLabel.pack(side=RIGHT)

theButton = Button(frame2,text="我已满 18 周岁",command=callback)
theButton.pack()

frame1.pack(padx=20,pady=20)
frame2.pack(padx=20,pady=20)

mainloop()

                             在这里插入图片描述
                                             在这里插入图片描述
       (解析:首先说说实现上面的架构,现在要求实现的要比之前的多一个按钮,当点击按钮后,上部分的文字就会发生改变,这样的话就需要分层,分为上面一个部分,下面一个部分,那就可以用frame作为一个框架,上面一个框架下面一个框架,上面的框架放两个组件textLabel和imageLabel,下面的框架放一个按钮,theButton,
       那么首先就是实例化出两个框架frame1和frame2,参数都是root,frame1 = Frame(root),frame2 = Frame(root)即这两个框架都放到root窗口中,然后把textLabel和imageLabel两个组件的第一个参数都改改为frame1,表示这两个组件都放在框架1中,
       接着在下面加一个按钮theButton = Button(frame2,text=“我已满 18 周岁”,command=callback),第一个参数表示放在第2个框架中,第二个参数就是按钮上的文字内容,第三个参数就command,如果没有这个参数,那么这个button也没什么用,按下去也没什么效果,有了的话按下去就会去执行command后边相关连的函数或者方法,这里取名叫callback
       接着再去上面定义个callback的函数,那么这个callback函数执行就是要改变框架1frame1中的textLabel组件的文本内容,这就要用到textvariable这个选项了,在textLabel组件中加上textvariable,然后他的功能就是可以显示一个变量的内容,比如textvariable=var,那么他就可以显示var这个变量的内容。
       所以去上面再定义一个var变量,但要求这个变量必须是Tkinter的变量,那么Tkinter的字符串变量就是叫做stringVar,实例化之后给var,然后var在调用他的set方法来设置这个变量的内容,就是这嘛一回事
       那么callback函数被触发时,var就调用set方法把变量的内容重新赋值就好了,就会把原来的内容给覆盖掉了

       最后最后最后不要忘了,theButton还要pack一下,然后还有frame1、frame2都要给她们放好位置,最后原本textLabel组件里边的padx放到frame1里边设置就好了,同时与y的内边距也可以调整一下,第二个框架也可以调整一下,因为跟边框保持距离程序看上去会更加地整洁)


        需要记的东西确实比较多,但没关系,小甲鱼老污龟已经整理两个组件的扩展阅读,所有选项的用法以及功能都列举出来了:

       Tkinter窗口组件:Label
       Tkinter窗口组件:Button

发布了247 篇原创文章 · 获赞 116 · 访问量 28万+

猜你喜欢

转载自blog.csdn.net/w15977858408/article/details/104143388