How to reproduce class within tkinter - python-3.x

Question

I built a little Synchronizer GUI program, using tkinter. I recently tried adding a +-Button, which reproduces the filebrowsing buttons and entry fields, so I can sync more than 2 directories. (I.e. personally, I have my Documents as well as Pictures backed up on a USB drive that I want to keep updated, but I dont want to copy my whole /home directory.)
I have run into two issues. The first issue is with the positioning of the plus Button: I have initialized the rowcount to zero, so everytime I click the +-Button, the new line of Buttons/fields is actually on a new line. sadly, this does not work for the plus button, that is defined outside the fuction, but shouldn't self.rowcount += 1 adjust rowcount for the whole class?
Secondly, I am not sure how to handle self.sourcefile and self.targetfile: When I select a new folder, it replaces the previous input, which is not the idea.
I would really appreciate any help!
from tkinter import *
from tkinter import filedialog
class Application():
def __init__(self):
self.root = Tk()
self.rowcount = 0
self.sourcefile = ""
self.targetfile = ""
self.sourceDirectory = Entry(self.root, width=10)
self.targetDirectory = Entry(self.root, width=10)
self.sourceDirectory.insert(0, "Source")
self.targetDirectory.insert(1, "Target")
selectSource = Button(self.root, text = "browse source", command=self.select_source, height=15, width=15)
selectTarget = Button(self.root, text = "browse target", command=self.select_target, height=15, width=15)
plusButton = Button(self.root, text = "+", command=self.create_new)
self.sourceDirectory.grid(row=0, column=0)
self.targetDirectory.grid(row=0, column=5)
selectSource.grid(row=0, column=1)
selectTarget.grid(row=0, column=10)
plusButton.grid(row=self.rowcount + 1, column=10)
self.root.mainloop()
def create_new(self):
self.rowcount += 1
print(self.rowcount)
self.sourceDirectory = Entry(self.root, width=10)
self.targetDirectory = Entry(self.root, width=10)
self.sourceDirectory.insert(0, "Source")
self.targetDirectory.insert(1, "Target")
selectSource = Button(self.root, image=self.browsericon, command=self.select_source, height=15, width=15)
selectTarget = Button(self.root, image=self.browsericon, command=self.select_target, height=15, width=15)
self.sourceDirectory.grid(row=self.rowcount, column=0)
self.targetDirectory.grid(row=self.rowcount, column=5)
selectSource.grid(row=self.rowcount, column=1)
selectTarget.grid(row=self.rowcount, column=10)
def select_source(self):
source = filedialog.askdirectory(title="Select Source")
self.sourceDirectory.delete(0, END)
self.sourceDirectory.insert(0, source)
self.sourcefile = source
def select_target(self):
target = filedialog.askdirectory(title="Select Target")
self.targetDirectory.delete(0, END)
self.targetDirectory.insert(1, target)
self.targetfile = target
Application()

Answer 1

shouldn't self.rowcount += 1 adjust rowcount for the whole class?
Yes, and it does in your code. However, changing the variable won't change the location of a widget that used that variable in a grid command.
My advice is to put the rows in one frame and the buttons in another. That way you don't have to keep adjusting the location of the buttons. For example:
self.row_frame = Frame(self.root)
self.button_frame = Frame(self.root)
self.button_frame.pack(side="bottom", fill="x")
self.row_frame.pack(side="top", fill="both", expand=True
Also, if the "+" button creates a new row, it shouldn't be duplicating code. You need to have a single function for adding a row. Since you already have a function to do that, you can call that function in __init__.
Putting it all together it looks something like this:
class Application():
def __init__(self):
self.root = Tk()
self.root.title("File Synchronizer")
self.rowcount = 0
self.sourcefile = ""
self.targetfile = ""
self.row_frame = Frame(self.root)
self.button_frame = Frame(self.root)
self.button_frame.pack(side="bottom", fill="x")
self.row_frame.pack(side="top", fill="both", expand=True)
startSync = Button(self.button_frame, text="Start", command=self.synchronize)
plusButton = Button(self.button_frame, text = "+", command=self.create_new)
startSync.grid(row=1, column=2)
plusButton.grid(row=0, column=10)
self.create_new()
self.root.mainloop()
def create_new(self):
self.rowcount += 1
self.sourceDirectory = Entry(self.row_frame, width=10)
self.targetDirectory = Entry(self.row_frame, width=10)
self.sourceDirectory.insert(0, "Source")
self.targetDirectory.insert(1, "Target")
selectSource = Button(self.row_frame, text = "browse source", command=self.select_source)
selectTarget = Button(self.row_frame, text = "browse source", command=self.select_target)
self.sourceDirectory.grid(row=self.rowcount, column=0)
self.targetDirectory.grid(row=self.rowcount, column=5)
selectSource.grid(row=self.rowcount, column=1)
selectTarget.grid(row=self.rowcount, column=10)
This doesn't put the "plus" and "Start" button in exactly the same place, but that's just because it's somewhat irrelevant to the answer. You can use whatever options you want to place it in the button frame. Since the two frames are independent, you can adjust rows, columns, and weights in one without affecting the other. Or, you can use pack in one frame and grid in another.
The other problem with your code is that self.sourceDirectory and self.targetDirectory can only hold one value so it will always refer to the last widgets that were created.
Since you are creating multiple source and target widgets, you need to save them in a list.
For example, start by adding an empty list to your application in the __init__ method:
self.sources = []
self.targets = []
Then, when you add a new row, append it to the list:
source_entry = Entry(self.row_frame, width=10)
target_entry = Entry(self.row_frame, width=10)
self.sources.append(source_entry)
self.targets.append(target_entry)
You can then iterate over these two lists to process all source and target values.
You will also have to modify the callback for the browse functions to accept an index so that the button knows which entry to update.