How do I adjust ttk widget formatting

136 views
Skip to first unread message

Dave

unread,
Aug 9, 2020, 12:38:47 AM8/9/20
to
I'd like to start using ttk widgets which I have avoided for a long time.

------
package require Tk

button .o -text TEXT -anchor w -width 25
ttk::button .n -text TEXT

pack .o .n -side top -fill x -expand true

console show
puts style=[.n cget -style]
------

The result: style=<blank> and you can see that "TEXT" is left justified
on the normal button (-anchor) but centered on the ttk button (no option
to justify/anchor text).

How do I anchor the ttk button's text to the left as I can with the
normal button? Is it possible or have I lost a lot of formatting options
with ttk::button?

I saw a reference to "Toolbutton" style on the ttk::button manpage.
Using "ttk::style layout Toolbutton" I see what looks to be how I might
adjust things. Assuming that is what I would need to change, would I now
have to define a new layout for every widget I want to restore some of
the look of the normal widgets?

If so, that seems to be a lot of extra work just to get things looking
the way I want them.

So bottom line, what do I change and how?

--
computerjock AT mail DOT com

Brad Lanam

unread,
Aug 9, 2020, 1:14:25 AM8/9/20
to
ttk::style configure TButton -anchor w

will change the style of all ttk buttons to anchor the text to the west.
This will affect all buttons. Note that different themes may default to
center or left anchoring, so "normal" depends on the theme.

You can create alternate styles that can be applied.

ttk::style configure East.TButton -anchor e
.n configure -style East.TButton

I would avoid changing layouts unless you really need to.
You can also do:

.n configure -style TLabel

and you will have a button that looks like a label and can be configured
like a label. This allows some alternative methods to style
widgets that can make certain stylings easier.

Dave

unread,
Aug 15, 2020, 4:55:15 AM8/15/20
to
First of all, thank you for your response.

However, I'm now back to where I have always wound up when I looked into
the ttk widgets.

% ttk::style theme use
vista

OK, the "vista" theme is apparently in effect

Now, where do I get the style?

% ttk::button .but
.but
% .but cget -style
[Nothing]
% .but cget -class
[Nothing]

I'm now at a dead end. ttk::style wants me to know the "style name"
before I can do any queries.

Even the "elements" are a mystery. The ttk::intro man page has an example:

