Tkinter Button not working when inserting an image - python-3.x

I am trying to add buttons with custom bg or image so like 3d color. But it gives a white unclickable button as result. I tried many other ways but failed, the code i gave below its a code which lets us to select the weight and height we want for the button that's why i choosed it otherwise if other things like the .zoom or making a function to make the image fit the button were working i would be using them, they are all not working and i have no idea, i know i must be doing something wrong but wellas you see i am new in python, i learned everything myself so really i am 0 x). I Resized the image aswell, it has the same weight height with the button:
root.geometry(geo)
image = ImageTk.PhotoImage(file='background.png')
label = Label(root, image=image)
label.pack(fill='both', expand=True)
label.image = image
myWidth = 150
myHeight = 82
img4=Image.open('button.png')
image4=img4.resize((myWidth,myHeight))
useImg4=ImageTk.PhotoImage(image4)
quitBtn = Button(label, image=useImg4,command=lambda: root.destroy())
quitBtn.pack()
do you know why its not working?
The result:

Related

Listbox resizing itself when new data is added

I am trying to add information to my Listbox and keeping it the size I state when I configure it. Here is my code for the Listbox with the scrollbar and an image of what it looks like.
Picture of the listbox.
taskList = Listbox(setBox, bg="#1B2834",fg="white")
taskList.configure(width=183,height=39)
taskList.pack(side=LEFT,fill=BOTH)
taskScroll = Scrollbar(setBox)
taskScroll.configure(bg="#1B2834",width=18)
taskScroll.pack(side = RIGHT, fill = BOTH)
taskList.config(yscrollcommand = taskScroll.set)
taskScroll.config(command = taskList.yview)
Now, when i click a button the command is to execute this following code:
def savetasks():
#make tasks
letters = string.ascii_uppercase
result_str = ''.join(random.choice(letters) for i in range(4))
num = str(random.randrange(0,9))
taskIDnum = num+result_str
taskIDLBL = Label(taskList, text=taskIDnum,bg="#1B2834", fg="White")
taskIDLBL.configure(padx=20,pady=10)
taskIDLBL.pack()
This code works fine as well, creating new labels with a random ID but it resizes the listbox to look like this...
Picture of the list box after clicking the button to execute the command.
Lastly, the scroll bar is not scrollable and when I create a lot of id's that end up going off my screen I cannot use the scroll bar to scroll down to see them, is there a way to not let the Listbox be resized and is it possible to set the Listbox with max and min-height?
If there is an easier way to do this without using a Listbox please let know, I just need to able to scroll down to see all the other id's and I didn't see any other way to use a scroll bar, that I NEEDED to use a Listbox

Had an issue with tkinter displaying my label on a top level window. A syntax error fixed it?

I am working on a color matching learning game. When you click the colored square, a pop up window will show you the name of the color, typed in the corresponding color, as well as pronounce the color.
During development, I ran into an issue where tkinter would not display my .gif image (which is the typed color) on the top level window, which opens after a color is selected.
I started adding additional widgets to the top level window to attempt to figure out the issue.
However, I accidentally left of the parentheses at the end of pack on the second label I added.
Sure enough, my image showed.
When I went back to add the missing parentheses, my image stopped showing??
def callback(event):
print ("clicked at", event.x, event.y)
if 30 < event.x < 120:
print("Red")
top = tk.Toplevel()
diagrams = tk.PhotoImage(file='Red.gif')
logolbl= tk.Label(top, text = "Red", image = diagrams).pack()
btn = tk.Button(top, text="Back").pack()
##### this is the label I am referring to #####
tk.Label(top, text = "why does this fix it?").pack
if 150 < event.x <240 :
print("Green")
if 270 < event.x < 370:
print("Blue")
This is a screen shot of it displaying the image, with the missing parentheses
This is a screen shot of the second label commented out, and my image not showing
Has anyone experienced this?
I mean technically I can work with this, however, I understand it is incorrect.
I'd like to have an understanding of what I am doing wrong, and what is happening "behind the scenes"

How to position text ontop of an Image Label

