tkinter绘制组件(7)——圆形等待框

引言

当你要处理一定的耗时任务时,一定不希望tkinter界面卡住,而是希望使用者能够知道程序现在需要用户等待片刻。在tkinter中,有进度条组件,但是很难进行实际应用。因为很多时候我们没办法预测进度,因此我们只能够让使用者等待。

这时,可以考虑使用一个组件来显示等待动画,让使用者明白现在可以去做别的事,让程序先完成一定量的工作。

因此,我们会在TinUI加入等待动画组件。


布局

函数结构

目前,TinUI使用以下函数绘制圆形等待框:

def add_waitbar1(self,pos:tuple,fg='blue',bg='',okfg='lightgreen',okbg='',bd=2,r=20):#绘制圆形等待组件
    '''
    pos::位置
    fg::边框颜色
    bg::内部颜色
    okfg::完成时边框颜色
    okbg::完成时内部颜色
    bd::边框宽度
    r::半径
    '''
    pass

画布内容

我们需要创建一个可以改变角度的扇形画布对象,那么就是用create_arc函数。

bbox=(pos[0],pos[1],pos[0]+2*r,pos[1]+2*r)
waitbar1=self.create_arc(bbox,outline=fg,fill=bg,extent=5,start=90,width=bd)

注意,在创建画布内容时,半径与起始位置之间的关系。create_arc通过指定矩形范围来绘制图像,因此需要将选定的矩形范围调整为刚好绘制一个“圆”的大小。

动画样式

因为我们使用的是圆形等待组件,那么基本动画就是让这个圆弧转一圈,然后再重头来过。

首先,因为tkinter本身不支持多线程,干脆我们直接使用after函数解决调用时差问题。通过获取指定的扇形角度,设定相应的时间来执行绘制函数。当绘制函数的绘制角度最大时,在重新开启定时函数。很明显,我们需要两个函数。

def __init__(...):
    #...
    self.waitbar1_list=[i for i in range(0,360,5)]
    #...

def add_waitbar1(self,pos:tuple,fg='blue',bg='',okfg='lightgreen',okbg='',bd=2,r=20):#绘制圆形等待组件
    def __start(i):#绘制函数
        self.itemconfig(waitbar1,extent=i)
        if i==355:
            start()
    def start():#定时函数
        for i in self.waitbar1_list:
            self.after(i*15,lambda i=i:__start(i))
    #...

然后,将start函数加入创建完图像后的代码中。

结束函数

我们没必要让一个等待组件一直转下去,当我们完成我们的既定任务时,可以让其停下(删掉也可以)。那么,我们在创建一个停止等待函数,并将其作为对象函数回传,供之后调用。

def ok():
    self.itemconfig(waitbar1,outline=okfg,fill=okbg,extent=359)

之所以将“extent”参数使用359而不是360,是因为圆周角时,arc不会展现我们想要的效果

之后呢?定时函数和绘制函数怎么知道结束没有。这时,我们需要一个结构体,通过改变布朗值告诉定时函数和绘制函数,本组件的工作结束了。

先定义结构体(好吧,只要是自定义属性就可以):

class TinUINum:#数据结构,请忽略
    pass

再将一个数据结构写入函数中:

def add_waitbar1(self,pos:tuple,fg='blue',bg='',okfg='lightgreen',okbg='',bd=2,r=20):#绘制圆形等待组件
    def __start(i):#绘制函数
        if ifok.re==True:
            return
        #...
    def start():#定时函数
        if ifok.re==True:
            return
        #...
    #...
    ifok=TinUINum
    ifok.re=False
    #...

完整代码函数

def add_waitbar1(self,pos:tuple,fg='blue',bg='',okfg='lightgreen',okbg='',bd=2,r=20):#绘制圆形等待组件
    def __start(i):
        if ifok.re==True:
                return
        self.itemconfig(waitbar1,extent=i)
        if i==355:
            start()
    def start():
        if ifok.re==True:
            return
        for i in self.waitbar1_list:
            self.after(i*10,lambda i=i:__start(i))
    def ok():
        ifok.re=True
        self.itemconfig(waitbar1,outline=okfg,fill=okbg,extent=359)
    ifok=TinUINum
    ifok.re=False
    bbox=(pos[0],pos[1],pos[0]+2*r,pos[1]+2*r)
    waitbar1=self.create_arc(bbox,outline=fg,fill=bg,extent=5,start=90,width
    start()
    return waitbar1,ok

效果

测试代码

def test(event):
    a.title('TinUI Test')
    b.add_paragraph((50,150),'这是TinUI按钮触达的事件函数回显,此外,窗口标题也被改变、首行标题缩进减小')
    b.coords(m,100,5)
def test1(word):
    print(word)
def test2(event):
    ok1()

if __name__=='__main__':
    a=Tk()
    a.geometry('700x700+5+5')

    b=TinUI(a,bg='white')
    b.pack(fill='both',expand=True)
    m=b.add_title((600,0),'TinUI is a test project for futher tin using')
    m1=b.add_title((0,680),'test TinUI scrolled',size=2,angle=24)
    b.add_paragraph((20,290),'''     TinUI是基于tkinter画布开发的界面UI布局方案,作为tkinter拓展和TinEngine的拓展而存在。目前,TinUI尚处于开发阶段。如果想要使用完整的TinUI,敬请期待。''',
    angle=-18)
    b.add_paragraph((20,100),'下面的段落是测试画布的非平行字体显示效果,也是TinUI的简单介绍')
    b.add_button((250,450),'测试按钮',activefg='white',activebg='red',command=test,anchor='center')
    b.add_checkbutton((80,430),'允许TinUI测试',command=test1)
    b.add_label((10,220),'这是由画布TinUI绘制的Label组件')
    b.add_entry((250,300),350,30,'这里用来输入')
    b.add_separate((20,200),600)
    b.add_radiobutton((50,480),300,'sky is blue, water is blue, too. So, what is your heart',('red','blue','black'),command=test1)
    b.add_link((400,500),'TinGroup知识库','http://tinhome.baklib-free.com/')
    waitbar1,ok1=b.add_waitbar1((500,220),bg='lightgreen')
    b.add_button((500,270),'停止等待动画',activefg='blue',activebg='black',command=test2)

    a.mainloop()

最终效果

在这里插入图片描述


2021-7-30新样式

在这里插入图片描述

2022-7-11新样式

在这里插入图片描述
更具动态感。


github项目

TinUI的github项目地址

pip下载

pip install tinui

结语

TinUI仍然在探索绘制组件的动画,使界面更加生动。

🔆tkinter创新🔆

  • 1
    点赞
  • 9
    收藏
    觉得还不错? 一键收藏
  • 3
    评论
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值