How to set the background color of a ttk.Combobox

Question

I have a problem to set background color for Combobox using tkinter ttk with 'vista' theme (I'm using Python 3). I've tried code from here ttk.Combobox glitch when state is read-only and out of focus

import tkinter as tk
from tkinter import ttk

root = tk.Tk()
combo = ttk.Combobox(root, values=['1', '2', '3'])
combo['state'] = 'readonly'
combo.pack()
tk.Entry(root).pack()

style = ttk.Style()
style.map('TCombobox', selectbackground=[('readonly', 'red')])
#style.map('TCombobox', fieldbackground=[('readonly', 'blue')]) #not working as well

But this will change only background for text, rest part of combobox rests white. Also I saw a post on the tcl forum: http://wiki.tcl.tk/15780 and I've tried with 'fieldbackground' but it seems that tkinter ignores this parameter. Do you have any idea how to solve it? Maybe there is a way to configure only specific style in specific theme? I saw that for 'default' theme, the background changes to gray color if state is 'readonly'.

Buttery

Your code works fine in python 2.7. You need to use fieldbackground only. It works as expected. – Boggess

Did you try it with 'vista' theme? For this theme, it's not work for me. – Buttery

Answer 1

Apparently, the order you set the properties of the new style is important to determine if a certain property of the new style will be applied or not. For example, if I set first the background instead of selectbackground, then the color of selection will not be changed, but just the mini button color with the arrow (to list down the options).

I noted also that depending on the value of parent, which I suppose is the parent style from which the new style is derived, some of the new settings and properties of the new style might not be applied. For example, if I try to change the fieldbackground property when parent is set to aqua, it does not work, but if parent is set to alt, it works. (I hope more expert users can help and contribute to improve this answer, which could be helpful also for future users of ttk and tkinter).

This is my solution, where I created a complete new style:

import tkinter as tk
from tkinter import ttk

root = tk.Tk()

combostyle = ttk.Style()

combostyle.theme_create('combostyle', parent='alt',
                         settings = {'TCombobox':
                                     {'configure':
                                      {'selectbackground': 'blue',
                                       'fieldbackground': 'red',
                                       'background': 'green'
                                       }}}
                         )
# ATTENTION: this applies the new style 'combostyle' to all ttk.Combobox
combostyle.theme_use('combostyle') 

# show the current styles
# print(combostyle.theme_names())

combo = ttk.Combobox(root, values=['1', '2', '3'])
combo['state'] = 'readonly'
combo.pack()

entry = tk.Entry(root)
entry.pack()

root.mainloop()

Since I am not an expert on ttk, I was not able to apply a new theme just to a certain instance of type ttk.Combobox, but I applied the theme to all instances of future possible ttk.Combobox. If someone can improve this answer, I would really appreciate the gesture!

For more information on how to create and set new styles, see here or here.

Dorolisa

Hi, I've tried your code and it seems to work. Unfortunately it looks like there is no possibility to change background color for let's say, 'vista' theme. For 'winnative' you can change only background color, for 'clam', 'alt', default', 'classic' you can change everything, with some different behaviour is combobox is focused or selected. For 'vista' and 'xpnative' it seems not working at all – Buttery

Answer 2

This code below worked fine for me.It is important set the order of the parameters.

style = ttk.Style()

style.map('TCombobox', fieldbackground=[('readonly','white')])
style.map('TCombobox', selectbackground=[('readonly', 'white')])
style.map('TCombobox', selectforeground=[('readonly', 'black')])

self.mycombo = ttk.Combobox(self.frame,textvariable=self.combo_var,
                            height=15,justify='left',width=21,
                            values=lista)

self.mycombo['state'] = 'readonly' # Set the state according to configure colors
self.mycombo.bind('<<ComboboxSelected>>',
                  lambda event: self._click_combo())

Cess

Answer 3

If you just want to change the color without regard to the state of the widget (ie. hover, pressed, etc...), then you will want to use the configure method instead of the map method, as the map method is meant specifically for applying various formats to specific widget states. Since you are only using the "readonly" state, I assume this is what you want.

style.configure('TCombobox', fieldbackground='red')

Archean

Add more details to explain your answer – Accipiter