Customize ttk:button

Question

Hi,
I'm looking for a way to add a triangle in the corner right of my ttk::button like below :

Sometimes the same button execute 2 commands , I would like to specify him to my user by this symbol

Answer 1

First you need the images:

set imgred [image create photo -file redcorner.png]
set imggreen [image create photo -file greencorner.png]

Next create a style element for each of these colors:

ttk::style element create Red.Corner.TButton.indicator image $imgred
ttk::style element create Green.Corner.TButton.indicator image $imggreen

Now create the layouts for each of the two button styles. The original ttk::button layout can be retrieved using

ttk::style layout TButton

We use this as a template and add in our indicator elements.

(Edit: note that different themes may have different layouts.
The example below is for the 'default' theme.)

ttk::style layout Red.Corner.TButton {
  Button.border -sticky nswe -border 1 -children {
    Button.focus -sticky nswe -children {
      Button.padding -sticky nswe -children {
        Button.label -sticky nswe 
        Red.Corner.TButton.indicator -side right -sticky ne}}}}


ttk::style layout Green.Corner.TButton {
  Button.border -sticky nswe -border 1 -children {
    Button.focus -sticky nswe -children {
      Button.padding -sticky nswe -children {
        Button.label -sticky nswe 
        Green.Corner.TButton.indicator -side right -sticky ne}}}}

Now all the pieces are in place to create your buttons:

ttk::button .b -text hello -style Red.Corner.TButton

To change the indicator color, simply re-configure using the other style:

.b configure -style Green.Corner.TButton

References: ttk::style