ttk::style layout Horizontal.TScrollbar { ...

Where did "Horizontal.TScrollbar" come from? How can I find these names?

You suggested I use "TButton"... where did that come from? (It works, of
course)

I >do< see:
% bindtags .but
.but TButton . all

Is >that< where "TButton" comes from? Is there a better way to find
"TButton"?

% ttk::style layout TButton
Button.button -sticky nswe -children {Button.focus -sticky nswe
-children {Button.padding -sticky nswe -children {Button.label -sticky
nswe}}}

The ttk::style manpage tells me this is a simplified "pack" geometry
manager.

You suggested I could use: ttk::style configure TButton -anchor w

and the ttk::intro manpage has the example:

ttk::style configure TButton \
-background #d9d9d9 \
-foreground black \
-relief raised \

I cannot find any of those options listed on either ttk::widget or
ttk::button

I see no "-anchor" option in the layout. Where did you get the "-anchor
w"? The ttk::widget man page does not show any such "-anchor". Neither
does the ttk::button man page... no -anchor option. Where can I find
what options are available?

Again, I >do< see:
% ttk::style configure TButton
-padding {1 1} -anchor center -width -11

So maybe that's where -anchor comes from. Are those the only options for
TButton? Where could I find all the options that are possible?

Then, you suggested I could use: ttk::style configure East.TButton -anchor e

Is "East.Tbutton" an arbitrary name or is there some connection between
that name and existing names (whatever those names are)?

So, my frustration always returns to "how is a theme connected to a
style, and how is a style connected to a widget?" -- and the bottom
line: how can I interrogate the theme/style/ttk system to see how the
connection is done?

Maybe there's some documentation I've been missing... I don't know.
Thank you for reading my attempt to describe my confusion.

Francois Vogel

unread,
Aug 15, 2020, 5:57:32 AM8/15/20
to
Le 15/08/2020 à 10:54, Dave a écrit :
> Now, where do I get the style?
>
> % ttk::button .but
> .but
> % .but cget -style
> [Nothing]
> % .but cget -class
> [Nothing]

% ttk::button .but
.but
% winfo class .but
TButton

See also the ttk::button man page, which mentions "The class name for a
ttk::button is TButton."


> % ttk::style layout TButton
> Button.button -sticky nswe -children {Button.focus -sticky nswe
> -children {Button.padding -sticky nswe -children {Button.label -sticky
> nswe}}}
>
> The ttk::style manpage tells me this is a simplified "pack" geometry
> manager.
>
> You suggested I could use: ttk::style configure TButton -anchor w
>
> and the ttk::intro manpage has the example:
>
> ttk::style configure TButton \
>     -background #d9d9d9 \
>     -foreground black \
>     -relief raised \
>
> I cannot find any of those options listed on either ttk::widget or
> ttk::button

Really?
Which Tk version?
There is a difference between an "option" and a "styling option". You
should look at that latter category in the man page.

> I see no "-anchor" option in the layout. Where did you get the "-anchor
> w"? The ttk::widget man page does not show any such "-anchor". Neither
> does the ttk::button man page... no -anchor option. Where can I find
> what options are available?

"Styling options" show them:

https://www.tcl.tk/man/tcl8.6/TkCmd/ttk_button.htm#M12

> Then, you suggested I could use: ttk::style configure East.TButton
> -anchor e
>
> Is "East.Tbutton" an arbitrary name or is there some connection between
> that name and existing names (whatever those names are)?

You can create new styles with arbitrary names, e.g. "East.Tbutton".

> So, my frustration always returns to "how is a theme connected to a
> style, and how is a style connected to a widget?" -- and the bottom
> line: how can I interrogate the theme/style/ttk system to see how the
> connection is done?
>
> Maybe there's some documentation I've been missing... I don't know.

May I suggest the following reading:

https://tkdocs.com/tutorial/styles.html

There are many (if not all) answers there to your questions I think.

Regards,
Francois


Brad Lanam

unread,
Aug 15, 2020, 5:31:58 PM8/15/20
to
On Saturday, August 15, 2020 at 1:55:15 AM UTC-7, Dave wrote:
> First of all, thank you for your response.
>
> However, I'm now back to where I have always wound up when I looked into
> the ttk widgets.
>
> % ttk::style theme use
> vista

Also be aware that the 'vista' style is meant to match the
Windows look and feel.
It may not be as configurable as some other themes are.

Brad Lanam

unread,
Aug 15, 2020, 5:52:30 PM8/15/20
to
On Sat, Aug 15, 2020 at 1:55 AM Dave <nor...@nohost.com> wrote:
> First of all, thank you for your response.
> [...]
> So, my frustration always returns to "how is a theme connected to a
> style, and how is a style connected to a widget?" -- and the bottom
> line: how can I interrogate the theme/style/ttk system to see how the
> connection is done?

Every widget's class name (TButton, TLabel, Treeview, etc.) has an associated
style, and each theme defines the style and layout for each widget.

Different themes have different options for the widgets, though most of the
more important options are the same.

Interrogating the widgets for their current style returns {} if they are defaulted.
Interrogating the style for the defaults generally doesn't work, as you have noticed.

There are *many* issues in dealing with ttk themes. They're easier to use than
than the original tk widgets, which would require a wrapper around
each instantiation to set the styling. But there could certainly be
improvements.

See also:

https://wiki.tcl-lang.org/page/Changing+Widget+Colors

I wrote this page due to the lack of documentation. And since then,
the manual pages have been updated with much of that information.

https://wiki.tcl-lang.org/page/List+of+ttk+Themes

Dave

unread,
Aug 17, 2020, 8:13:52 PM8/17/20
to
On 8/15/2020 4:57 AM, Francois Vogel wrote:
>>
>> I cannot find any of those options listed on either ttk::widget or
>> ttk::button
>
> Really?
> Which Tk version?
> There is a difference between an "option" and a "styling option". You
> should look at that latter category in the man page.
>
>> I see no "-anchor" option in the layout. Where did you get the
>> "-anchor w"? The ttk::widget man page does not show any such
>> "-anchor". Neither does the ttk::button man page... no -anchor option.
>> Where can I find what options are available?
>
> "Styling options" show them:
>
> https://www.tcl.tk/man/tcl8.6/TkCmd/ttk_button.htm#M12

I am using Tcl 8.6.8 and it has no "Styling options" on the man pages. I
see that the link in your posting takes me to Tcl 8.6.10.

Reading the tutorial link, it uses TButton as its example. I want to
change the font for a ttk::labelframe so I did:

% ttk::style layout TLabelframe
Labelframe.border -sticky nswe
% ttk::style element options Labelframe.border
% ttk::style element options Labelframe

There is no font option that I can see.

>But<, reading the 8.6.10 man page for ttk::labelframe >did< shows (as
Brad pointed out below in his response):

TLabelframe.Label styling options configurable with ttk::style are:
-font font

So I guess the documentation has been updated significantly for 8.6.10.
>That< would have helped me out tremendously!

Dave

unread,
Aug 17, 2020, 8:28:00 PM8/17/20
to
Again, thanks for taking the time to respond.

I should mention I am usng Tcl 8.6.8 on win7x64

I've gone over the two pages you referenced. In addition to
left-adjusting the text in a button, I also want to change the font for
a labelframe. I saw the heading for ttk::labelframe on the
"Changing+Widget+Colors" page and I decided to see if I could derive
that information myself.

First of all:

% font create B {*}[font configure TkHeadingFont] -weight bold -size 14
B
% ttk::style configure TLabelframe.Label -font B
% ttk::labelframe .lframe -width 100 -height 50 -text "My Heading"
.lframe
% pack .lframe

It works, great! Now, is there a way I could have figured that out myself?

I'll restart tkcon and start with the theme.

% ttk::style theme settings vista
wrong # args: should be "ttk::style theme settings theme script"

Nope.

% lsearch -inline -all -nocase [ttk::style element names] *frame*
ComboboxPopdownFrame.background

Nothing related to a labelframe. (I did look at the entire list but saw
nothing related to labelframe's)

Now, I'm just making guesses:

% ttk::style layout TLabelframe
Labelframe.border -sticky nswe

Nothing to do with the font.

% ttk::style configure TLabelframe
% ttk::style map TLabelframe
% ttk::style lookup TLabelframe
wrong # args: should be "ttk::style lookup style -option ?state? ?default?"

I don't have an "option" name; that's what I'm trying to find.

Making a wild guess:

% ttk::style lookup TLabelframe -font
TkDefaultFont

Finally, I think I'm getting somewhere. So:

% font create B ...
B
% ttk::style configure TLableframe -font B
% ttk::labelframe .lframe -width 100 -height 50 -text Heading
.lframe
% pack .lframe

Did not work.

Francois' response above led me to the 8.6.10 man pages. >That< is what
I was looking for! The 8.6.8 man pages do not have that information.

Where did your example "TLabelframe.Label" come from? How did you find
that? From the 8.6.10 man page?

I do want to ask: could I have found your solution for 8.6.8?
% ttk::style configure TLabelframe.Label -font B

Would I have to dig into the source in lib/tk8.6/ttk? If so, I hope that
8.6.10 has better introspection options for the ttk widgets.

Harald Oehlmann

unread,
Aug 18, 2020, 12:47:23 AM8/18/20
to
Dave,

change the font of the ttk::labelframe:

ttk::style configure TLabelframe.Label -font TitleFont

Hope this helps,
Harald
Reply all
Reply to author
Forward
0 new messages