当前位置: 首页 > 科技观察

谁说用Python编写GUI程序是丑陋的?那是你不会美化!_0

时间:2023-03-21 01:34:00 科技观察

在平时的工作和学习中,我们经常会编写一些简单的PythonGUI工具来完成各种自动化任务,比如批量处理文件,批量处理图片等等。我们在编写这些工具时,往往只关注功能的实现,而忽略了页面的美化,这也使得用Python构建的GUI程序在人们眼中的地位相对较低。今天我们先忽略函数,重点是页面的美化,让我们看看用纯Python写的GUI程序也可以很漂亮!页面布局让我们首先完成一个基本的GUI布局。假设我们要做一个基数转换的工具,大致布局如下:上图完全是通过Python自带的GUI库tkinter编写的。部分代码如下:fromtkinterimportttkfromtkinterimport*classTransform():def__init__(self):self.root=Tk()self.root.title("Baseconversiontool")self.root.geometry(“600x280”)自我。根。可调整大小(假,假)自我。var=StringVar()自我。值=['2','8','10','16','32','36','58','62']self.myWidget()self.myLayout()defmyWidget(self):self.container=Frame(self.root)#转换设置区self.lf_group1=LabelFrame(master=self.container,text="ConversionSettings")self.cb=Checkbutton(self.lf_group1,text="Automaticconversion")self.cb.invoke()self.bt=Button(self.lf_group1,text='Conversion')self.en=Entry(self.lf_group1,text='warning')#基地选择区域self.lf_group2=LabelFrame(master=self.container,text="baseselection")self.lb1=Label(self.lf_group2,text="请选择要转换的base")self.cbo1=ttk.Combobox(master=self.lf_group2,values=self.values)self.cbo1.set(self.values[2])self.lb2=Label(self.lf_group2,text="请选择转换后的进入制")self.cbo2=ttk.Combobox(master=self.lf_group2,values=self.values,)self.cbo2.set(self.values[0])#进入控制区self.txt=Text(master=self.container,height=5,width=50)defmyLayout(self):self.container.pack(side=LEFT,fill=BOTH,expand=YES,padx=5)self.lf_group1.pack(fill=X,side=TOP)self.lf_group2.pack(fill=X,pady=10,side=TOP)自我。cb.pack(side=LEFT,expand=YES,padx=5,fill=X)self.bt.pack(side=LEFT,expand=YES,padx=5,fill=X)self.en.pack(side=左,展开=是,padx=5,填充=X)self.lb1.pack(边=左,展开=是,padx=5)self.cbo1.pack(边=左,展开=是,pady=5)self.lb2.pack(side=LEFT,expand=YES,padx=5)self.cbo2.pack(side=LEFT,expand=YES,pady=5)self.txt.pack(side=LEFT,anchor=NW,pady=5,fill=BOTH,expand=YES)defrun(self):self.container.mainloop()if__name__=='__main__':trans=Transform()trans.run()代码并不复杂,布局也是用到的最基本的pack方式。整个GUI程序虽然看起来很工整,但是颜色比较单调,每个组件都不是很漂亮,还是美化一下页面吧。我们首先手动设置CSS来美化页面。这里我们主要使用tkonter库的config属性。首先我们设置背景色:self.container.config(bg='#073642')对于整体容器container,我们设置背景色为#073642然后分别设置各个组件的样式:self.lf_group1.config(bg='#073642',fg="white")self.lf_group2.config(bg='#073642',fg="white")self.cb.config(bg='#073642',selectcolor='#073642',activebackground='#073642',activeforeground='#073642',fg="white")self.bt.config(bg="azure3")self.en.config(highlightbackground="#0b5162",highlightcolor="#0b5162",insertofftime=500,insertontime=500,fg="Gainsboro",insertbackground="Gainsboro",bg="#073642",highlightthickness=2,relief="solid")self.lb1.config(bg='#073642',activebackground='#073642',activeforeground='#073642',fg="white")self.lb2.config(bg='#073642',activebackground='#073642',activeforeground='#073642',fg="white")self.txt.config(insertofftime=500,insertontime=500,fg="Gainsboro",insertbackground="Gainsboro",wrap="none",bg='#073642')都是通过设置的配置,F或颜色您可以通过在线颜色选择器来选择颜色https://tools.kalvinbg.cn/dev/colorPicker接下来,我们设置下拉框的样式。对于下拉框组件,有一些比较特殊的。该组件属于ttk组件,所以需要通过主题来设置样式,代码如下:combostyle=ttk.Style()combostyle.theme_create('combostyle',parent='alt',settings={'TCombobox':{'configure':{'foreground':'white','selectbackground':'#073642',#选择后的背景色'fieldbackground':'#073642',#下拉框颜色'background':'#073642',#下拉按钮Backgroundcolor"font":10,#Fontsize}}})combostyle.theme_use('combostyle')这样,我们整个GUI程序的风格就设置好了。来看看最后的效果吧:可以很明显的看到颜值提升了好几个档次!使用ttkbootstrap美化页面当然我们还有一个更简单有效的美化页面的方法,那就是使用ttkbootstrap库来美化页面。首先通过pip安装ttkbootstrap库:pipinstallttkbootstrap然后在项目中引用库:importttkbootstrapasttkfromttkbootstrap.constantsimport*classMainCreator(ttk.Window):def__init__(self):super().__init__("aryConversiontool",themename="solar",resizable=(False,False))#设置一个主题此时,当我们完成组件的布局后,页面的整体风格就会变成主题solar的风格,当然我们还可以给不同的组件添加bootstyle属性,实现更多的样式效果。defcreate_frame(self):"""Createalltheframewidgets"""container=ttk.Frame(self)container.pack(side=LEFT,fill=BOTH,expand=YES,padx=5)color_group=ttk.Labelframe(master=container,text="conversionsettings",padding=10)color_group.pack(fill=X,side=TOP)self.cb=ttk.Checkbutton(color_group,text="是否自动转换",variable=self.cbvar)self.cb.invoke()self.bt=ttk.Button(color_group,text='conversion',bootstyle='success')self.en=ttk.Entry(color_group,text='warning',bootstyle='警告')self.cb.pack(side=LEFT,expand=YES,padx=5,fill=X)self.bt.pack(side=LEFT,expand=YES,padx=5,fill=X)self.zh.pack(side=LEFT,expand=YES,padx=5,fill=X)cr_group=ttk.Labelframe(master=container,text="baseselection",padding=10)cr_group.pack(fill=X,pady=10,side=TOP)values=['2','8','10','16','32','36','58','62']cr3=ttk.Label(cr_group,text="请选择要转换的基数")cr3.pack(side=LEFT,expand=YES,padx=5)self.cbo1=ttk.通讯bobox(master=cr_group,values=values,)self.cbo1.pack(side=LEFT,expand=YES,pady=5)self.cbo1.set(values[2])cr5=ttk.Label(cr_group,text="转换后请选择基础")cr5.pack(side=LEFT,expand=YES,padx=5)self.cbo2=ttk.Combobox(master=cr_group,values=values,)self.cbo2.pack(side=左,展开=是,pady=5)self.cbo2.set(values[0])self.txt=ttk.Text(master=container,height=5,width=50,wrap="none")self.txt.pack(side=LEFT,anchor=NW,pady=5,fill=BOTH,expand=YES)最终效果如下:可以看出使用这个库整体效果还是比加CSS漂亮手动样式。也比较方便!好了,今天的分享就到这里,我们下期见~