I have been tinkering with Tkinter the last couple of days to create a little game.
I have searched for how to display text ontop of an image label but there is a little downside, it won't display exactly at the spot i am looking(in this case the top left side of the label).
I tried anchor and compound together in the same label but it doesn't seem to do anything new
the text still remains in the middle.
The code looks like this:
'''Adjusting the information frame'''
self.image_info = PhotoImage(file=locate_images("_info_panel", ""))
self.label_text_info = "• Welcome to Agony,\nto play or read the rules please go to File"
self.label_info = Label(self.info, text=self.label_text_info, font=10, image=self.image_info, compound=CENTER, anchor=NW)
self.label_info.grid(row=0, column=0)
Edit:
If I try to add anything else other than compound=CENTER the text is displayed outside the boundingbox of the image on the specified side.
Moved from an edit to the question by the OP to an answer.
Use a Canvas:
'''Adjusting the information frame'''
self.image_info = PhotoImage(file=locate_images("_info_panel", ""))
self.label_text_info = "• Welcome to Agony,\nto start the game or read the rules please go to File"
self.canvas_info = Canvas(self.info, width=300, height=600)
self.canvas_info.create_image((0, 0), image=self.image_info, anchor=NW)
self.canvas_info.create_text((140, 25), text=self.label_text_info)
self.canvas_info.grid(row=0, column=0)
I was approaching it wrong from the start, I am fearly new to tkinter
and I had to use a canvas to display the items inside of.

python tkinter, Scrollbar missing knob(thumb)

【Summary】
By tkinter, python. I set scrollbar on Canvas ... Then that has been succeeded.
But missing knob in scrollbar.
【Background】
This is my application that developing now.
App's purpose is simple. Get some icons from target URL, Then put as tile in Window.
Application Window graphic
As you see, Can't put all icons in initial window size.
So I want to use scrollbar, Then scrolldown to show below icons.
Now succeeded put scrollbar at right side. But in that bar missing knob(thumb).
So this isn't working as scrollbar (TωT)
【Question】
How to make code to this vertical scrollbar working?
This is scrollbar build section in my src file.
Already exists scrollbar, It's almost fine... But maybe missing something.
# Make vertical scrollbar to see all stickers -----------------------
outCV = tk.Canvas(self.iconsFrame, width=GUIController.__windowWidth, height=GUIController.__windowHeight)
scrollbar = tk.Scrollbar(self.iconsFrame, orient=tk.VERTICAL)
scrollbar.config(command=outCV.yview)
scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
outCV.configure(yscrollcommand=scrollbar.set)
outCV.pack()
# --------------------------------------------------------------------
gridRow = 0
gridCol = 0
for i, tkimg in enumerate(self.tkimgs) :
# Put icons as tile.
Please give me your knowledge.
(FYI) https://github.com/we-yu/L_SL/blob/develop/Canvas_in_Canvas/src/GUICtrl.py Line:196
I found already how to solve it by myself.
There are 2 points in my case.
Should be set scrollregion
Scrollbar works for only Canvas. So, on my case. Need overlapped frames and canvases.
Solving way
self.outerCV = tk.Canvas(self.iconsFrame, width=GUIController.__windowWidth, height=GUIController.__windowHeight)
scrollbar = tk.Scrollbar(self.iconsFrame, orient=tk.VERTICAL)
scrollbar.pack(side=tk.RIGHT, fill=tk.Y)
scrollbar.config(command=self.outerCV.yview)
self.outerCV.config(scrollregion=(0, 0, 2000, 2000), yscrollcommand=scrollbar.set)
self.outerCV.pack(fill=tk.BOTH)
galleryFrame = tk.Frame(self.outerCV)
self.galleryTag = self.outerCV.create_window((0, 0), window=galleryFrame, anchor=tk.NW, width=self.outerCV.cget('width'))
Put Basement-frame at bottom of window. Then put Canvas on that. Scrollbar attaches on this Canvas.
But if put Canvas on this Canvas, Scrollbar works for scroll, But window won't be working.
So, put frame on scrollbar-canvas. Then Main graphic canvases on that frame.
[Canvas-1][Canvas-2][Canvas-3]...
[Frame for gallery]
[Canvas for Scrollbar]
[Basement frame]

Manipulate pixels in QGraphcisPixmapItem

I am using PyQt to build a small application for viewing images. When I click on the image I would like to alter the color of the pixels I have clicked:
Schematically my current code looks like this:
scene = QtGui.QGraphicsScene()
view = QtGui.QGraphicsView( scene )
image = QtGui.QImage( "image.png" )
pixmap = QtGui.QGraphicsPixmapItem( QtGui.QPixMap.fromImage( image ))
scene.addItem( pixmap )
...
...
def mousePressEvent(self , event):
print "Click on pixmap recorded - setting Pixel to red"
image.setPixel( event.pos() , RED.rgb())
The code 'works' in the sense that the mousePressEvent() method is called, and the image.setPixel() method does not give any errors, but nothing happens on the screen. Any tips on how to get the updated pixels to be displayed?
Joakim
To make changes appear, you need to reload image
self.image.setPixel(event.pos(), RED.rgb())
self.pixmap.setPixmap(QtGui.QPixmap.fromImage(self.image))
But I'm not sure that it's a good way. If you don't need to save modified image, I'd add some circles (e.g. addEllipse) instead modifying pixels.
Also, don't forget to map window coordinates to image.

Resources