I have a tkinter app that has multiple combo boxes and at the bottom also a Text widget. In the beginning, I used the style method in order to change the Combobox look but then I had to use a canvas in order to put text over the picture background and for some reason, my comboxes are now not changing their style anymore and are staying plain. here is a part of my code with only one combo box since the whole code is long but the concept i think should be applied the same:
roo = Tk()
roo.title('Shift Request')
roo.geometry('600x450')
dir_path_main_bg = os.path.join(dir_path, r"JUSTT BG For Main Window.png")
picture = PhotoImage(file=dir_path_main_bg, master=roo)
bg = Label(roo, image=picture)
bg.place(x=0, y=0, relwidth=1, relheight=1)
# Changing the combobox menu style.
roo.option_add('*TCombobox*Listbox.selectBackground', '#30D5C8') # change highlight color
roo.option_add('*TCombobox*Listbox.selectForeground', 'white') # change text color
style = ttk.Style()
style.configure('TCombobox', background='#30D5C8') # Create a border around the combobox button.
style.map('TCombobox', foreground=[('hover', 'black')], background=[('hover', '#30D5C8')]) # style the combobox when
# it's beeing hovered on.
# Creating a canvas for the main window menu to choose your shifts.
main_menu_canvas = Canvas(roo, width=500, height=450, highlightbackground='#30D5C8', highlightcolor='#30D5C8')
main_menu_canvas.pack(fill='both', expand=True)
main_menu_canvas.create_image(0, 0, image=picture, anchor='nw')
# A function to stop the highlighting when choosing a value.
def defocus(event):
event.widget.master.focus_set()
# Second drop-down menu.
chosen2 = tk.StringVar(value='Shift Starting Hour')
vyber2 = ttk.Combobox(roo, textvariable=chosen2, state='readonly')
vyber2['values'] = start_shift
vyber2.bind("<FocusIn>", defocus)
vyber2.place(relx=0.27, rely=0.16, relwidth=0.45, relheight=0.09)
vyber2.config(font=('calibri', '13'))
# Changing the combobox menu style.
roo.option_add('*TCombobox*Listbox.selectBackground', '#30D5C8') # change highlight color
roo.option_add('*TCombobox*Listbox.selectForeground', 'white') # change text color
style = ttk.Style()
style.configure('TCombobox', background='#30D5C8') # Create a border around the combobox button.
style.map('TCombobox', foreground=[('hover', 'black')], background=[('hover', '#30D5C8')]) # style the combobox when
# # it's beeing hovered on.
# Creating the text box to write notes.
default_val = tk.StringVar(value='Notes...').get()
text_box = Text(main_menu_canvas, width=45, height=6, font=('calibri','13'))
text_box.insert(INSERT, default_val)
text_box.config(highlightthickness=0.5, highlightbackground='#30D5C8', highlightcolor='#30D5C8')
main_menu_canvas.create_window(300, 336, window=text_box)
roo.mainloop()
My desired result is to make it look like how it was before. The first screenshot is the way it looks now and the second screenshot it's how it was before the text addition.
Would appreciate any help.
Related
am trying to make a notepad app and I wanted to add a small bar at the end with buttons to do custom stuff but when I try to add a button it doesn't appear on the program what did I do wrong?
here is the script
from gc import callbacks
import re
from tkinter import *
from tkinter import ttk
import time
from turtle import right
root = Tk()
root.title('Notepad')
root.iconbitmap('C:/notes.ico')
root.geometry("500x500")
root.tk.call("source", "C:/Users/Hero/Documents/Visual Studio code/My project/azure.tcl")
root.tk.call("set_theme", "dark")
def change_theme():
if root.tk.call("ttk::style", "theme", "use") == "azure-dark":
root.tk.call("set_theme", "light")
else:
root.tk.call("set_theme", "dark")
style=ttk.Style()
style.theme_use('azure-dark')
style.configure("Vertical.TScrollbar", background="grey", bordercolor="black", arrowcolor="white")
scroll = ttk.Scrollbar(root, orient='vertical')
scroll.pack(side=RIGHT, fill='y')
text=Text(root, font=("Georgia, 24"), yscrollcommand=scroll.set, bg='#292929')
scroll.config(command=text.yview)
text.pack()
#button am talking about
fonts = ttk.Button(root, text='Size and Font', style='Accent.TButton')
fonts.pack()
root.mainloop()
Update: It worked when i had the buttons at the top but at the bottom it doesn't show up
The text box is too tall for a window with size 500x500, so the button below the text box is out of the viewable area of the window.
You can set the width and height options of the text box to a smaller values and use text.pack(fill='both', expand=1)` to expand the text box to fill the window:
# set width and height to smaller values
text = Text(root, font=("Georgia, 24"), yscrollcommand=scroll.set, bg='#292929', width=1, height=1)
# then expand it to fill the window
text.pack(fill='both', expand=1)
i fixed by adding a frame then making it at the bottom then putting the button at this frame thanks everyone that tried to help
Here's my code snippet
footer_frame = tk.Frame()
tk.Label(footer_frame, text = 'by .....', font = 'arial 10', padx=5, pady=5).pack(side = tk.RIGHT, anchor='se')
footer_frame.pack(tk.BOTTOM)
To put the label all the way to the right inside the footer, the simplest way is to use pack and telling it to be on the right side.
Since you didn't have footer_frame fill the bottom, it's going to be centered by default. And since a frame shrinks to fit its contents, the label will also appear centered.
Here's an example, which uses side='right' for the label, and fill='x' for the footer frame. I gave the label a distinctive color so that you can see where it is in relation to the window and frame.
import tkinter as tk
root = tk.Tk()
root.geometry("400x200")
footer_frame = tk.Frame(root)
label = tk.Label(footer_frame, text="by .....", background="bisque")
footer_frame.pack(side="bottom", fill="x")
label.pack(side="right")
root.mainloop()
I have an option menu list with a lot of entries to be used on a touch screen device. I am able to change the font size of the selected category with PopMenue.config(font=[something]), but when selecting the drop down menu the entries appear in the default small font:
Example Pic - red frame surrounds text to increase font
How can I amend the font size from the drop down menu entries (red frame)?
Code snippet:
helv36 = tkFont.Font(family='Helvetica', size=30, weight=tkFont.BOLD)
popupMenu.config(font=helv36)
You have to use the nametowidget() method to get the widget object corresponding to the dropdown menu widget, then set its configuration.
Here's a runnable example:
import tkinter as tk
import tkinter.font as tkFont
root = tk.Tk()
root.geometry('300x200')
helv36 = tkFont.Font(family='Helvetica', size=36)
options = 'eggs spam toast'.split()
selected = tk.StringVar(root, value=options[0])
choose_test = tk.OptionMenu(root, selected, *options)
choose_test.config(font=helv36) # set the button font
helv20 = tkFont.Font(family='Helvetica', size=20)
menu = root.nametowidget(choose_test.menuname) # Get menu widget.
menu.config(font=helv20) # Set the dropdown menu's font
choose_test.grid(row=0, column=0, sticky='nsew')
root.mainloop()
Here's are two screenshots showing the default vs modified dropdown menu text sizes:
I was writing a gui and I wanted to change the color of a button but background seems to change the color of an outline instead of the full background. How do I change the color of the background of a button?
I have tried the background and style.
salmon = "#FFC6AB"
black = "#0C120C"
# ADDING BUTTONS
# Adding style
style = ttk.Style()
style.configure("X.TFrame", background=grey)
style. configure("X.TButton", background=salmon, foreground=black, font=("Courier", 20), width=17)
# Adding spacer
spacer_1 = ttk.Frame(root)
spacer_1.grid(column=0, row=1, pady=12)
spacer_1.configure(style="X.TFrame")
# Adding frame
frame_2 = ttk.Frame(root)
frame_2.grid(column=0, row=2)
frame_2.configure(style="X.TFrame")
# Adding button 1
button_1 = ttk.Button(frame_2, text="Scale Cookbook")
button_1.grid(column=0, row=0)
button_1.configure(style="X.TButton")
You are doing it the right way, your code does change the button color in Linux. You don't get the result you want because the default ttk themes for Windows and Mac do not allow to change the button background color (I think because they are created from images).
If you want to change the button background color, you can change theme for one that allows it, like 'clam' or 'alt':
style = ttk.Style()
style.theme_use('clam')
# ... the rest of your style configuration
I'm trying to change the color of my border on this button however it does nothing or gives me a grey border.
self._lqbutton = tk.Button(self._longquestionframe,
text="TEST",
bg="blue", fg="#fff",
highlightbackground="red",
highlightcolor="red",
highlightthickness=4,
relief=tk.SOLID,
borderwidth="4")
self._lqbutton.pack()
I have also tried using relief=tk.FLAT
Managed to achieve the effect by placing it inside its own frame and changing the frame attributes.
self._lqbuttonborder = tk.Frame(self._longquestionframe,
highlightbackground="#bce8f1",
highlightcolor="#bce8f1",
highlightthickness=1,
bd=0)
You cannot change the border color of a widget. The highlightcolor and highlightbackground attributes changes the color of the highlight ring, which is the border-like decoration that appears only when the widget has focus.