UI design problem

classic Classic list List threaded Threaded
9 messages Options
Reply | Threaded
Open this post in threaded view
|

UI design problem

tbodine
Hi Livecoders.

I am hoping you'll have some ideas for solving a UI design/coding problem. My app lets users create simple presentation screens, one per card. The user can import a picture and add a headline (text field) to the card.  And since the user will sometimes want the text to be over the image, the text field is always the top layer.

The problem is the text field often blocks the user from grabbing and moving the image control below. (Both the field and image are meant to be movable.)

My many attempts to solve this have wandered into "rat's nest" territory, so I'm hoping some of you will know a simple way to pass a mousedown from a text field to an image control.

Thanks!
Tom B.

Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

Rick Harrison via use-livecode
the solution is simple ..... look up how to pass messages, it is easy and
made for in situations such as this.

pass mousedown

On Sat, Mar 4, 2017 at 3:52 PM, tbodine via use-livecode <
[hidden email]> wrote:

> Hi Livecoders.
>
> I am hoping you'll have some ideas for solving a UI design/coding problem.
> My app lets users create simple presentation screens, one per card. The
> user
> can import a picture and add a headline (text field) to the card.  And
> since
> the user will sometimes want the text to be over the image, the text field
> is always the top layer.
>
> The problem is the text field often blocks the user from grabbing and
> moving
> the image control below. (Both the field and image are meant to be
> movable.)
>
> My many attempts to solve this have wandered into "rat's nest" territory,
> so
> I'm hoping some of you will know a simple way to pass a mousedown from a
> text field to an image control.
>
> Thanks!
> Tom B.
>
>
>
>
>
> --
> View this message in context: http://runtime-revolution.
> 278305.n4.nabble.com/UI-design-problem-tp4712829.html
> Sent from the Revolution - User mailing list archive at Nabble.com.
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
>



--
*Tom Glod*

CEO @ *MakeShyft R.D.A* - www.makeshyft.com



Developer of *U.M.P* - www.IamUMP.com
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

tbodine
Dr. Hawkins via use-livecode wrote
pass mousedown
"Pass mousedown" doesn't work here. (Message does not travel down to the image control below the field.)
I used a send "mousedown" which does travel through, but what doesn't work then is the "grab image 'blah'" line in the mousedown handler attached to the image.  The same mousedown handler works fine to grab the image when I click directly on the image control.

Tom
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

Rick Harrison via use-livecode
The message would pass up the message path, to the group that owns both targets. That is where you would place the script to decide which object to move.

The following code will help you know which object was clicked:

Put word 1 of the target into tObjectType
If tObjectType = "field" then
-- do whatever you want with the field
Else if tObjectType = "image" then
-- do whatever with the image
End if


Sent from my iPhone

> On Mar 4, 2017, at 5:04 PM, tbodine via use-livecode <[hidden email]> wrote:
>
> Dr. Hawkins via use-livecode wrote
>> pass mousedown
>
> "Pass mousedown" doesn't work here. (Message does not travel down to the
> image control below the field.)
> I used a send "mousedown" which does travel through, but what doesn't work
> then is the "grab image 'blah'" line in the mousedown handler attached to
> the image.  The same mousedown handler works fine to grab the image when I
> click directly on the image control.
>
> Tom
>
>
>
> --
> View this message in context: http://runtime-revolution.278305.n4.nabble.com/UI-design-problem-tp4712829p4712832.html
> Sent from the Revolution - User mailing list archive at Nabble.com.
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode

_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

Rick Harrison via use-livecode
In reply to this post by tbodine
ahhh....

how do you know if the user wants to move the image or the text?

maybe use a modifier key to help you differentiate between what the user
wants to grab.

 if controlKey() is down then ...

or maybe give a hotkey to select either text or image..... and maybe a red
border around the selection while its selected so that the user knows what
is selected?

On Sat, Mar 4, 2017 at 5:04 PM, tbodine via use-livecode <
[hidden email]> wrote:

> Dr. Hawkins via use-livecode wrote
> > pass mousedown
>
> "Pass mousedown" doesn't work here. (Message does not travel down to the
> image control below the field.)
> I used a send "mousedown" which does travel through, but what doesn't work
> then is the "grab image 'blah'" line in the mousedown handler attached to
> the image.  The same mousedown handler works fine to grab the image when I
> click directly on the image control.
>
> Tom
>
>
>
> --
> View this message in context: http://runtime-revolution.
> 278305.n4.nabble.com/UI-design-problem-tp4712829p4712832.html
> Sent from the Revolution - User mailing list archive at Nabble.com.
>
> _______________________________________________
> use-livecode mailing list
> [hidden email]
> Please visit this url to subscribe, unsubscribe and manage your
> subscription preferences:
> http://lists.runrev.com/mailman/listinfo/use-livecode
>



--
*Tom Glod*

CEO @ *MakeShyft R.D.A* - www.makeshyft.com



Developer of *U.M.P* - www.IamUMP.com
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

Rick Harrison via use-livecode
In reply to this post by tbodine
On Sat, Mar 4, 2017 at 2:04 PM, tbodine via use-livecode <
[hidden email]> wrote:

> Dr. Hawkins via use-livecode wrote
> > pass mousedown
>
>
Err, no I didn't :)


But my though would be after pasting, to move the image control (slider,
group, whatever) to the top level, and to hide it while printing.


--
Dr. Richard E. Hawkins, Esq.
(702) 508-8462
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

Rick Harrison via use-livecode
In reply to this post by tbodine
Food for thought.

Presumably text in the field is editable by the user.
Therefore the field text cannot be locked and mousedowns will be used for text selection rather than grabbing of the entire field, correct?

Is the field user resizable? If so, do you present the user with dotted border and resize handles?
Could clicking on the field’s (or image’s) border trigger the grab rather than a click within its content area?

Jim Lambert


_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

tbodine
Thanks Jim.

Jim Lambert wrote
Presumably text in the field is editable by the user.
Therefore the field text cannot be locked and mousedowns will be used for text selection rather than grabbing of the entire field, correct?

Is the field user resizable?
A right-click toggles the text field between being editable-text or a movable block of text, but there are no resize handles on the text field. The image, however, has resize handles.

When text and image overlap, I use the mousechar to figure out the user's intent. (If the user clicked on  blank space, I treat that as an image click and pass the click through to the image control to make it movable. If the user clicked on headline text or the space between words, then the text block becomes movable.)

I narrowed my original issue down to this: "grab" doesn't work for a mousedown that is passed through to another object. So I bailed on "grab" and I'm using the mouseStillDown message to make either the text or image follow the mouse until released.

Spent way to much time on this!

Thanks to all for your suggestions.
Tom
Reply | Threaded
Open this post in threaded view
|

Re: UI design problem

Rick Harrison via use-livecode
In reply to this post by tbodine
> tbodine wrote:
>
> I'm using the mouseStillDown message to make either the text or image
> follow the mouse until released.


Glad you solved it.

Jim Lambert
_______________________________________________
use-livecode mailing list
[hidden email]
Please visit this url to subscribe, unsubscribe and manage your subscription preferences:
http://lists.runrev.com/mailman/listinfo/use-livecode