Python Forum
[Tkinter] Clickable Rectangles Tkinter Canvas
Thread Rating:
  • 0 Vote(s) - 0 Average
  • 1
  • 2
  • 3
  • 4
  • 5
[Tkinter] Clickable Rectangles Tkinter Canvas
#1
Hello there.

I am attempting to bind the left mouse button to a grid of tkinter rectangles. I am trying to execute function clicked() when someone clock on a tkitner rectangle. I am looping their creation to create a grid. However, when I click the rectangle, the code is not executed.

Grid Creation Loop:
for x in range(0, wid, 60):
    for y in range(0, leng, 60):
        rectangle = drawCanv.create_rectangle(x, y, x+60, y+60, outline='black')  
        drawCanv.tag_bind("rectangle","<Button-1>",lambda: clicked)
Function (just testing. will replace with other code):
def clicked():
    print("You Clicked Me")
Reply
#2
Is this what you are looking for?

from tkinter import *

def clicked (event) :
	print (f'You clicked at {event.x} X {event.y}.')

root = Tk ()
drawCanv = Canvas (width = 541, height = 301, bd = 0)
drawCanv.bind ('<Button>', clicked)

for x in range (1, 540, 60) :
	for y in range (1, 300, 60) :
		rectangle = drawCanv.create_rectangle (x, y, x + 60, y + 60,\
			outline = 'black')  
drawCanv.pack ()

mainloop ()
Reply
#3
I need the rectangles to act as buttons. I need to bind the key press directly to the RECTANGLE, not the canvas.
Reply
#4
As far as I know, you will have to manually check if the mouse in inside of one of the boxes when it is clicked. See if this helps.

from tkinter import *

def clicked (event) :
	button_number = (int (event.y / 60) * 9) + (1 + int (event.x / 60))
	print (f'You clicked button number {button_number}.')

root = Tk ()
drawCanv = Canvas (width = 541, height = 301, bd = 0)
drawCanv.bind ('<Button-1>', clicked)

button_number = 1
for y in range (1, 300, 60) :
	for x in range (1, 540, 60) :
		rectangle = drawCanv.create_rectangle (x, y, x + 60, y + 60,\
			outline = 'black')  
		drawCanv.create_text (x + 25, y + 30, text = button_number)
		button_number += 1
drawCanv.pack ()

mainloop ()
Alternately you can use real button configured to look like your little squares.

from tkinter import *

button_list = ['dummy']
class button_box :
	def __init__ (self, button, ID_number) :
		self.ID_number = ID_number
		self.button = button

	def clicked (self, event) :
		print (f'You pressed button number {self.ID_number}')

root = Tk ()

button_number = 1
for y in range (5) :
	for x in range (9) :
		button = Button (width = 5, height = 3, text = button_number)
		button.config (relief = 'solid', borderwidth = 1)
		button.grid (row = y, column = x)
		button_list.append (button_box (button, button_number))
		button.bind ('<Button-1>', button_list[button_number].clicked)
		button_number += 1

mainloop ()
Reply
#5
Yes. I can very easily incorporate this with my existing code.
Thanks
Reply


Possibly Related Threads…
Thread Author Replies Views Last Post
  tkinter.TclError: can't invoke "canvas" command cybertooth 8 5,926 Feb-23-2023, 06:58 PM
Last Post: deanhystad
  [Tkinter] Glow text of clickable object on hover with transition andy 6 6,036 May-11-2021, 07:39 AM
Last Post: andy
  [Tkinter] Draw a grid of Tkinter Canvas Rectangles MrTim 5 7,867 May-09-2021, 01:48 PM
Last Post: joe_momma
Thumbs Up tkinter canvas; different page sizes on different platforms? philipbergwerf 4 4,089 Mar-27-2021, 05:04 AM
Last Post: deanhystad
  how to resize image in canvas tkinter samuelmv30 2 17,700 Feb-06-2021, 03:35 PM
Last Post: joe_momma
  how to rotate lines in tkinter canvas helpmewithpython 1 3,409 Oct-06-2020, 06:56 PM
Last Post: deanhystad
  Tkinter function to clear old canvas and start a fresh "operation" zazas321 5 9,392 Oct-01-2020, 04:16 AM
Last Post: zazas321
  question on tkinter canvas PhotoImage gr3yali3n 1 2,122 Sep-05-2020, 12:18 PM
Last Post: Larz60+
  Making text clickable with binding DT2000 10 5,105 Apr-02-2020, 10:11 PM
Last Post: DT2000
  TKinter coordinate system (canvas) Bhoot 1 2,930 Mar-23-2020, 04:30 PM
Last Post: Larz60+

Forum Jump:

User Panel Messages

Announcements
Announcement #1 8/1/2020
Announcement #2 8/2/2020
Announcement #3 8/6/2020