How to write text on top of rectangle instead of below? - python

I'm trying to create a rectangle with text on top, but the text shows below the rectangle.
How can I make the text go to the front layer?
My code so far:
from turtle import Turtle
class Rectangle(Turtle):
def __init__(self, x, y, width, height, color='white'):
super().__init__()
self.penup()
self.goto(x, y)
self.color(color)
self.shape('square')
self.shapesize(stretch_wid=(height / 20), stretch_len=(width / 20))
class Writer(Turtle):
def __init__(self, x, y):
super().__init__()
self.penup()
self.goto(x, y)
self.hideturtle()
def writetext(self, text, font="Arial", size=8, textType="normal", color="black", x=None, y=None):
if x is None:
x = self.xcor()
if y is None:
y = self.ycor()
self.goto(x, y)
self.color(color)
self.write(text, move=False, align="center", font=(font, size, textType))
class Button(Rectangle):
def __init__(self, position, width, height, text, onclick, color="gray"):
position = list(position)
super().__init__(position[0], position[1], width, height, color)
writer = Writer(position[0], position[1])
writer.writetext(text, color="white")
self.goto(position[0], position[1])
self.color(color)
self.onclick(onclick)
def start_game(_arg1=None, _arg2=None): # requires arguments since Python turtle module passes two in when calling it using onclick
print('game started')
Button((0, 0), 50, 20, 'click me to start the game', start_game)
I've been searching on google for over half an hour and couldn't find anything

