I'm trying to make a tkinter app that doesn't look like a tkinter app. I'm using a ttk Notebook, and the tabs have this little dotted line around the text when they're selected. It looks terrible, and I can't find a way to remove it using either styles or config. Here's a screenshot to clarify:
Edit for code (I don't think it'll be terribly helpful, since I'm actually just trying to remove a default style thing.):
Here is the notebook creation:
tabs = ttk.Notebook(mainframe, width=319, height=210, style=style.Notebook)
tabs.grid(column=0, row=1, sticky=('n', 'w', 'e', 's'))
tabs.columnconfigure(0, weight=1)
tabs.rowconfigure(0, weight=1)
Filling it in:
tab1 = ttk.Frame(tabs)
tab1_frame = ttk.Frame(tab1, style=style.Frame)
tab1_frame.pack(anchor='center', expand=1, fill='both')
# stick some widgets in
progress = ttk.Progressbar(tab1_frame, orient="horizontal", length=300, mode="determinate")
progress.grid(column=1, row=1, columnspan=2, padx=style.padding, pady=style.padding)
progress['maximum'] = 1000
progress['value'] = 500
# More widgets
# Another tab
tab2 = ttk.Frame(tabs)
tab2_frame = ttk.Frame(tab2, style=style.Frame)
tab2_frame.pack(anchor='center', expand=1, fill='both')
# blah blah
Relevant styles:
style_config = Style()
style_config.theme_use('default')
style_config.configure(self.Notebook,
background=self.dark,
borderwidth=0)
style_config.configure(self.Tab,
background=self.dark,
foreground='white',
padding=self.padding,
borderwidth=0)
style_config.map(self.Tab,
background=[('selected', self.color1)])
You can remove this focus mark by altering the sub elements of tab widget. Ttk widgets are decomposed in subelements. The layout of these elements is described through layout
method (or in a layout parameter of theme_create
). Here is a command to remove layout marks (you can apply it directly to Tab, or any other derived theme), the commented part is what lead previously to drawing the focus (retrieved through style.layout("Tab")
)
style.layout("Tab",
[('Notebook.tab', {'sticky': 'nswe', 'children':
[('Notebook.padding', {'side': 'top', 'sticky': 'nswe', 'children':
#[('Notebook.focus', {'side': 'top', 'sticky': 'nswe', 'children':
[('Notebook.label', {'side': 'top', 'sticky': ''})],
#})],
})],
})]
)
A more hacky way could be to alter the color of this focus mark, for instance to draw it the same color as background
style.configure("Tab", focuscolor=style.configure(".")["background"])
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With