LiveCode Forums.

Posted: **Wed Apr 29, 2015 9:28 pm**

Drag'n drop freefrom buttons / clickable controls - - - that would be a huge plus.

Currently, if you want to use the built-in button functionality (e.g., mouse-over and click state changes, tooltips etc), rather than building a button behavior from scratch, you have to use a transparent button, and then use your custom-made & -shaped graphics as icons. But then you 'inherit' the restrictive, rectangular bounding box of the button, so a round button, e.g., will behave as though it were rectangular one, and "hilite" bevor the mouse is actually within its visual boundary. And that makes for some ugly, non-pro visual feedback, unseemly of LiveCode.

Would be great if you could just use any PNG from UI design tools like Sketch, and LiveCode would respect the transparent portions of the PNG, and let you assign button functionality to it.

Please, please, please! Think of all those UI designers and prototypers out there who love Sketch: they'll be instantly converted to aspiring coders.

--- I do realize that you can probably set this up as a Widget in the new LCB api. So, I'll probably start reading up on SVG scripting... Still, freeform buttons would be fab, and I can't imagine that being hard to implement for one of those C++ cracks!

Posted: **Sun Mar 05, 2017 4:44 am**

Maurice,

Fully agree with what you're saying about buttons that can be shaped to fit the exact shape of a .svg icon (or a .png image shape, trimming off the transparent background)

My hope is to be able to assemble and group such buttons into a meaningful form – for example, to resemble the branch structure of a tree, or the various forks in a trail – in a way that would be sensitive to which particular button the user clicked on.

Have you found any way this might be done?

Best,

Mark Frazier
Openworld

PS A stretch goal – the location and rotation angle for each button to be set algorithmically as they appeared and linked together to create a familiar shape. This would allow for creation of adaptive landscapes based on lookups of which learning trails and "knowledge trees" the user had earlier explored, or shown interest in.

Posted: **Mon Mar 06, 2017 5:24 am**

Here's a link describing how Livecode stacks can appear in any custom shape –-

http://www.pressreader.com/australia/ma ... 2627558239

Perhaps such stacks can be used to overcome the problem of transparent rectangles that haunts freeform buttons, and also affects similar irregularly shaped .png images (both of which intercept mouseclicks on their transparent rectangles, rather than pass them through to objects below).

If stacks with irregular shapes (only) detect mouseclicks that are within their visible bounds, could they be scripted to act as freeform buttons of the sort Maurice has been seeking?

Best,

Mark

Posted: **Mon Mar 06, 2017 7:47 am**

Maurice, have you considered using graphic objects?

Posted: **Mon Mar 06, 2017 6:14 pm**

If using a png with transparency, then the mouse click will only action when within the solid sections of the image.

Add this to the image to create button effects.

so for an image named ImageBut1

Code: Select all

on mouseUp
   set the colorOverlay of the target to "false"
   set the dropShadow of the target to "false"
   --your action code here
end mouseUp

on mouseDown
   set the colorOverlay["color"] of the target to "255,0,0"
end mouseDown

on mouseMove
   if within(image "ImageBut1",the mouseLoc) & the mouseUp of the target is "true" then
      set the dropShadow of the target to "true"
      set the dropShadow["color"] of the target to "0,0,0"
   else
      set the colorOverlay of the target to "false"
      set the dropShadow of the target to "false"
      exit mouseMove
   end if 
end mouseMove

on mouseLeave
   set the colorOverlay of the target to "false"
   set the dropShadow of the target to "false"
end mouseLeave

See attachment stack

LiveCode Forums.

freeform buttons

freeform buttons

Re: freeform buttons

Re: freeform buttons

Re: freeform buttons

Re: freeform buttons