I believe the design has some fundamental flaws that arise from subclassing Turtle.
The issue is that the Button drawing is happening outside of the constructor where the text is written. The drawing function is called automatically by the turtle library. Regardless of whether you're hooking into Turtle's classes or not, a constructor isn't typically the ideal place to draw things for this reason. I don't see a clean way to make a Button out of two separate turtles with subclassing.
A quick (but poor) fix is to override the internal method that turtle calls to update the object so your button can inject the text after the super() call draws the rectangle (you could also try to hook into drawing with _drawturtle):
class Button(Rectangle):
# ....
def _update(self):
super()._update()
Writer(*self.position()).writetext("foobar", color="white")
But since the leading _ indicates a private, internal method, this is circumventing the turtle API -- not a good idea.
A second try would be to disable the internal update loop with turtle.tracer(0) and take control of the update loop manually, but then that seems to defeat the purpose of subclassing Turtle, which is that you want things to "just work" automatically.
There's a deeper problem here, though, which is that once you get your text on top of the button as shown above in the workaround, the text blocks clicks from being detected by the rectangle underneath it.
After playing around with it quite a bit, the best alternatives I came up with were to create an image with the text pre-rendered in, or else use a global click listener and use the coordinates to determine if the click occurred on the button. The following code isn't reusable, but it's a proof of concept that you could abstract into a function or class by parameterizing everything:
import turtle
from turtle import Turtle
def handle_btn_click(x, y):
if (x > -btn_size and y > -btn_size / 2 and
x < btn_size and y < btn_size / 2):
print("game started")
turtle.tracer(1)
turtle.clearscreen()
turtle.bye()
turtle.tracer(0)
r = Turtle(shape="square")
btn_size = 80
r.shapesize(btn_size // 20, btn_size // 10)
r.color("black")
turtle.update()
t = Turtle()
t.color("white")
t.ht()
text = "click me to start the game"
t.write(text, move=False, align="center", font=("Arial", 8, "normal"))
turtle.Screen().onclick(handle_btn_click)
turtle.mainloop()
As a final note, if you're only adding a single button, I suggest keeping it simple and imperative. A class structure is often overkill for most turtle apps, and the large parameter lists are a pain to deal with for only a single instance.

The text shows below the button seems to happen when you call any methods of the Button class after you wrote the text.
Try the following code:
class Button(Rectangle):
def __init__(self, position, width, height, text, onclick, color="gray"):
#...
writer.writetext(text, color="red")
self.goto(position[0], position[1])
self.color(color)
self.onclick(onclick)
writer.writetext("abc", color="blue")
If you set turtle.tracer with a bit of delay, you can actually see the grey button being created first, then the text in red on the grey button, then the grey button is brought back up by the three self. methods, then the text "abc" in blue written on top of everything.
Still, as mentioned in ggorlen's answer, the text will block the button from being clicked. Please refer to ggorlen's answer for the alternative solution.

Related

Drawing Basic Animations in Python

Hello I am trying to create something like this box with controllable dots
I need to be able to move and interact with the dots. I have tried turtle and pyglet, but neither of them seem to do what I want them to do.
Turtle is letting me create dots but it doesnt seem to play well with oop. I'm a super noob at python oop so maybe I'm just doing it wrong but I can't seem to make an turtle object that I can actually use how I want. I would ideally be able to use my own methods built off of the turtle methods, and create and call on data unique to each turtle.
import turtle
import time
import random
wn = turtle.Screen()
wn.title("simulation")
wn.bgcolor("tan")
def rng(whatisrandom):
match whatisrandom:
case 'coords': return(random.randint(-400,400) , random.randint(-400,400))
case 'heading':return(random.randint(0,359))
case 'forward':return(random.randint(0,50))
class bug():
def __init__(self) -> None:
self = turtle.Turtle(shape = "circle",visible=False)
self.speed(0)
self.penup()
self.setpos(rng('coords'))
self.showturtle()
self.speed(1)
self.forward(20)
def move(self):
self.setheading(rng('heading'))
self.forward(rng('forward'))
bug1 = bug()
bug1.move()
wn.mainloop()
this is the error message.
self.setheading(rng('heading'))
^^^^^^^^^^^^
AttributeError: 'bug' object has no attribute 'heading'
I ultimately want to animate these little bugs with neural nets and train them to do different movements, and eventually interact with each other.
This appears to be a misunderstanding of how to subclass an object in Python. Let's rearrange things a bit:
from turtle import Screen, Turtle
from random import randint
class Bug(Turtle):
def __init__(self):
super().__init__(shape='circle', visible=False)
self.speed('fastest')
self.penup()
self.setposition(Bug.rng('coords'))
self.showturtle()
self.speed('slowest')
self.forward(20)
def move(self):
self.setheading(Bug.rng('heading'))
self.forward(Bug.rng('forward'))
#staticmethod
def rng(whatisrandom):
if whatisrandom == 'coords':
return randint(-400, 400), randint(-400, 400)
if whatisrandom == 'heading':
return randint(0, 359)
if whatisrandom == 'forward':
return randint(0, 50)
return None
screen = Screen()
screen.title("Simulation")
screen.bgcolor('tan')
bug1 = Bug()
bug1.move()
screen.mainloop()
I don't have an issue with your match statement, I'm just unfamiliar with it and haven't updated my Python sufficiently!

trying to make paint with python turtle module

I'm a beginner and i'm trying to make paint with python turtle but my code gives an error. I've tried everything I could think of but it still isn't working.
from turtle import *
from menuitem import MenuItem
def changePenColor(c):
"""Changes the system turtle's color to c."""
color(c)
def createMenu(callBack):
"""Displays 6 menu items to respond to the given callback function."""
x = - (window_width() / 2) + 30
y = 100
colors = ('red', 'green', 'blue', 'yellow', 'black', 'purple')
shape = "circle"
for color in colors:
MenuItem(x, y, shape, color, callBack)
y -= 30
def main():
"""Creates a menu for selecting colors."""
reset()
shape("turtle")
createMenu(color)
return "done!"
if __name__=='__main__':
msg = main()
print(msg)
mainloop()
And this code in a different file:
from turtle import Turtle
class MenuItem(Turtle):
"""Represents a menu item."""
def __init__(self, x, y, shape, color, callBack):
"""Sets the initial state of a menu item."""
Turtle.__init__(x, y, self, shape = shape, visible = False)
self.speed(0)
self.up()
self.goto(x, y)
self.color(color, color)
self._callBack=callBack
self.onclick(lambda x,y: self._callBack(color))
self.showturtle()
If anyone knows what I can do to fix this, I'd be happy to know.
Thanks 😊
Your code is somewhat confused. Specifically:
from turtle import *
Just don't. Particularly in a module. Import as little as you need to get the job done.
createMenu(color)
This should be createMenu(changePenColor) and changePenColor() should be defined in the main module, not the MenuItem class module.
Turtle.__init__(x, y, self, shape = shape, visible = False)
first three arguments to __init__ shouldn't be there and you should use super, all as #Evan notes.
reset()
self._callBack=callBack
These two statments are effectively no-ops and can be left out.
Below is my rework of your code that I believe does what you're attempting to do. For example purposes, instead of the main module, I just used a if __name__ == '__main__': for testing:
from turtle import Screen, Turtle
COLORS = ('red', 'green', 'blue', 'yellow', 'black', 'purple')
CURSOR_SIZE = 20
class MenuItem(Turtle):
''' Represents a menu item. '''
def __init__(self, x, y, shape, color, callBack):
''' Sets the initial state of a menu item '''
super().__init__(shape=shape, visible=False)
self.penup()
self.goto(x, y)
self.color(color)
self.onclick(lambda x, y: callBack(color))
self.showturtle()
def createMenu(callBack):
''' Displays 6 menu items to respond to the given callback function. '''
screen = Screen()
x = CURSOR_SIZE * 1.5 - screen.window_width() / 2
y = 100
for color in COLORS:
MenuItem(x, y, 'circle', color, callBack)
y -= CURSOR_SIZE * 1.5
if __name__ == '__main__':
from turtle import getscreen, getturtle
def changePenColor(c):
''' Changes the turtle's color to c. '''
turtle.color(c)
screen = getscreen() # singular screen instance
turtle = getturtle() # default turtle
turtle.shape('turtle')
# Create a menu for selecting colors.
createMenu(changePenColor)
screen.mainloop()
In your first line of the __init__ function on your MenuItem class, use this
super().__init__(shape=shape, visible=False)
instead of
Turtle.__init__(x, y, self, shape = shape, visible = False)
You don't need to pass in x, y, or self, because you are already setting the position by saying self.goto(x, y). Also, use super() instead of Turtle, because you need to initialize the superclass, not just another instance of Turtle. By saying Turtle.__init__(...) you are creating an instance of that object and doing nothing with it. By saying super().__init__(...), you are initializing the superclass of your object, which is what you always need to do when you are subclassing an object (in this case Turtle).
Note: your __init__ function needs to be indented, but I'll assume that was a pasting error.

Feasible with Tkinter 'scrollbar'

I have a base program I was playing with this morning I wrote up a few years back. It only had horizontal scrolling and zooming. I managed to get it so I could scroll(one axis at a time) and zoom on both axis. I'm wanting to create a program that will allow me to move around the screen in both x and y directions at the same time(like Google Earth where you can hold down the down and left key at the same time to move to lower left). It would be nice to do it without having the scroll bars on the screen as well. I don't want to have to go back and forth and click on the appropriate scroll bar to be able to scroll in that axis. Currently to change which axis I'm scrolling in I have to click on the opposite axis.
I tried the program at [http://www.tkdocs.com/tutorial/canvas.html#scrolling][1] but I already have the capability of doing that. It doesn't allow me to scroll both directions simultaneously and if I want to change which direction I'm scrolling without having to click on the opposite axis.
Is there a way of doing what I'm trying to do with Tkinter or should I look elsewhere and if so, where?
Thanks.
edit:
With the code Bryan posted below I added in the following code to try to get it two work with the keyboard versus only the mouse. I would like the be able to use the cursor keys to move the image around versus the mouse. I have a nastily touch sensitive mouse on this computer, that has a mind of its own and as a result I would like to stick with the keyboard. Plus, given the naturedness of this darn project I have to leave all option open or else I know I will regret it sometime before this entire project gets finished.
self.canvas.bind("<Left>", self.on_press)
self.canvas.bind("<Right>", self.on_press)
I also tried directing it to self.on_motion and neither one accepted the cursor keys.
Yes, this is possible. There's nothing preventing you from directly calling the canvas xview and yview methods with any arguments you want.
You first need to create bindings that tracks the clicking and the motion of the mouse. In the bound function you can compute the direction that the mouse moved, then use the results to call both the xview and yview methods of the widget at the same time.
Here's an example:
import tkinter as tk
import random
class Example(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self, parent)
self.canvas = tk.Canvas(self, background="bisque", width=400, height=400)
self.canvas.pack(fill="both", expand=True)
self.canvas.configure(scrollregion=(-1000, -1000, 1000, 1000))
self.canvas.bind("<ButtonPress-1>", self.on_press)
self.canvas.bind("<B1-Motion>", self.on_motion)
# the following two values cause the canvas to scroll
# one pixel at a time
self.canvas.configure(xscrollincrement=1, yscrollincrement=1)
# finally, draw something on the canvas so we can watch it move
for i in range(1000):
x = random.randint(-1000, 1000)
y = random.randint(-1000, 1000)
color = random.choice(("red", "orange", "green", "blue", "violet"))
self.canvas.create_oval(x, y, x+20, y+20, fill=color)
def on_press(self, event):
self.last_x = event.x
self.last_y = event.y
def on_motion(self, event):
delta_x = event.x - self.last_x
delta_y = event.y - self.last_y
self.last_x = event.x
self.last_y = event.y
self.canvas.xview_scroll(-delta_x, "units")
self.canvas.yview_scroll(-delta_y, "units")
if __name__ == "__main__":
root = tk.Tk()
Example(root).pack(fill="both", expand=True)
root.mainloop()

Python; tkinter; Canvas objects and events

I have a class with some mouse events I made :
class graphic_object(object):
def mouse_click(self,event):
#do something
def mouse_move(self,event):
#do something
def mouse_unpressed(self,event):
#do something
Instances of this class aren't literally graphic objects on the screen, but they have their graphic representation, which is circle-shaped, and as I said, they listen to the mouse events. Both, graphic representation and event handling are managed by tkinter.Canvas object, which is their visual container.
When I make one istance of this class:
graphic1 = graphic_object(a,b,c,d) # init method takes coordinates of the circle as arguments; a,b,c,d - numbers
Everything works as it should, object responds on the mouse events in desired way. But when I make two instances:
graphic1 = graphic_object(a,b,c,d)
graphic2 = graphic_object(e,f,g,h)
only the last created object responds on the mouse events.
This is the condition where I check if the mouse is over the circle:
if d < self.radius:
where d is distance between mouse position, and the center of the circle, and radius is radius of the circle.
In the debugger I see that self.center is always the center of the last created object, so condition is always on
the second circle. So, how can I make that both objects respond to the mouse events?
Events handling:
C = Canvas()
C.bind("<Button-1>" ,self.mouse_click)
C.bind("<B1-Motion>",self.mouse_move)
C.bind("<ButtonRelease-1>",self.mouse_unpressed)
It appears that in your mouse binding you are relying on a pre-computed global variable (d). This is not how you should implement such bindings. The first thing you should do in the binding is get the current mouse coordinates, and then calculate d.
Your other choice is to put the binding on each canvas object using the tag_bind method of the canvas. See this question for an example: How do I attach event bindings to items on a canvas using Tkinter?
You wrote in a comment to this answer that you are only sometimes getting mouse clicks. There is not enough detail in your code to know what you're doing, but I can assure you that the canvas doesn't normally fail in such a manner.
I can't debug your code since you are only showing bits and pieces, but here's a working example that tries to illustrate the use of tag_bind. I took some liberties with your code. For example, I added a name parameter so I can print out which circle you clicked on. When I test this, every click seems to register on the proper circle.
import Tkinter as tk
class Example(tk.Frame):
def __init__(self, parent):
tk.Frame.__init__(self, parent)
self.canvas = tk.Canvas(self, width=400, height=400,
background="bisque")
self.canvas.pack(fill="both", expand=True)
graphic1 = GraphicObject(10,10,100,100, name="graphic1")
graphic2 = GraphicObject(110,110,200,200, name="graphic2")
graphic1.draw(self.canvas)
graphic2.draw(self.canvas)
class GraphicObject(object):
def __init__(self, x0,y0,x1,y1, name=None):
self.coords = (x0,y0,x1,y1)
self.name = name
def draw(self, canvas, outline="black", fill="white"):
item = canvas.create_oval(self.coords, outline=outline, fill=fill)
canvas.tag_bind(item, "<1>", self.mouse_click)
def mouse_click(self, event):
print "I got a mouse click (%s)" % self.name
if __name__ == "__main__":
root = tk.Tk()
Example(root).pack(fill="both", expand=True)
root.mainloop()

Typing Text into the Tkinter Canvas Widget

I need to allow the users to type text into the Canvas Widget, making the canvas update as the user types new text.
Here's what I have tried so far, but am not getting it to work.
First I have a mouseDown method which is bound to Button-1 event
widget.bind(self.canvas, "<Button-1>", self.mouseDown)
This mouseDown method returns the startx, starty positions to my method drawText
def drawText(self, x, y, fg):
self.currentObject = self.canvas.create_text(x,y,fill=fg,text=self.typedtext)
I also have a global binding on the canvas widget to capture any key press like this:
Widget.bind(self.canvas, "<Any KeyPress>", self.currentTypedText)
def currentTypedText(self, event):
self.typedtext = str(event.keysym)
self.drawText(self, self.startx, self.starty,self.foreground)
However there's no error and nothing gets printed on the canvas.
What you want to do is pretty complex and will require quite a bit of code to get working nicely. You will need to handle click events, keypress events, special keypress events (such as "Shift" and "Ctrl"), "Backspace" and delete events, and a lot more.
Nevertheless, first is first and that is getting text to appear in the canvas as a user types. Now, since I don't have your full script, I can't really work with your stuff as is. However, I went and made my own little app that does exactly what you want. Hopefully, it will shine some light on where to go:
from Tkinter import *
class App(Tk):
def __init__(self):
Tk.__init__(self)
# self.x and self.y are the current mouse position
# They are set to None here because nobody has clicked anywhere yet.
self.x = None
self.y = None
self.makeCanvas()
self.bind("<Any KeyPress>", lambda event: self.drawText(event.keysym))
def makeCanvas(self):
self.canvas = Canvas(self)
self.canvas.pack()
self.canvas.bind("<Button-1>", self.mouseDown)
def mouseDown(self, event):
# Set self.x and self.y to the current mouse position
self.x = event.x
self.y = event.y
def drawText(self, newkey):
# The if statement makes sure we have clicked somewhere.
if None not in {self.x, self.y}:
self.canvas.create_text(self.x, self.y, text=newkey)
# I set x to increase by 5 each time (it looked the nicest).
# 4 smashed the letters and 6 left gaps.
self.x += 5
App().mainloop()
Once you click somewhere in the canvas and start typing, you will see text appear. Note however that I have not enabled this to handle deletion of text (that is a little tricky and beyond the scope of your question).

Categories