Lime Progressbar#

Lime Progressbar#

Horizontal

Vertical

rectangles

radial

hp

vp

Let's see if we can reuse two of the thumb images for the trough, then all we require are internal parts to form the horizontal and vertical progress sliders. The horizontal slider used rectangles and the vertical one used points for radial gradients, so a comparison can be made.

Show/Hide Code 10progressbar.py

'''
progressbar

Standard gradient on vertical to create 90° gradient to normal

'''
from PIL import Image
from roundrect import Gr_Base_Rect

exp = 9 # enlargement, also thickness between rectangles
w=17
h=21

radius = 4 # gap size

first = '#2D4C46' #(222,247,222) '#5D9B90' 5F9C8E
second = 'white' #(102,153,204)

startc = (143,188,143) #(222,247,222) (26,242,195)
stopc = (95,156,142)#(143,188,143)(222,247,222) (225,242,238)

tab=0
fout = '../images/lime/vprog.png' 

Gr_Base_Rect(fout,w,h,exp,radius,first,second,startc,stopc,tab)
          
img = Image.open('../images/lime/vprog.png')

img.transpose(Image.ROTATE_90).save('../images/lime/hprog.png')


Show/Hide Code 10prog_alt.py

'''
progressbar alternative

since the widget does not expand, opportunity to use 2d gradient
based on rectangle
'''

from PIL import Image, ImageDraw
from tools import gr_2d_rect, trans, LerpColour

exp = 9 # enlargement, also thickness between rectangles
w=17
h=17
we = w*exp
he = h*exp
radius = 3 # gap size
re=radius*exp
centreX = (w-1)/2
centreY = (h-1)/2
hypotSq = (w-3)*(w-3) + (h-3)*(h-3)

first = '#2D4C46' # '#5D9B90'
second = 'white' #(102,153,204)back

stopc =  (222,247,222) # (143,188,143)
startc = (95,156,142) #(143,188,143)

img = gr_2d_rect(we,he,exp,re,first,second,stopc,startc)

img = img.resize((w,h),Image.LANCZOS)
trans(img,w,h,radius,730)
# used on horizontal
img.save('../images/lime/iprog.png')

rimg = Image.new('RGBA',(w,h),second)
rdraw = ImageDraw.Draw(rimg)

rdraw.rectangle([0,0,w-1,h-1],outline=first)

for y in range(1,h-1):
    rise = centreY - y
    rise *= rise

    for x in range(1,w-1):
        run = centreX - x
        run *= run

        distSq = run + rise
        dist = 4 * distSq / hypotSq

        rdraw.point([x,y],fill=LerpColour(startc,stopc,dist))

rdraw.point([0,0],fill=(0,0,0,0))
rdraw.point([0,h-1],fill=(0,0,0,0))
rdraw.point([w-1,0],fill=(0,0,0,0))
rdraw.point([w-1,h-1],fill=(0,0,0,0))

rimg.save('../images/lime/rprog.png')


Show/Hide Code 10lime_prog.py

from tkinter import Tk, PhotoImage
from tkinter.ttk import Style, Frame, Progressbar

root = Tk()

fr = Frame(root)
fr.grid(column=0,row=0,sticky='nsew')

img1 = PhotoImage("slider-va", file='../images/lime/slider-va.png')
img2 = PhotoImage("slider-ha", file='../images/lime/slider-ha.png')
img3 = PhotoImage("hprog", file='../images/lime/rprog.png') # hprog
img4 = PhotoImage("vprog", file='../images/lime/iprog.png') # vprog

style = Style()
# both theme_create and theme_settings worked
style.theme_create( "yummy", parent="clam", settings={
#style.theme_settings('default', {
# start of theme extract
     'Horizontal.Progressbar.trough': {"element create":
          ('image', "slider-ha",
           {'border':[9,2]})},
     'Horizontal.Progressbar.pbar': {"element create":
          ('image', "hprog", 
           {'border':4})
        },
     'Vertical.Progressbar.trough': {"element create":
          ('image', "slider-va",
           {'border':[2,9]})},
     'Vertical.Progressbar.pbar': {"element create":
          ('image', "vprog", 
           {'border':4})
        }
# end of theme extract - don't forget to add comma at end when inserting
     })

style.theme_use('yummy') # 'default'

widg = Progressbar(fr,length=150,orient='horizontal',mode='indeterminate')
widg.grid(column=0,row=0,sticky='nsew', padx=5, pady=5)


widg1 = Progressbar(fr,length=150,orient='vertical',mode='indeterminate')
widg1.grid(column=0,row=2, padx=5, pady=5) 


root.mainloop()