Lime Radiobuttons#

Lime Radiobox#

Normal

Selected

Disabled

Disabled Selected

rn

rs

rd

rds

Both radiobuttons have to be created, since whether we use a circular or diamond shape we have nothing yet in our lime images. The best looking ones were from aquativo, which meant decoding to view them, the unselected button is grey with a highlight in the lower half, the selected button is colourful with a dark centre.

Show/Hide Code 10radio.py

'''
Radiobuttons

round buttons with central dark area when selected
'''

from PIL import Image, ImageDraw
from tools import transx, LerpColour, create_circle

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

we = w*exp  
he = h*exp
# make allowance for borders, shadow and highlight
ce = we//2 +1  # centre
steps = ce # gradient steps ce-e

back = 'white' #(102,153,204)
border = '#5D9B90' 
stopc = (144,237,215)
startc = (239,252,249)
mid = '#BDF3E7'
toc = (144,237,215)
fromc = (239,252,249)
middle = '#2D4C46'

img = Image.new('RGBA', (we,he), 'white')
idraw = ImageDraw.Draw(img)

create_circle(idraw,(ce,ce),ce,
                  fill=mid) # toc

for j in range(steps):
    cr,cg,cb = LerpColour(startc,stopc,j/(steps-1))
    create_circle(idraw,(ce+j//2,ce+j//2),ce-exp-j,
                  fill=(cr,cg,cb))

img = img.resize((w,h),Image.LANCZOS)

transx(img,w,h)

img.save('../images/lime/radio-n.png')
dimg = img.convert('L')
dimg = dimg.convert('RGBA')
transx(dimg,w,h)
dimg.save('../images/lime/radio-d.png')

simg = Image.new('RGBA', (we,he), 'white')
sidraw = ImageDraw.Draw(simg)

create_circle(sidraw,(ce,ce),ce,fill=border) 

for j in range(steps):
    cr,cg,cb = LerpColour(toc,fromc,j/(steps-1))
    create_circle(sidraw,(ce,ce-j//2),ce-exp-j,
                  fill=(cr,cg,cb))

create_circle(sidraw,(ce,ce),ce//3,
                  fill=middle)

simg = simg.resize((w,h),Image.LANCZOS)

transx(simg,w,h)

simg.save('../images/lime/radio-s.png')
dsimg = simg.convert('L')
dsimg = dsimg.convert('RGBA')
transx(dsimg,w,h)
dsimg.save('../images/lime/radio-ds.png')

Show/Hide Code 10lime_radio.py

'''
Radio Buttons

Create theme extract for custom widgets, include state selection to view
the result of changing the state using different images and/or different
settings.

'''

from tkinter import Tk, PhotoImage, StringVar
from tkinter.ttk import Style, Radiobutton, Frame, Separator
from RunState import run_state

root = Tk()

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

img1 = PhotoImage("radio-n", file='../images/lime/radio-n.png')
img2 = PhotoImage("radio-s", file='../images/lime/radio-s.png')
img3 = PhotoImage("radio-d", file='../images/lime/radio-d.png')
img4 = PhotoImage("radio-ds", file='../images/lime/radio-ds.png')

style = Style()
# both theme_create and theme_settings worked
style.theme_create( "yummy", parent="clam", settings={
#style.theme_settings('default', {
# start of theme extract
     'Radiobutton.indicator': {"element create":
          ('image', "radio-n",
           ('disabled','selected', "radio-ds"),
         ('disabled', "radio-d"),
           ('selected', "radio-s"),
           {'width':20, 'sticky': "w"})
        }
# end of theme extract - don't forget to add comma at end when inserting
     })


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

sep = Separator(fr)
sep.grid(column=0,row=15, sticky='ew')
happy = ['Great', 'Good', 'OK', 'Poor', 'Awful']
happiness = StringVar()
for ix,s in enumerate(happy):
    widg = Radiobutton(fr, text=s, value=s,
            variable=happiness)
    widg.grid(column=0,row=16+ix,sticky='nw',pady=5)

run_state(fr,widg)

root.mainloop()