Recent Changes - Search:



See also Shaped Buttons.

Tile Widgets

The Blt widgets provide alternate implementations of the Tk Button, Checkbutton, Radiobutton, Menubutton, Label and Frame which provide additional options to control appearance. The most important of these are:

  • -bdimage : specifiy an image to use for button borders
  • -icons : for radio/check set 9 icons to define each state combination

These alternate widgets allow development less dull looking apps, while sidestepping the Ttk Style Issues.

Rounded Buttons

Support for rounded buttons is included in Blt buttons. These can be created and resized dynamically.

(:showex div=dembuts:)

Here is an example using GUI:

which is generated by:

!/usr/bin/env wize

# Nice buttons.  Call with 0-2 args for variety.

set img [image create photo]
winop image gradient $img LightBlue Ivory -width 1000 -height 10
option add *tile $img
. conf -tile $img

if {[llength $argv] == 2} {
    set bg Gray
    set B [Tk::rnd::create -grad DarkGray -bg $bg]
} elseif {[llength $argv]} {
    set bg MediumAquamarine
    set B [Tk::rnd::create -grad DarkGreen -bg $bg -both 1]
} else {
    set bg LightBlue
    set B [Tk::rnd::create]

if {$argv0 == [info script]} {
    set bimg [image create photo -file /zvfs/img/icon16/wcspeedtouch.gif]

    pack [frame .f2 -bg $bg] -fill both -expand y
    foreach i {1 2 3 4 5 6 7} {
        set sz [expr {10+$i*4}]
        pack [Tk::rnd::setup $B .f2.b$i -image $bimg -text Test$sz -font "Verdana $sz bold italic" -compound right] -side left
    .f2.b2 conf -state disabled

    pack [frame .f3 -bg $bg] -fill x
    pack [Tk::rnd::setup $B .f3.b -image $bimg -text Test99 -font "Verdana 99 bold italic" -compound right]

Radio and Check Buttons

Radiobuttons and checkbuttons can be represented as a simple set of icons with BLT. These just display the correct icon for each state, eg. active or disabled.

(:showex div=todex:)

Here is an example:

The above is generated via:

# Demo new BLT replacement button, checkbutton and radiobutton.
# Button supports use of a border image.
# Radio/check let you define 9 icons for each state combination.

proc SetupBltButtons { {dir /zvfs/img}} {
    # Setup BLT path and BButton "option add" for a more modern look.          
    uplevel 1 { namespace path [concat  ::blt::widget [namespace path]] }
    set f $dir
    set img [image create photo -file $f/bd/bd_s_blue.png ]
    set img2 [image create photo -file $f/bd/bd_o_blue.png ]
    foreach i {BButton BMenubutton} {
       option add *$i.bdImage $img
       option add *$i.activeBdImage $img2
       option add *$i.borderWidth 0
       option add *$i.shadow LightGray
       option add *$i.activeShadow White

    # Override icons for *button
    foreach i {off on tri  act onact act   dis ondis ondis} {
        lappend ll(chk) [image create photo -file $f/misc16/chk_$i.png]
        if {$i== "tri"} { set i on }
        lappend ll(rad) [image create photo -file $f/misc16/rad_$i.png]
    option add *BCheckbutton.icons $ll(chk)
    option add *BCheckbutton.borderWidth 0
    option add *BCheckbutton.activeBackground #d9d9d9

    option add *BRadiobutton.icons $ll(rad)
    option add *BRadiobutton.borderWidth 0
    option add *BRadiobutton.activeBackground #d9d9d9

    set img3 [image create photo -file /zvfs/img/bd/bdwroutline.png ]
    option add *BFrameRounded.bdImage $img3

namespace eval ::bdtst {
    if {[llength $argv]==0} {

    font conf TkDefaultFont -size 16 -family Verdana -weight bold -slant italic
    pack [frame .f] -pady 5
    foreach i {Save Copy Cut Paste} {
        pack [button .f.b$i -text $i] -side left -padx 5

    checkbutton .f.cb1
    checkbutton .f.cb2
    checkbutton .f.cb3 -state disabled
    checkbutton .f.cb4 -activebac #d9d9d9  -tristatevalue XX
    set ::cb4 XX
    set ::cb2 1

    radiobutton .f.rb1 -var ::rb1 -value 1
    radiobutton .f.rb2 -var ::rb1 -value 2
    radiobutton .f.rb3 -var ::rb1 -value 3 -state disabled

    foreach i [winfo children .f] { pack $i -side left }

    pack [frame .t -class BFrameRounded] -fill both -expand y
    pack [text .t.t -height 9 -width 40 -bd 0 -highlightth 0] -padx 8 -pady 8 -fill both -expand y   25,5          Bot
    .t.t insert end "Demo using blt::widget -bdimage and -icons"


In Gui

These options are also available for use within Gui.

(:showex div=demgui:)

Here is an example using GUI:

#!/usr/bin/env wize
{options - -blt 1} {}

{style} {
    Toplevel  {
        @defimages {
            mse wcspeedtouch
            drops emb_raindrops
        @defgradients {
            mainbg {SteelBlue SteelBlue -width 50 -height 50 }
        @eval {
            font conf TkDefaultFont -size 14 -family mono -slant italic
    Button { -image ^mse -compound right -shadow white }
    .subfr { -pady 4 }
    .txt { -bg Steelblue -bd 0 -highlightthickness 0  }

{Toplevel +} {
    {Frame + -id subfr -subattr {-rnd 1 -pos l}} {
        Button Step
        Button Next
        Button Finish
        Button Continue
        Button Until
        Button Up
        {Button - -conf {-state disabled}} Down
    {Frame + -id txtfr -pos * -rnd "-images ^mainbg"} {
        {Text - -id txt -pos * -focus 1 -eval { %W insert end "This is a text widget ..." }} {}
Edit - History - Print - Recent Changes - Search
Page last modified on September 14, 2011, at 02:38 PM