Search code examples
pythontkinterttk

ttk Entry background colour


How exactly do I change the background colour of an Entry widget from ttk? What I have so far is:

        self.estyle = ttk.Style()
        self.estyle.configure("EntryStyle.TEntry", background='black')
        self.estyle.map("EntryStyle.TEntry",
                        foreground=[('disabled', 'yellow'),
                                    ('active', 'blue')],
                        background=[('disabled', 'magenta'),
                                    ('active', 'green')],
                        highlightcolor=[('focus', 'green'),
                                        ('!focus', 'red')])
        self.urlentry_v = StringVar()
        self.urlentry = ttk.Entry(self.input_frame, style="EntryStyle.TEntry",
                                  textvariable=self.urlentry_v)

Basically, I've changed everything I can think of, but the text entry remains stubbornly white.

Additionally, is there a way of changing the border colour?


Solution

  • I've figured it out, after a lot of digging. As hard as I had to search to figure this out, I suppose others would benefit from this:

    The standard style applied to ttk.Entry simply doesn't take a fieldbackground option, which would be what changes the colour of the text entry field. The solution is this to create a new element that does respond to the option.

    from tkinter import *
    from tkinter import ttk
    
    root_window = Tk()
    
    estyle = ttk.Style()
    estyle.element_create("plain.field", "from", "clam")
    estyle.layout("EntryStyle.TEntry",
                       [('Entry.plain.field', {'children': [(
                           'Entry.background', {'children': [(
                               'Entry.padding', {'children': [(
                                   'Entry.textarea', {'sticky': 'nswe'})],
                          'sticky': 'nswe'})], 'sticky': 'nswe'})],
                          'border':'2', 'sticky': 'nswe'})])
    estyle.configure("EntryStyle.TEntry",
                     background="green", 
                     foreground="grey",
                     fieldbackground="black")
    entry_v = StringVar()
    entry = ttk.Entry(root_window, style="EntryStyle.TEntry", textvariable=entry_v)
    entry.pack(padx=10, pady=10)
    

    Unfortunately, it appears that the only way to change the border colour is to either give it zero border width and nest it in a frame that acts as its border, or to define a new layout item that uses an image as a border.

    Additionally, note that the only thing the background controls is the very tiny corner space; if you squint closely, you can see a single pixel of green in each corner.

    To use an image as a border, you can do this:

    img2 = PhotoImage("entryBorder", data="""
            R0lGODlhHQAdAOMNAAAAAAQGCAgLERkfLR0mODBFZTFFZTNIajtTezxTez1XgD5XgU
            Fch////////////ywAAAAAHQAdAAAEbHCQg5i9OGt0iFRaKGLKxBgCoK5s6woGc4Cp
            a9+AwFQM7ruYn1AVHP6KRhwyaVsyW87nKioFUKXXZ5a5TXaN32FYOD5eqsAzmlX2tZ
            XqNZGxYATkgAD9wCjUqgIFMgR1I4YZCx4TCYeGCR0DEQA7""")
    
    oestyle = ttk.Style()
    oestyle.element_create("blueborder", "image", "entryBorder",
                                       border=3, sticky="nsew")
    oestyle.layout("OEntryStyle.TEntry",
                   [('Entry.blueborder', {'children': [(
                       'Entry.padding', {'children': [(
                         'Entry.textarea', {'sticky': 'nswe'})],
                          'sticky': 'nswe'})], 'sticky': 'nswe'})])
    oestyle.configure("OEntryStyle.TEntry",
                     background="black",
                      foreground="grey")
    oentry_v = StringVar()
    oentry = ttk.Entry(root_window, style="OEntryStyle.TEntry", textvariable=oentry_v)
    oentry.pack(padx=10, pady=10)
    

    The string of characters is generated by feeding an image of the borders I want as a gif to

    import base64
    
    with open('otherframeBorder.gif', 'rb') as f:
        encoded = base64.encodestring(f.read())
        print(encoded.decode('latin1'))