Followed deanhystad advice, and the problem is fixed now.
Thanks for all the help deanhystad.
The code working with images and scrollbars is:
import tkinter as tk
from winsound import * # for sound
from tkinter import * # for photo images
LABEL_BG = "#ccc" # Light gray.
ROWS, COLS = 10, 6 # Size of grid.
ROWS_DISP = 6 # Number of rows to display.
COLS_DISP = 6 # Number of columns to display.
# Sound Files
play1 = lambda: PlaySound('c:\images\siren.wav', SND_FILENAME)
play2 = lambda: PlaySound('c:\images\pling.wav', SND_FILENAME)
class MyApp(tk.Tk):
def __init__(self, title="Sample App", *args, **kwargs):
tk.Tk.__init__(self, *args, **kwargs)
self.title(title)
self.configure(background="Gray")
self.columnconfigure(0, weight=1)
self.rowconfigure(0, weight=1)
master_frame = tk.Frame(self, bg="Light Blue", bd=3, relief=tk.RIDGE)
master_frame.grid(sticky=tk.NSEW)
master_frame.columnconfigure(0, weight=1)
label1 = tk.Label(master_frame, text="Frame1 Contents", bg=LABEL_BG)
label1.grid(row=2, column=0, pady=5, sticky=tk.NW)
# Create a frame for the canvas and scrollbar(s).
frame1 = tk.Frame(master_frame)
frame1.grid(row=3, column=0, sticky=tk.NW)
# Add a canvas in that frame.
canvas = tk.Canvas(frame1, bg="Yellow")
canvas.grid(row=0, column=0)
# Create a vertical scrollbar linked to the canvas.
vsbar = tk.Scrollbar(frame1, orient=tk.VERTICAL, command=canvas.yview)
vsbar.grid(row=0, column=1, sticky=tk.NS)
canvas.configure(yscrollcommand=vsbar.set)
# Create a horizontal scrollbar linked to the canvas.
hsbar = tk.Scrollbar(frame1, orient=tk.HORIZONTAL, command=canvas.xview)
hsbar.grid(row=1, column=0, sticky=tk.EW)
canvas.configure(xscrollcommand=hsbar.set)
# Create a frame on the canvas to contain the buttons.
buttons_frame = tk.Frame(canvas, bg="Red", bd=2)
# Image files to be uploaded in window1
photo1 = PhotoImage(file="C:\images\plane.png")
photo2 = PhotoImage(file="C:\images\car.png")
photo3 = PhotoImage(file="c:\images\_apple.png")
# Add the buttons to the frame.
for i in range(1, ROWS+1):
for j in range(1, COLS+1):
button1 = tk.Button(buttons_frame, padx=1, pady=1, relief=tk.RIDGE, text="Plane", command=play1,
image=photo1)
button1.image = photo1
button1.grid(row=1, column=1, sticky='news')
button2 = tk.Button(buttons_frame, padx=2, pady=2, relief=tk.RIDGE, text="Car", command=play2,
image=photo2)
button2.image = photo2
button2.grid(row=2, column=1, sticky='news')
button3 = tk.Button(buttons_frame, padx=1, pady=1, relief=tk.RIDGE, text="Ball", command=play2,
image=photo3)
button3.image = photo3
button3.grid(row=1, column=2, sticky='news')
button4 = tk.Button(buttons_frame, padx=2, pady=2, relief=tk.RIDGE, text="Dog", command=play2,
image=photo1)
button4.image = photo1
button4.grid(row=2, column=2, sticky='news')
# Create canvas window to hold the buttons_frame.
canvas.create_window((0,0), window=buttons_frame, anchor=tk.NW)
buttons_frame.update_idletasks() # Needed to make bbox info available.
bbox = canvas.bbox(tk.ALL) # Get bounding box of canvas with Buttons.
#print('canvas.bbox(tk.ALL): {}'.format(bbox))
# Define the scrollable region as entire canvas with only the desired
# number of rows and columns displayed.
w, h = bbox[2]-bbox[1], bbox[3]-bbox[1]
dw, dh = int((w/COLS) * COLS_DISP), int((h/ROWS) * ROWS_DISP)
canvas.configure(scrollregion=bbox, width=dw, height=dh)
if __name__ == "__main__":
app = MyApp("Scrollable Canvas")
app.mainloop()