Python Forum
Simple Button click on image file to create action? - Printable Version

+- Python Forum (https://python-forum.io)
+-- Forum: Python Coding (https://python-forum.io/forum-7.html)
+--- Forum: GUI (https://python-forum.io/forum-10.html)
+--- Thread: Simple Button click on image file to create action? (/thread-17062.html)



Simple Button click on image file to create action? - jpezz - Mar-26-2019

I am looking for a simple example of a python program that would display an image file and then be able to tell if the user clicked on the image with the left mouse button so that an action could be performed. I found one that seems pretty simple but it needs the "clutter" module which I can't find. Running python 2.7. Now I'm not a python programmer. I'm an old unix guy who is a volunteer at a museum writing an application on a Raspberry Pi. The main program I found that I hacked to do what I wanted works great. Now I need some more user interface on a touchscreen so all the user has is the equivalent of a left mouse button to make selections for the program. Here is the example I found of a graphical display with the ability to return info. I believe I can simplify this to just detect a button click then use Popen to call a program but if someone has some code ... or even knows where I can find a compatible clutter, I can probably plod my way through. I've tried to use graphical programs like feh but they do not do what I need.

import clutter

#create a clutter stage and set the display size
stage = clutter.Stage()
stage.set_size(400, 400)

#load the image for the buttons
img=clutter.cogl.texture_new_from_file('button.png',clutter.cogl.TEXTURE_NO_SLICING, clutter.cogl.PIXEL_FORMAT_ANY)

#example create button from class  start

class button(clutter.Texture):
    def __init__(self,id,row=1,padding=10):
        clutter.Texture.__init__(self)
        self.row=row
        self.id=id
        self.set_size (100,100)
        self.set_position (id*100,self.row*100)
        self.set_cogl_texture(img)
        self.set_reactive(True)
        #call click method on button clicked
        self.connect("button-press-event",self.clicked)
       
    def clicked(self,stage, event):
        print "class click="+str(self.id)+" row "+str(self.row)

#example class with collection of button class
class buttons:
    def __init__(self):
        self.buttonlist=[]
        self.count=0
        for i in range(0,10):
            self.buttonlist.append(button(self.count,row=2))
            #stage.add(self.buttonlist[self.count])
            self.count+=1
   
    #iter method so we can step through all buttons in a for loop
    def __iter__(self):
        for i in self.buttonlist:
            yield i
   
    #append a new button
    def append(self,btton):
        self.buttonlist.append(self.count)
        self.count+=1

#crate instance of buttons class
#append buttons class to stage
buttonlist2=buttons()
for b in buttonlist2:
    stage.add(b)

#example of creating button with function calls end


#show everything in the stage
stage.show_all()
stage.connect("destroy",clutter.main_quit)
#main clutter loop
clutter.main()



RE: Simple Button click on image file to create action? - metulburr - Mar-26-2019

(Mar-26-2019, 10:54 PM)jpezz Wrote: I am looking for a simple example of a python program that would display an image file and then be able to tell if the user clicked on the image with the left mouse button so that an action could be performed.
That is basically any GUI out there. This can be done with Tkinter, WxPython, Pygame, etc.

Why did you choose clutter over others? Also what exactly is clutter? Ive never heard of it.

(Mar-26-2019, 10:54 PM)jpezz Wrote: Now I need some more user interface on a touchscreen
The main python GUI library that can handle touchscreen inputs is Kivy.


RE: Simple Button click on image file to create action? - jpezz - Mar-27-2019

(Mar-26-2019, 10:54 PM)jpezz Wrote: I am looking for a simple example of a python program that would display an image file and then be able to tell if the user clicked on the image with the left mouse button so that an action could be performed.
(Mar-26-2019, 11:58 PM)metulburr Wrote: That is basically any GUI out there. This can be done with Tkinter, WxPython, Pygame, etc.
Let me address each of your comments:

Yes, they may be out there but I'm not able to take libraries and create a python program. In my only attempt, I successfully took a program used by someone else and made some changes. I understand programming concepts, having used in the past FORTRAN, C and shell scripts. In fact, if I could find a canned program that displays an image and, if the image was clicked on with a mouse, I could write a shell script that could do anything I want. At this point, with only one modified python program and little time, I have to seek out something I could copy and make a few changes to - that's as far as I am capable of doing these days. At 72, it's all I can do to keep up with things I learned in the past.
(Mar-26-2019, 11:58 PM)metulburr Wrote: Why did you choose clutter over others? Also what exactly is clutter? Ive never heard of it.
Neither did I before today. The program I posted had it in there. I posted the whole thing.
I found it at Program found at linux.com
I know just enough python to realize that when I see an "import", the module must exist. I tried both pip and "apt-get" to find it. I only learned about imports when I got the other piece of code I modified. When I got the error from the import command, I searched the web and found how to add them. Some worked with pip and others, I found, needed to be installed with apt-get. I could not find cutter.

I can learn things these days but I need to have something to start with.

(Mar-26-2019, 10:54 PM)jpezz Wrote: Now I need some more user interface on a touchscreen
(Mar-26-2019, 11:58 PM)metulburr Wrote: The main python GUI library that can handle touchscreen inputs is Kivy.
[quote='metulburr' pid='75301' dateline='1553644689']
Far too much for me. It would take me forever to figure out something so simple. With that python script I posted, almost everything is done for me. It appears all I have to do is put my own png file name in it, play with the positioning and size info and figure out what would be returned from the button click or just know it returned anything. I looked at the kivy examples and figured they were doing far more than what I wanted and it would be difficult to remove the unnecessary code with my limited knowledge of python.

I can figure out program flow but the format of the language intricacies overwhelm my. On that previous program, I plodded through it as I made changes and every time it gave me an error, I did a web search and tried a minor change until it worked.

But thanks for your response. I'm just a little too slow these days to be able to do anything with program snippets or general web sites. That program I posted is about my limit as to what I need - something that does something almost what I need, is short, and straightforward enough to modify.


RE: Simple Button click on image file to create action? - Larz60+ - Mar-27-2019

Here's one with built in tkinter GUI package (I wrote using python 3.7.2)
Get the image here: https://developers.google.com/speed/webp/gallery/4.sm.jpg
convert to 4.sm.png using gimp export as 4.sm.png (create images directory below script, and save there)

you will need to install pillow (which contains PIL), use:
pip install pillow
# Note requires python 3, written with 3.7.2
# download image here: https://developers.google.com/speed/webp/gallery/4.sm.jpg
# convert to png with gimp
# create images directory in script path
import tkinter as tk
import os
from pathlib import Path
import PIL

class ImageClick:
    def __init__(self, parent=None):
        # Make sure path is known (assures path set to this script directory)
        os.chdir(os.path.abspath(os.path.dirname(__file__)))
        # set image path
        imagepath = Path('./images')
        photo = imagepath / '4.sm.png'
        if not parent:
            self.parent = tk.Tk()
        else:
            self.parent=parent
        photo=tk.PhotoImage(file=photo)
        btn = tk.Button(self.parent)
        btn.config(image=photo, width="320", height="241", activebackground="black", bg="black", bd=0, command=self.clicked)
        btn.pack(fill=tk.BOTH)
        parent.mainloop()

    def clicked(self):
        print('You clicked me')

if __name__ == '__main__':
    root = tk.Tk()
    ImageClick(root)
    root.mainloop()
Looks like:
[attachment=587]

when clicked (5 times):
Output:
You clicked me You clicked me You clicked me You clicked me You clicked me



RE: Simple Button click on image file to create action? - jpezz - Mar-27-2019

(Mar-27-2019, 02:40 AM)Larz60+ Wrote: Here's one with built in tkinter GUI package (I wrote using python 3.7.2)

You're a lifesaver. I changed the path to point to my own png directory and it works on my Ubuntu system. I'll try it on my Raspberry Pi then edit it to replace the print statement to do a Popen to execute a command. You saved me a lot of time. Thanks!