Beefy Boxes and Bandwidth Generously Provided by pair Networks
XP is just a number

Simplest GUI with drag/drop/click on large image?

by halley (Prior)
on Sep 07, 2011 at 15:26 UTC ( #924608=perlquestion: print w/replies, xml ) Need Help??

halley has asked for the wisdom of the Perl Monks concerning the following question:

I have been tasked at making a couple of visual programs for simple data collection. I'm very proficient in Perl, but I don't often work with Perl in the GUI realm. I have played a bit with the widget toolkits wxWidgets and Tk in the distant past, but the nature of this task is less about the widgets and more about the mouse/image interaction.

The core idea of these programs is to show a large graphic, and to allow the user to place and move pushpins or other markers on that graphic. The back end would identify which logical area they touched, e.g., what voting pin they put on each state on a map.

While I understand a lot about scaling images, doing basic geometry for hit-testing, etc., what I don't know is the current state of toolkits or modules that exist to support much of this quickly. I just want to get this task out of my queue, not reinvent the world.

[ e d @ h a l l e y . c c ]

  • Comment on Simplest GUI with drag/drop/click on large image?

Replies are listed 'Best First'.
Re: Simplest GUI with drag/drop/click on large image?
by zentara (Archbishop) on Sep 07, 2011 at 16:28 UTC
    The Tk Canvas widget is perfect for this in terms of simplicity. See the examples below. The Tk::Zinc and Gtk2's Goo Canvas have much better transparency, and zooming abilities, but they are harder to setup and use. But in general, go with a canvas type widget, as it allows you to lay down an image, then drag and place things anywhere you want on top. It is all done with "tags" as shown in the examples below. Also see Goo Canvas and transparent images

    The big obstacle you will face is making your image resizable when the user resizes the window. You pretty much need to rebuild the resized image as the user finishes the resize. The Goo::Canvas has a nice zoom ability to get around this problem, see it's demo for how it works. Otherwise, just make a decent sized image and place it in a scrolled canvas, and let the scrollbars handle window resizes. :-)

    I'm not really a human, but I play one on earth.
    Old Perl Programmer Haiku ................... flash japh

      I could kiss ya. These demos are exactly what I needed.

      I almost cringed at the inclusion of the .xpm data, but then found it supported more mainstream formats too. Even alpha transparency in PNGs.

      [ e d @ h a l l e y . c c ]

Re: Simplest GUI with drag/drop/click on large image?
by suaveant (Parson) on Sep 07, 2011 at 15:42 UTC
    Sounds like you could do it with some javascript in a web page.

                    - Ant
                    - Some of my best work - (1 2 3)

      I did consider trying it out in Javascript, but I'm less familiar with how to get things done in that language. It could be a useful training exercise, if I had the luxury of time.

      The problem with "in a web page" is that you generally need a web server to collect data centrally via ajax or cgi, or Javascript on a local html file needs to be allowed to write local files. Add to that the browser variation from one user to the next, etc., etc.

      [ e d @ h a l l e y . c c ]

        The other side being, are a lot of people going to access it and would it be much simpler to allow them to access from a web page. If everyone can use one computer its fine but otherwise you'll have to get Perl and all libs around somehow (might work fine from a cd). There's going to be a learning curve any way. If you give up on the drag and drop you could probably do something that wouldn't be too complex in JS, probably simpler in other guis, too.

                        - Ant
                        - Some of my best work - (1 2 3)

Re: Simplest GUI with drag/drop/click on large image?
by zentara (Archbishop) on Sep 15, 2011 at 12:07 UTC

Log In?

What's my password?
Create A New User
Node Status?
node history
Node Type: perlquestion [id://924608]
Approved by chrestomanci
and the web crawler heard nothing...

How do I use this? | Other CB clients
Other Users?
Others drinking their drinks and smoking their pipes about the Monastery: (4)
As of 2020-09-22 02:07 GMT
Find Nodes?
    Voting Booth?
    If at first I donít succeed, I Ö

    Results (127 votes). Check out past polls.