Tkinter UI Hierarchy (Facing issue with notebook adjustment on tkinter window)

Question

I am building an desktop app whose screenshot is attached below.
In this image you can see i am facing issue. when I am creating a notebook widget in tkinter it comes below the labels first it was not showing me on right side as it was under the listbox then after some research i was able to find that "side" should be used when packing any widget. After using "side" it comes on right side but still under the label i want the notebook to be expand on the free area of the tkinter window.

self.target_corpus = Label(master, text="Target Corpus", font=('Helvetica', 9, 'bold'))
        self.target_corpus.pack( anchor= NW)
        self.corpus_name = Label(master, text="Name:")
        self.corpus_name.pack( anchor= NW)
        self.corpus_file = Label(master, text="Files:   0")
        self.corpus_file.pack( anchor= NW)
        self.tokenss = Label(master, text="Tokens:   0")
        self.tokenss.pack( anchor= NW)

        #FRAME 2
        #LBOX_frame = LabelFrame(master, bg = 'silver')
        #LBOX_frame.pack(side= LEFT, anchor= W, padx= 6)
        #listbox
        self.Lbox = Listbox(master , height= 37, width= 25).pack(side=LEFT, anchor=W)
        

        notebook_frame = LabelFrame(master, bg = 'silver')
        notebook_frame.pack(side=TOP, anchor=N)
        notebook = ttk.Notebook(notebook_frame)
        notebook.pack(side=TOP, anchor=N)

        KWIC_tab = Frame(notebook, height=750, width=500, bg="grey")
        Plot_tab = Frame(notebook, height=750, width=500, bg="grey")
        FileView_tab = Frame(notebook, height=750, width=500, bg="grey")
        Cluster_tab = Frame(notebook, height=750, width=500, bg="grey")
        NGram_tab = Frame(notebook, height=750, width=500, bg="grey")
        Collocate_tab = Frame(notebook, height=750, width=500, bg="grey")
        Word_tab = Frame(notebook, height=750, width=500, bg="grey")
        Keyword_tab = Frame(notebook, height=750, width=500, bg="grey")
        Wordcloud_tab = Frame(notebook, height=750, width=500, bg="grey")

        KWIC_tab.pack(fill="both", expand=1)
        Plot_tab.pack(fill="both", expand=1)
        FileView_tab.pack(fill="both", expand=1)
        Cluster_tab.pack(fill="both", expand=1)
        NGram_tab.pack(fill="both", expand=1)
        Collocate_tab.pack(fill="both", expand=1)
        Word_tab.pack(fill="both", expand=1)
        Keyword_tab.pack(fill="both", expand=1)
        Wordcloud_tab.pack(fill="both", expand=1)

        #adding tab to tab controller
        notebook.add(KWIC_tab, text='KWIC')
        notebook.add(Plot_tab, text='Plot')
        notebook.add(FileView_tab, text='File View')
        notebook.add(Cluster_tab, text='Cluster')
        notebook.add(NGram_tab, text='N-Gram')
        notebook.add(Collocate_tab, text='Collocate')
        notebook.add(Word_tab, text='Word')
        notebook.add(Keyword_tab, text='Keyword')
        notebook.add(Wordcloud_tab, text='Wordcloud')

I want it like this but mine is not coming side by side to labels as it is staying under last label. I think UI tkinter hierarchy works in linear form. Would be grateful if you help me out with this and suggest me a good website for using Tkinter

outcome i am expecting

Asked By: Waleed Bin Ali

||

Source

Answer 1

The Labels you define at the top span across the full width of the window and won’t allow the Notebook/LabelFrame to expand to its full vertical size. The simple solution is to insert the Labels into a Frame and set the right parameters for .pack(). We want the Frame with the Labels to fill the space only in Y (to allow the Listbox to expand), Notebook and its LabelFrame can expand in BOTH directions and take all the available space.

Here is a minimal working example I managed to extract from your code.

from tkinter import *
from tkinter import ttk

master = Tk()

text_frame = Frame(master)
text_frame.pack(anchor=NW, side=LEFT, fill=Y)

target_corpus = Label(text_frame, text="Target Corpus", font=("Helvetica", 9, "bold"))
target_corpus.pack(anchor=NW)
corpus_name = Label(text_frame, text="Name:")
corpus_name.pack(anchor=NW)
corpus_file = Label(text_frame, text="Files:")
corpus_file.pack(anchor=NW)
tokenss = Label(text_frame, text="Tokens:")
tokenss.pack(anchor=NW)
Lbox = Listbox(text_frame)
Lbox.pack(anchor=NW, expand=True, fill=Y)

notebook_frame = LabelFrame(master, bg="silver")
notebook_frame.pack(anchor=NW, expand=True, fill=BOTH)
notebook = ttk.Notebook(notebook_frame)
notebook.pack(anchor=NW, expand=True, fill=BOTH)

KWIC_tab = Frame(notebook, bg="grey")
Plot_tab = Frame(notebook, bg="grey")
FileView_tab = Frame(notebook, bg="grey")
Cluster_tab = Frame(notebook, bg="grey")
NGram_tab = Frame(notebook, bg="grey")
Collocate_tab = Frame(notebook, bg="grey")
Word_tab = Frame(notebook, bg="grey")
Keyword_tab = Frame(notebook, bg="grey")
Wordcloud_tab = Frame(notebook, bg="grey")

KWIC_tab.pack(expand=True, fill=BOTH)
Plot_tab.pack(expand=True, fill=BOTH)
FileView_tab.pack(expand=True, fill=BOTH)
Cluster_tab.pack(expand=True, fill=BOTH)
NGram_tab.pack(expand=True, fill=BOTH)
Collocate_tab.pack(expand=True, fill=BOTH)
Word_tab.pack(expand=True, fill=BOTH)
Keyword_tab.pack(expand=True, fill=BOTH)
Wordcloud_tab.pack(expand=True, fill=BOTH)

notebook.add(KWIC_tab, text="KWIC")
notebook.add(Plot_tab, text="Plot")
notebook.add(FileView_tab, text="File View")
notebook.add(Cluster_tab, text="Cluster")
notebook.add(NGram_tab, text="N-Gram")
notebook.add(Collocate_tab, text="Collocate")
notebook.add(Word_tab, text="Word")
notebook.add(Keyword_tab, text="Keyword")
notebook.add(Wordcloud_tab, text="Wordcloud")

master.mainloop()

Answered By: Trolobezka

Tkinter UI Hierarchy (Facing issue with notebook adjustment on tkinter window)

Question:

Answers: