Headings in my tkinter GUI program are overlapping

Question

from tkinter import *
import math

root = Tk()

# Width x Height
root.geometry("1366x768")#it will be the starting size

# width, height
root.minsize() #it will be the minimum size


# width, height
root.maxsize() #it will be the maximum size

#setting tittle
root.title("Calculator")

#defining operations

def add():

    def answeradd():
        xadd=input1add.get()+input2add.get()
        xlabel = Label (root, text = ("your answer is", xadd) )
        xlabel.grid(row=5,column=1)

    #telling user what to give input
    Heading=Label(root, text = "Addition" , font = "Azonix 16 bold").grid(row=1,column=1)
    input1_Label=Label(root, text = "enter the first number" , font = "Azonix 12 ").grid(row=2,column=1)
    input2_Label=Label(root, text = "enter the second number" , font = "Azonix 12 ").grid(row=3,column=1)

    #getting input from the user
    input1add = IntVar()
    input1_entryadd = Entry(root, textvariable=input1add).grid(row=2,column=2)
    input2add = IntVar()
    input2_entryadd = Entry(root, textvariable=input2add).grid(row=3,column=2)

    #telling user the answer 
    Button(text="get answer",command=answeradd).grid(row=4,column=1)

def sub():
    def answersub():
        xsub=input1sub.get()-input2sub.get()
        xlabel = Label (root, text = ("your answer is", xsub) )
        xlabel.grid(row=5,column=1)

    #telling user what to give input
    Heading=Label(root, text = "Subtraction" , font = "Azonix 16 bold").grid(row=1,column=1)
    input1_Label=Label(root, text = "enter the first number" , font = "Azonix 12 ").grid(row=2,column=1)
    input2_Label=Label(root, text = "enter the second number" , font = "Azonix 12 ").grid(row=3,column=1)


    #getting input from the user
    input1sub = IntVar()
    input1_entrysub = Entry(root, textvariable=input1sub).grid(row=2,column=2)
    input2sub = IntVar()
    input2_entrysub = Entry(root, textvariable=input2sub).grid(row=3,column=2)

    #telling user the answer 
    Button(text="get answer",command=answersub).grid(row=4,column=1)

def multi():
    def answermulti():
        xmulti=input1multi.get()*input2multi.get()
        xlabel = Label (root, text = ("your product is", xmulti) )
        xlabel.grid(row=5,column=1)

    #telling user what to give input
    Heading=Label(root, text = "Multiplication" , font = "Azonix 16 bold").grid(row=1,column=1)
    input1_Label=Label(root, text = "enter the first factor" , font = "Azonix 12 ").grid(row=2,column=1)
    input2_Label=Label(root, text = "enter the second factor" , font = "Azonix 12 ").grid(row=3,column=1)


    #getting input from the user
    input1multi = IntVar()
    input1_entrymulti = Entry(root, textvariable=input1multi).grid(row=2,column=2)
    input2multi = IntVar()
    input2_entrymulti = Entry(root, textvariable=input2multi).grid(row=3,column=2)

    #telling user the answer 
    Button(text="get product",command=answermulti).grid(row=4,column=1)

def div():
    def answerdiv():
        xdiv=input1div.get()/input2div.get()
        xlabel = Label (root, text = ("your answer is", xdiv) )
        xlabel.grid(row=5,column=1)

    #telling user what to give input
    Heading=Label(root, text = "Division" , font = "Azonix 16 bold").grid(row=1,column=1)
    input1_Label=Label(root, text = "enter the first number" , font = "Azonix 12 ").grid(row=2,column=1)
    input2_Label=Label(root, text = "enter the second number" , font = "Azonix 12 ").grid(row=3,column=1)


    #getting input from the user
    input1div = IntVar()
    input1_entrydiv = Entry(root, textvariable=input1div).grid(row=2,column=2)
    input2div = IntVar()
    input2_entrydiv = Entry(root, textvariable=input2div).grid(row=3,column=2)

    #telling user the answer 
    Button(text="get answer",command=answerdiv).grid(row=4,column=1)

#adding buttons to do particular opreation
Buttonadd=Button(text="addition",command=add)
Buttonadd.grid(row=6,column=1)

Buttonsub=Button(text="subtraction",command=sub)
Buttonsub.grid(row=6,column=2)

Buttonmulti=Button(text="multiplication",command=multi)
Buttonmulti.grid(row=6,column=3)

Buttonmulti=Button(text="division",command=div)
Buttonmulti.grid(row=6,column=4)

root.mainloop()

The headings of different functions are overlapping each other if you use one function (for example use multiplication) and then use another function (for example use division) the headings overlap each other is there any solution to it.

You can also suggest few features to add to it as I know it has pretty less features so I would like to add new features to it and I also know that the user interface is not so good I will work on it after the program works as desired.

Answer 1

The heading are overlapping because you're putting Labels of different sizes on top of one another. A simple what to avoid that is to make them all the same width, and make that width the length of the longest heading.

i.e.

HEADINGS = "Addition", "Subtraction", "Multiplication", "Division"
LONGEST_HEADING = max(len(heading) for heading in HEADINGS)  # Length of longest heading.

Then specify the length of the longest as the width option when making each operation's heading Label:

heading = Label(root, width=LONGEST_HEADING, text="Addition", font="Azonix 16 bold")
heading.grid(row=1,column=1)
…
heading = Label(root, width=LONGEST_HEADING, text="Subtraction", font="Azonix 16 bold")
heading.grid(row=1,column=1)
… etc

Note: Something similar would have to be done for the widgets on other lines as well.

Tip: The grid() method doesn't return anything, so you shouldn't be assigning the result of calling it to variable (heading) like your doing in your code. It doesn't matter in this particular case because the heading variable is never used again — so its value doesn't really matter — but it's a mistake you should try avoid. (And correct the other cases of it in your code besides those shown.)

Better Way

Take a look at @Bryan Oakley's answer the question Switch between two frames in tkinter? which I think my be a better way to structure your application — you could define a separate Page class for each of the mathematical operations. This will make them more independent and also avoid having a problem with the display of widget overlapping (because each page completely covers the others).