tkinter绘制组件(9)——点状等待框
引言
在本专栏的第7篇文章中,我们详细讲解了圆形等待框。同圆形等待框一样,点状等待框也是格式用户程序正在处理还是操作,并没有卡机。但是,圆形等待框的占用位置属于正方形,在可用位置较小的时候,使用圆形等待框难免会造成组件重叠。
因此,使用点状等待框不仅拥有更好的动画效果,也可以减少位置占用。
但是要注意,点状等待框更加耗能(别问为什么,继续看就知道了,忽略内存占用的dl请勿当真)。
布局
函数结构
在TinUI中,我们使用add_waitbar2来创建点状等待框:
def add_waitbar2(self,pos:tuple,width:int=200,fg='grey',bg='white',okcolor='lightgreen'):#绘制点状等待框
'''
pos::左上角其实位置
width::长度
fg::点状颜色
bg::背景色
okcolor::完成后的背景色
'''
背景
根据本专栏前几篇文章可知,无论怎么样,先创建一个背景。
bbox=(pos[0],pos[1],pos[0]+width+10,pos[1]+10)
back=self.create_rectangle(bbox,fill=bg,outline=fg)
关于为什么要在末位置各加10像素,这是因为点状直径是10像素。这是经过一定考虑的,通过不同直径的点状来决定背景的最终覆盖范围。
移动点
在这个绘制组件中最重要的部分是5个移动点(你也可以不是五个)。这几个移动点将实现等待动画效果,为了方便操作,我们使用列表将其归类创建:
balls=[]
ball_bbox=(pos[0],pos[1],pos[0]+10,pos[1]+10)
for b in range(1,6):
ball=self.create_oval(ball_bbox,fill=fg,outline=fg,state='hidden')
balls.append(ball)
动画样式
因为有了add_waitbar1
的技术积累,我们很明确如何实现等待动画效果。
但,我们需要完成若干移动点的动画,因此区别于add_waitbar1
的两层动画控制,我们需要三层动画控制,即:
组件动画控制
└单移动点动画控制
└单点移动
在
add_waitbar1
中:组件动画控制 └组件动画
组件与单点控制
#单点运动控制
def _start(ball):
if ifok.re==True:
return
self.itemconfig(ball,state='normal')
for w in range(0,width+5,5):
self.after(w*15,lambda w=w:ball_go(ball,w))
#整体动画控制
def start():
if ifok.re==True:
return
for i in balls:
self.after(balls.index(i)*500,lambda i=i:_start(i))
单点移动
#单点运动
def ball_go(ball,w):
self.move(ball,5,0)
if balls.index(ball)==4 and w>=width:
for i in balls:
self.coords(i,ball_bbox)
start()
ifok是TinUINum类的实例,关于TinUINum类,在此前的文章中已做说明。
结束函数
同样的,点状等待框也需要提供结束函数:
def stop():
ifok.re=True
for i in balls:
self.itemconfig(i,state='hidden')
self.itemconfig(back,fill=okcolor)
完整代码函数
def add_waitbar2(self,pos:tuple,width:int=200,fg='grey',bg='white',okcolor='lightgreen'):#绘制点状等待框
#单点运动
def ball_go(ball,w):
self.move(ball,5,0)
if balls.index(ball)==4 and w>=width:
for i in balls:
self.coords(i,ball_bbox)
start()
#单点运动控制
def _start(ball):
if ifok.re==True:
return
self.itemconfig(ball,state='normal')
for w in range(0,width+5,5):
self.after(w*15,lambda w=w:ball_go(ball,w))
#整体动画控制
def start():
if ifok.re==True:
return
for i in balls:
self.after(balls.index(i)*500,lambda i=i:_start(i))
def stop():
ifok.re=True
for i in balls:
self.itemconfig(i,state='hidden')
self.itemconfig(back,fill=okcolor)
ifok=TinUINum()
ifok.re=False
bbox=(pos[0],pos[1],pos[0]+width+10,pos[1]+10)
back=self.create_rectangle(bbox,fill=bg,outline=fg)
balls=[]
ball_bbox=(pos[0],pos[1],pos[0]+10,pos[1]+10)
for b in range(1,6):
ball=self.create_oval(ball_bbox,fill=fg,outline=fg,state='hidden')
balls.append(ball)
start()
return back,balls,stop
效果
测试代码
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()
def test3(event):
ok2()
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/')
_,ok1=b.add_waitbar1((500,220),bg='lightgreen')
b.add_button((500,270),'停止等待动画',activefg='cyan',activebg='black',command=test2)
bu1=b.add_button((700,200),'停止点状滚动条',activefg='white',activebg='black',command=test3)[1]
bu2=b.add_button((700,250),'nothing button 2')[1]
bu3=b.add_button((700,300),'nothing button 3')[1]
b.add_labelframe((bu1,bu2,bu3),'box buttons')
_,_,ok2=b.add_waitbar2((600,400),fg='blue')
a.mainloop()
最终效果
2021-7-30新样式
2024-2-14 labelframe新样式
使用圆角边框
2024-6-13新样式
github项目
pip下载
pip install tinui
结语
实际上,目前TinUI已经可以用于tkinter常规桌面应用开发了,不过TinUI还处于基础组件丰富化阶段。
🔆tkinter创新🔆