Ah. i did not see Stam's post. Sorry.
Craig
How to constrain position of dragged graphic to path of a circle?
Moderators: FourthWorld, heatherlaine, Klaus, kevinmiller, robinmiller
Re: How to constrain position of dragged graphic to path of a circle?
In way of update and to put the original request in context, i used this to create a reusable radial dial (skRadial imaginatively enough) for my projects - this takes much less space than a slider and allows me to tighten the interface up a bit.
Because i need to edit these inside my projects, i've put the functionality to do so in a small plugin - the big dial in the lower half is the 'prototype' to edit and copy into scripts but will also reflect any selected skRadials from any other stacks chosen for editing.
I've shared this on Sample Stacks/LiveCodeShare : http://livecodeshare.runrev.com/stack/1005/SkRadial
Massive thanks to Roger Guay for his excellent stack RadialDialOmatic, which was a huge inspiration for this and to Elanor for her code (although i went about this a little bit differently in the end)
While Roger's stack covers many, many radial display types, skRadial focuses only on a simple radial dial/slider.
Other than tightening up the UI for my needs, so they can be made really quite small (no point in switching to radial sliders if they are larger than an actual slider!), skRadial differs in the following ways:
1. Resizeable - drag to resize and all elements of the group will resize appropriately. Currently i have not implemented any form of text size scaling but may do in the future.
2. API for managing appearance and setting the value in script are included in it's behaviour script:
- setTheValue pValue : sets the skRadial's value in script and updates its display for loading a value - or drag the knob
- setLineSize pSize - change the thickness of the lines used to display the skRadial
- setForeColor pColor - change the color of the lines
- setBackColor pColor - set the backgroundColor, passing empty makes it transparent.
3. skRadial comes as a plugin that can edit existing skRadials in any stack, or can modify a prototype skRadial inside the plugin and copy that for pasting into any stack.
To edit an existing stack, select an existing skRadial in any stack and click 'Edit skRadial'. If no skRadial is selected, then it will set the existing prototype inside the plugin for editing.
The plugin allows setting of:
- Text of the Title displayed in the middle of the skRadial
- Min and Max values of the radial display
- Line and background color, or clear the background so it’s transparent
- Line size (which itself uses an skRadial)
INSTALLATION - works best as a plugin (just drop into your plugins folder and restart LiveCode)
NOTE: Only tested on Mac - let me know if any issues with other platforms...
Download it from liveCodeShare: http://livecodeshare.runrev.com/stack/1005/SkRadial
Hopefully some may find this useful, feel free to feed back...
Stam
Because i need to edit these inside my projects, i've put the functionality to do so in a small plugin - the big dial in the lower half is the 'prototype' to edit and copy into scripts but will also reflect any selected skRadials from any other stacks chosen for editing.
I've shared this on Sample Stacks/LiveCodeShare : http://livecodeshare.runrev.com/stack/1005/SkRadial
Massive thanks to Roger Guay for his excellent stack RadialDialOmatic, which was a huge inspiration for this and to Elanor for her code (although i went about this a little bit differently in the end)
While Roger's stack covers many, many radial display types, skRadial focuses only on a simple radial dial/slider.
Other than tightening up the UI for my needs, so they can be made really quite small (no point in switching to radial sliders if they are larger than an actual slider!), skRadial differs in the following ways:
1. Resizeable - drag to resize and all elements of the group will resize appropriately. Currently i have not implemented any form of text size scaling but may do in the future.
2. API for managing appearance and setting the value in script are included in it's behaviour script:
- setTheValue pValue : sets the skRadial's value in script and updates its display for loading a value - or drag the knob
- setLineSize pSize - change the thickness of the lines used to display the skRadial
- setForeColor pColor - change the color of the lines
- setBackColor pColor - set the backgroundColor, passing empty makes it transparent.
3. skRadial comes as a plugin that can edit existing skRadials in any stack, or can modify a prototype skRadial inside the plugin and copy that for pasting into any stack.
To edit an existing stack, select an existing skRadial in any stack and click 'Edit skRadial'. If no skRadial is selected, then it will set the existing prototype inside the plugin for editing.
The plugin allows setting of:
- Text of the Title displayed in the middle of the skRadial
- Min and Max values of the radial display
- Line and background color, or clear the background so it’s transparent
- Line size (which itself uses an skRadial)
INSTALLATION - works best as a plugin (just drop into your plugins folder and restart LiveCode)
NOTE: Only tested on Mac - let me know if any issues with other platforms...
Download it from liveCodeShare: http://livecodeshare.runrev.com/stack/1005/SkRadial
Hopefully some may find this useful, feel free to feed back...
Stam
-
- VIP Livecode Opensource Backer
- Posts: 114
- Joined: Fri Apr 28, 2006 12:10 am
- Location: Seattle
Re: How to constrain position of dragged graphic to path of a circle?
Very nice, Stam. I'm glad my RadialDialOmatic stack was of some use to you. I used my radial dials exclusively in my simulation app Alien Civilization Detection, which I demonstrated on YouTube here: https://www.youtube.com/watch?v=7QhmJKudxGU
Roger
Roger
Re: How to constrain position of dragged graphic to path of a circle?
Fascinating video, thanks Roger!
and thanks for the radialDialOmatic stack
and thanks for the radialDialOmatic stack