Don't understand grid() in Tkinter

Question

I know this is a bit of a broad question. I'm just starting out with Python and Tkinter and I'm building my first app. I have a few widgets done and a few more on the way but I can't seem to place them the way I want at all. Here's my code:

import tkinter
from tkinter import font
import tkinter as tk
import time
from threading import Thread
from PIL import Image, ImageTk

class Window(tk.Frame):
    def __init__(self, master=None):
        tk.Frame.__init__(self, master)               
        self.master = master

def update_timeText():
    current = time.strftime("%H:%M")
    seconds = time.strftime(":%S")
    currentDate=time.strftime("%a %e %B, %Y")
    timeText1.configure(text=current, fg='white', background='black')
    timeText1.grid(row=0,column=0, sticky='NW', padx=15, pady=15)
    timeText2.configure(text=seconds, fg='white', background='black')
    timeText2.grid(row=0, column=1, pady=17, sticky='NW')
    Date.configure(text=currentDate, fg='white', background='black')
    Date.grid(row=0, column=0, columnspan=3, sticky='NW', padx=20, pady=124, rowspan=2)  
    root.after(1000, update_timeText)

def update_Weather():
    temperature=int(13)
    picture = ImageTk.PhotoImage(picturePNG)
    weatherIcon.configure(image=picture, background='black')
    weatherIcon.grid(column=5, sticky='ne')
    weatherTemperature.configure(text=temperature, fg='white', background='black')
    weatherTemperature.grid(column=6, sticky='ne')
    root.after(100000, update_Weather)

root = tk.Tk()
root.configure(background='black')
root.title('Smart Mirror')
timeText1 = tk.Label(root, text="", font=("Opinio", 90, "bold"))
timeText2 = tk.Label(root, text="", font=("Opinio", 45, "bold"))
weatherTemperature=tk.Label(root, text="", font=("Roboto Condensed", 80))
weatherIcon=tk.Label(root, image="")
Thread(target=update_Weather).start()
Thread(target=update_timeText).start()
app = Window(root)
root.mainloop()

What I managed to get after hours of messing with the grid and Googling: Screenshot

What I'm trying to get: Screenshot2

I just can't seem to make any space horizontally inbetween the widgets. I know I'm asking for a lot but if someone could explain grid a bit instead of just posting an answer I'd be really grateful, since I've read a lot of information about it online and can't seem to get the gist of it at all.

Possible duplicate of [How to add space between two widgets placed in grid in tkinter ~ python?](https://stackoverflow.com/questions/39555194/how-to-add-space-between-two-widgets-placed-in-grid-in-tkinter-python) — Lev Leontev, Mar 13 '19 at 18:52
I already looked at that website many times but I don't understand it quite well. What I'm looking for is more along the line of grid() for dummies. — K.Hodzic, Mar 13 '19 at 19:13
Since you're asking about `grid`, and not about threads or urllib or the other things in this code, I recommend you reduce this code down to a [mcve] that has only the grid code, and enough other code to illustrate your problem. — Bryan Oakley, Mar 13 '19 at 20:43
I'm sorry i posted a question once before and i was asked to include everything so i thought i should do the same here, I've cleaned it up as much as possible while trying to keep the base functionality. — K.Hodzic, Mar 13 '19 at 21:30
Just add `row=0` when you grid your `weatherIcon` and `weatherTemperature` in `update_Weather`? — Henry Yik, Mar 14 '19 at 03:16

figbeam · Accepted Answer · 2019-03-14T03:58:31.290

You create widgets as slaves to root instead of as slaves to the class Window(). This is confusing and makes the class dependant on that the main program creates some of the widgets that the Window() object will later configure.

Assign row when you grid widgets, as @Henry Yik comments.

Here is an example of how I would place the widgets:

import tkinter as tk

class Window(tk.Frame):
    def __init__(self, master=None):
        tk.Frame.__init__(self, master)               
        self.master = master
        self.configure(bg='thistle')    # To see where self is
        self.pack(expand=True, fill='both', padx=10, pady=10)
        self.columnconfigure(0, weight=1)   # Which column should change
                                            # when window size changes

        Date = tk.Label(self, text='19:38:25', fg='white', bg='black',
                                      font='-size 70')
        Date.grid(row=0, column=0, columnspan=3, sticky='NW', padx=20, pady=70, rowspan=2)  

        picture = tk.PhotoImage(file='sun.png')
        weatherIcon = tk.Label(self, image=picture, bg='black')
        weatherIcon.grid(row=0, column=5, sticky='NE')
        weatherIcon.image = picture     # Save a reference to the picture

        weatherTemperature = tk.Label(self, text='4°C', fg='white', bg='black',
                                      font='-size 70')
        weatherTemperature.grid(row=0, column=6, sticky='NE')

root = tk.Tk()
root.configure(background='tan')    # To see where root is
root.geometry('900x300')

app = Window(root)

root.mainloop()

Does this explain any better?

I didnt really use your code here but it did help me a lot, and i managed to figure it out with it. Thanks a bunch. — K.Hodzic, Mar 14 '19 at 17:35

Don't understand grid() in Tkinter

1 Answers1