Tk::ColoredButton - Button widget with background gradient color.


  use strict;
  use warnings;
  use Tk;
  use Tk::ColoredButton;
  my $mw = MainWindow->new( -background => 'white', -title => 'ColoredButton example' );
  $mw->minsize( 300, 300 );
  my $coloredbutton = $mw->ColoredButton(
    -text               => 'ColoredButton1',
    -autofit            => 1,
    -font               => '{arial} 12 bold',
    -command            => [ \&display, 'ColoredButton1' ],
  )->pack(qw/-padx 10 -pady 10 /);
  my $coloredbutton2 = $mw->ColoredButton(
    -text     => 'ColoredButton2',
    -font     => '{arial} 12 bold',
    -command  => [ \&display, 'ColoredButton2' ],
    -height   => 40,
    -width    => 160,
    -gradient => {
      -start_color  => '#FFFFFF',
      -end_color    => '#BFD4E8',
      -type         => 'mirror_vertical',
      -start        => 50,
      -number_color => 10
    -activegradient => {
      -start_color  => '#BFD4E8',
      -end_color    => '#FFFFFF',
      -type         => 'mirror_vertical',
      -start        => 50,
      -number_color => 10
    -tooltip => 'my button message',
  )->pack(qw/-padx 10 -pady 10 /);
  my $button = $mw->Button(
    -activebackground => 'yellow',
    -background       => 'green',
    -text             => 'Real Button',
    -font             => '{arial} 12 bold',
    -command          => [ \&display, 'Button' ],
  )->pack(qw/-ipadx 10 -pady 10 /);
  sub display {
    my $message = shift;
    if ($message) { print "$message\n"; }


Tk::ColoredButton is an extension of the Tk::Canvas::GradientColor widget. It is an easy way to simulate a button widget with gradient background color.


The following Tk::Button options are supported :

-activebackground -activeforeground -anchor -background -bitmap -borderwidth -command -compound -cursor -disabledforeground -font -foreground -height -highlightbackground -highlightcolor -highlightthickness -image -justify -padx -pady -relief -repeatdelay -repeatinterval -state -takefocus -text -textvariable -width -wraplength


There are many options which allow you to configure your button as you want.

Name: activeGradient
Class: ActiveGradient
Switch: -activegradient => hash reference

Specifies gradient background color to use when the mouse cursor is positioned over the button. Please read the options of the set_gradientcolor method of Tk::Canvas::GradientColor to understand the options.

  -activegradient => {
    -start_color  => '#BFD4E8',
    -end_color    => '#FFFFFF',
    -type         => 'mirror_vertical',
    -start        => 50,
    -number_color => 10

Default : { -start_color => '#FFFFFF', -end_color => '#B2B2B2' }

Name: autofit
Class: Autofit
Switch: -autofit => 1 or 0

Enables automatic adjustment (width and height) of the button depending on the displayed content (text, image, bitmap, ...).

  -autofit => 1,

Default : 0

Name: gradient
Class: Gradient
Switch: -gradient

Specifies gradient background color on the button. Please read the options of the set_gradientcolor method of "set_gradientcolor" in Tk::Canvas::GradientColor to understand the options.

  -gradient => {
    -start_color  => '#FFFFFF',
    -end_color    => '#BFD4E8',
    -type         => 'mirror_vertical',
    -start        => 50,
    -number_color => 10

Default : { -start_color => '#B2B2B2', -end_color => '#FFFFFF' }

-height or -width

Specifies a desired window height/width that the button widget should request from its geometry manager. The value may be specified in any of the forms described in the "COORDINATES" in Tk::Canvas section below.

You can also use the autofit option if you want to have an automatic adjustment for your button.

Default : -height => 20, -width => 80,

Name: imageDisabled
Class: ImageDisabled
Switch: -imagedisabled => $image_photo

Specifies an image to display in the button when it is disabled. ( See Tk::Photo or Tk::Image for details of image creation.).

  -imagedisabled => $image_photo,         

Default : undef

Name: tooltip
Class: Tooltip
Switch: -tooltip => $tooltip or [$tooltip, $iniwait?]

Creates and attaches help balloons (using Tk::Balloon). Then, when the mouse pauses over the button, a help balloon is popped up.

$iniwait Specifies the amount of time to wait without activity before popping up a help balloon. Specified in milliseconds. Defaults to 350 milliseconds. This applies to both the popped up balloon and the status bar message.

  -tooltip => 'my button message',         
  -tooltip => ['my button message', 200],

Default : undef


You can use invoke method like in Tk::Button.



Delete the help balloon created with tooltip option.



$button_bgc->flash(?$interval) in ms

Flash the button. This is accomplished by change foreground color of the button several times, alternating between active and normal colors. At the end of the flash the button is left in the same normal/active state as when the command was invoked. This command is ignored if the button's state is disabled.

$interval is the time in milliseconds between each alternative.

If $interval is not specified, the button will alternate between active and normal colors every 300 milliseconds.

If $interval is zero, any current flash operation will be cancel.

If $interval is non-zero, the button will alternate every $interval milliseconds until it is explicitly cancelled via $interval to zero or using cancel method to id returned.

  my $id = $button_bgc->flash(1000);
  $button_bgc->flash(0); # Cancel the flash



Re-creates the button. Tk::ColoredButton supports the configure and cget methods described in the Tk::options manpage. If you use configure method to change a widget specific option, the modification will not be display. You have to update your widget by redraw it using this method.



Djibril Ousmanou, <djibel at>


Please report any bugs or feature requests to bug-tk-coloredbutton at, or through the web interface at I will be notified, and then you'll automatically be notified of progress on your bug as I make changes.


See also Tk::StyledButton and Tk::Button.


You can find documentation for this module with the perldoc command.

    perldoc Tk::ColoredButton

You can also look for information at:



Copyright 2011 Djibril Ousmanou.

This program is free software; you can redistribute it and/or modify it under the terms of either: the GNU General Public License as published by the Free Software Foundation; or the Artistic License.

See for more information.