I am having trouble adding elements into a scrollable frame-
I have a form I am building where the user can ‘add ingredient’ and it adds a new text field for them- the problem being, once it hits the end of the page the new fields disappear off the edge of the screen. So the obvious solution would be to put the text fields into a scrollable frame so when you add new text fields, the user can scroll through the elements and allows them to add as many fields as they want.
However- when I have tried implementing the scrollableframe the elements aren’t locating inside the frame as I was expecting and it is also throwing elements into different tabs which it wasn’t previously.
Here is the code:
import customtkinter as ctk
from customtkinter import *
import pickle
ctk.set_appearance_mode("Dark")
ctk.set_default_color_theme("dark-blue")
def combobox_callback(choice):
print("comboselect")
class root(ctk.CTk):
def __init__(self, *args, **kwargs):
super().__init__(*args, **kwargs)
self.title("GenSoft")
self.geometry("800x480")
self.resizable()
self.state("normal")
self.iconbitmap()
self.grid_columnconfigure(1, weight=1)
self.grid_columnconfigure((2, 3), weight=0)
self.grid_rowconfigure((0, 1, 2), weight=1)
self.tabview = ctk.CTkTabview(self,
width=800,
height=480,
corner_radius=20,
fg_color="#ffffff",
segmented_button_selected_color="red",
segmented_button_fg_color="black",
segmented_button_selected_hover_color="green",
segmented_button_unselected_hover_color="green")
self.tabview.pack(padx=20, pady=20)
self.tabview.add("Home")
self.tabview.add("New Recipe")
self.tabview.add("Saved Recipe")
self.tabview.tab("Home").grid_columnconfigure(0, weight=1) # configure grid of individual tabs
self.tabview.tab("New Recipe").grid_columnconfigure(0, weight=1)
self.tabview.tab("Saved Recipe").grid_columnconfigure(0, weight=1)
self.label = ctk.CTkLabel(self.tabview.tab("New Recipe"), text="Ingredient", text_color="#9933cc", anchor="w", justify="left", font=("Arial Bold", 16)).place(x=25, y=65)
self.label2 = ctk.CTkLabel(self.tabview.tab("New Recipe"), text="Int", text_color="#9933cc", anchor="w", justify="center", font=("Arial Bold", 16)).place(x=200, y=65)
self.label3 = ctk.CTkLabel(self.tabview.tab("New Recipe"), text="Unit", text_color="#9933cc", anchor="w", justify="center", font=("Arial Bold", 16)).place(x=375, y=65)
self.recipe_name = ctk.CTkEntry(self.tabview.tab("New Recipe"),
placeholder_text="Recipe Name",
width=160)
self.recipe_name.place(x=550, y=25)
self.recipenames = [self.recipe_name]
self.addButton = ctk.CTkButton(self.tabview.tab("New Recipe"), text="Add Ingredient", command=self.add_ingredient)
self.addButton.place(x=25, y=25)
self.saveButton = ctk.CTkButton(self.tabview.tab("New Recipe"), text="Save Recipe", command=self.save_recipe)
self.saveButton.place(x=175, y=25)
v= StringVar()
v.trace('w', set_country())
def on_field_change(self):
return v.get()
self.countryselect = ctk.CTkComboBox(self.tabview.tab("New Recipe"), values=country, command=on_field_change).place(x=375, y=25)
my_frame = ctk.CTkScrollableFrame(self.tabview.tab("New Recipe")).pack(pady=40)
self.ingredientEntry = ctk.CTkEntry(my_frame,
placeholder_text="ingredient",
width=160)
self.ingredientEntry.place(x=25, y=100)
self.ingredientEntries = [self.ingredientEntry]
self.unitEntry = ctk.CTkEntry(my_frame,
placeholder_text="ingredient",
width=80)
self.unitEntry.place(x=200, y=100)
self.unitEntries = [self.unitEntry]
self.combobox = ctk.CTkComboBox(my_frame,
values=user_unit,
command=combobox_callback)
self.combobox.place(x=375, y=100)
self.comboEntries = [self.combobox]
def add_ingredient(self):
y = int(self.ingredientEntries[-1].place_info()["y"])
w = self.ingredientEntries[-1].winfo_width()
h = self.ingredientEntries[-1].winfo_height()
newingredientEntry = ctk.CTkEntry(self.tabview.tab("New Recipe"),
placeholder_text="ingredient",
width=w)
newingredientEntry.place(x=25, y=y+h+5)
self.ingredientEntries.append(newingredientEntry) # Add the new entry to your list
ynu = int(self.unitEntries[-1].place_info()["y"])
wnu = self.unitEntries[-1].winfo_width()
hnu = self.unitEntries[-1].winfo_height()
newunitEntry = ctk.CTkEntry(self.tabview.tab("New Recipe"),
placeholder_text="ingredient",
width=wnu)
newunitEntry.place(x=200, y=ynu+hnu+5)
self.unitEntries.append(newunitEntry) # Add the new entry to your list
ynu2 = int(self.comboEntries[-1].place_info()["y"])
wnu2 = self.comboEntries[-1].winfo_width()
hnu2 = self.comboEntries[-1].winfo_height()
newunitEntry2 = ctk.CTkEntry(self.tabview.tab("New Recipe"),
values=user_unit,
command=units(),
width=wnu2)
newunitEntry2.place(x=200, y=ynu2+hnu2+5)
self.comboEntries.append(newunitEntry2) # Add the new entry to your list
if __name__ == "__main__":
app = root()
app.mainloop()
main()
The code does throw some other bugs but I am working on it so ignore those for now-
I have tried both pack() and place() but not sure if that is specifically what is causing my error.
My goal is to have all the buttons and titles etc. outside of the scrollable frame but my text fields and combobox inside the frame- also not to overcomplicate but this is all within a specific tab (For any TKinter experienced people, tabs in CTk work like notebooks in Tk)
Many Thanks for the help! – C0untV