![](/file/12652/www.mactech.com.tar/www.mactech.com/sites/all/themes/custom_front/images/you_are_here_red.gif)
![](/file/12652/www.mactech.com.tar/www.mactech.com/sites/default/files/beta-site.gif)
|
Volume Number: | 7 | |
Issue Number: | 6 | |
Column Tag: | HyperChat |
Splitting Your Sides
By Carl J. Manaster, Globe, AZ
Note: Source code files accompanying article are located on MacTech CD-ROM or source code disks.
[Carl is a mining engineer and programmer whose appreciation for environments such as HyperCard and THINK Pascal is enhanced by painful memories of dBase and FORTRAN.]
Objectives
It’s endemic among HyperCard fans to try to “fill in” the gaps left by Apple. Such supplements often take the form of XCMDs and XFCNs, offering everything from standard file calls to color windows. Occasionally, the purists among us like to write these extensions in HyperTalk itself, keeping it “all in the family,” as it were. (Also, having once used TCL or MacApp, it’s hard to imagine going back to writing Pascal without such crutches - and they don’t help with code resources!)
One thing missing from HyperCard is polygonal buttons - arbitrary shapes that behave like a button. The need for these has been apparent since the first release and its Clip Art stack, where the user clicks on certain parts of the pictures to travel to related cards. Since it’s all done with transparent (rectangular) buttons, there’s a great deal of “slop” space, where a click that ought to be on a hat (for instance) is really in the rectangle of the man.
There are doubtless XCMDs available that solve this problem, and I’ve seen at least one article describing a HyperTalk-based solution; here is another.
The Basic Solution
My solution is to place buttons over each side of the polygon, and split the message chain along each button’s diagonal. The message to do this is in the stack’s script:
--1 --message split --syntax: split(orientation,¬ ----------------topMessage,bottomMessage) --where: orientation is “/” or “\” --topMessage is message to be called if click ------------------was in top half of target --bottomMessage is message to be called if click --------------------was in bottom half of target on split put param(2) into topMessage put param(3) into bottomMessage put (the bottom of the target) - ¬ (the clickV) into vDiff if param(1) is “/” then put (the clickH) - (the left of¬ the target) into hDiff else put (the right of the target) - ¬ (the clickH) into hDiff put vDiff * (the width of the target)¬ > hDiff * (the height of the target)¬ into doTop if doTop then send topMessage to target else send bottomMessage to target end split
Each button’s mouseUp script calls split with the appropriate orientation and messages, thereby simulating two adjacent triangular buttons with differing mouseUp messages. With this script and the button tool, buttons can be placed around a polygon to simulate polygonal buttons.
Figure 1 - How a Split Button Simulates a Pair of Triangular Buttons
Getting Fancy
The obvious next step is to make it easier to generate polygonal buttons. The script in Listing #1, makePolyButton, does this. It tracks and records clicks until one is close to the first vertex, outlining the polygon as it is defined.
Figure 2 - Original Image with Polygonal Outline
Once all the vertices of the polygon have been entered, the maximum and minimum horizontal and vertical coördinates are determined, as well as the next-to-maximum and next-to-minimum.
A button is created whose sides are the next-to-extreme coördinates of the polygon’s vertices; most mouseUp messages reaching it will be within the polygon but not within any of the buttons around its edge.
Figure 3 - Polygon with Interior Button
Lastly, for each side of the polygon, a button is created whose mouseUp handler uses the split message to choose between the two messages that are passed to makePolyButton as parameters.
Figure 4 - Polygon with Border Buttons
Limitations and Flaws
Like most solutions, this one is imperfect; here are some of the problems associated with my implementation of polygonal buttons:
No AutoHilite or Outline
Because polygonal buttons have no single data structure where they are defined, autoHiliting is out of the question. Outlining is not impossible - a script could be written that included:
--2 choose line tool if the script of the target¬ contains “split” and the script of¬ the target contains “/” then drag
but it would not behave like normal outlining: painting would obscure it; moving the button would neither erase the old outline nor draw the new one; even if this were solved, erasing the old could mess up the paint layer with traces of white It is best to accept that outlining is not a feature of these polygonal buttons.
Sharp Corners Confuse
It is possible to generate polygons that are not modelled well with this technique. Indeed, the polygon used in Figures 2-4 shows some space that will report an “inside” message when certain “outside” areas are clicked (the upper right corner of the interior button, whose message is “inside”, extends beyond where border buttons cover it.) Similar mis-routing of the message chain can occur when the angles of a polygon are too sharp, and one border button overlaps another. This problem can be overcome by tweaking with the button tool, but even without such tweaking there is much less slop space than with plain, rectangular buttons.
Conclusions
The Spectrum of Solutions
There are countless ways in which a polygon may be made to act as a button in HyperCard; the methods differ in degree of resolution. The trade-off is between accuracy of representation on the one hand and programming demands, memory, and speed on the other. The roughest solution is to use rectangular buttons that more-or-less cover the polygon. At the fine end of the spectrum lie solutions such as pixel-sized buttons to fill the polygon, XCMDs, and complex scripts that rely on globals or fields to keep track of the polygon’s vertices.
Split buttons fall somewhere in the middle of the spectrum. The marginal costs over using rectangular buttons (a little programming, slightly more difficulty creating, moving, and deleting, and one more handler in the message chain) are relatively small, and the gains are significant. The accuracy is not as good as the pixel-perfect solutions (both HyperCard- and XCMD- based), but much less programming is required, and split buttons should be much faster than the HyperCard-based solutions.
This via media is realized by using each button to focus information, like relying on an airplane to get across the country and then getting to your house by car. The rough end of the spectrum relies on HyperCard to do all of the work (flying home on a 747); the fine end solutions do all of the work themselves (driving cross-country); split buttons rely on HyperCard for what it’s good at - the rough determination of which rectangular button contained the click - and concentrate on further distilling the information.
Because split buttons represent a compromise, they will not be appropriate for every stack calling for polygonal buttons. Because they represent a good compromise, however, they may find many applications.
LISTING #1 - makePolyButton script --message makePolyButton --syntax: makePolyButton(inMessage,outMessage) ----------inMessage is message to be called by ----------------clicks within the polyButton ----------outMessage is message to be called by ----------------clicks outside the polyButton on makePolyButton inMessage,outMessage put empty into pointList choose line tool set the cursor to cross wait until the mouseClick put the clickLoc into pointList repeat wait until the mouseClick put return & the clickLoc after pointList put the number of lines of pointList¬ into count drag from (line count-1 of pointList)¬ to (line count of pointList) if abs(item 1 of last line of pointList¬ - item 1 of first line of pointList)<2¬ and abs(item 2 of last line of pointList¬ - item 2 of first line of pointList)<2¬ then exit repeat end repeat put line 1 of pointList into¬ last line of pointList put the number of card buttons into cbCount set lockScreen to true doMenu revert choose button tool put item 1 of line 1 of pointList into maxV put item 1 of line 2 of pointList into maxPenV put item 1 of line 1 of pointList into minV put item 1 of line 2 of pointList into minPenV put item 2 of line 1 of pointList into maxH put item 2 of line 2 of pointList into maxPenH put item 2 of line 1 of pointList into minH put item 2 of line 2 of pointList into minPenH repeat with i=2 to count get item 1 of line i of pointList if it > maxPenV then--find the largest if it > maxV then --and second largest v put maxV into maxPenV put it into maxV else put it into maxPenV end if end if if it < minPenV then --find the smallest if it < minV then --and second smallest v put minV into minPenV put it into minV else put it into minPenV end if end if get item 2 of line i of pointList if it > maxPenH then--find the largest if it > maxH then --and second largest h put maxH into maxPenH put it into maxH else put it into maxPenH end if end if if it < minPenH then--find the smallest if it < minH then --and second smallest h put minH into minPenH put it into minH else put it into minPenH end if end if end repeat add 1 to cbCount--create the interior button doMenu “new button” set the style of card button cbCount¬ to transparent set the showName of card button cbCount¬ to false set the autoHilite of card button cbCount¬ to false set the rect of card button cbCount¬ to minPenV,minPenH,maxPenV,maxPenH put “on mouseUp” into theScript put return & inMessage after theScript put return & “end mouseUp” after theScript set the script of card button cbCount¬ to theScript repeat with i=1 to count-1 add 1 to cbCount--create the edge buttons set the cursor to busy put line i of pointList into firstPoint put line (i+1) of pointList into secondPoint doMenu “new button” set the name of card button cbCount¬ to “split” && i --determine the coördinates of the button: if (item 1 of firstPoint) < (item 1¬ of secondPoint) then put item 1 of firstPoint into top put item 1 of secondPoint into bottom else put item 1 of secondPoint into top put item 1 of firstPoint into bottom end if if (item 2 of firstPoint) > (item 2¬ of secondPoint) then put item 2 of firstPoint into right put item 2 of secondPoint into left else put item 2 of secondPoint into right put item 2 of firstPoint into left end if set the rect of card button cbCount¬ to top,left,bottom,right set the style of card button cbCount¬ to transparent set the showName of card button cbCount¬ to false set the autoHilite of card button cbCount¬ to false --determine the orientation of the --”split” of the button: put “on mouseUp” into theScript if (item 1 of firstPoint) > (item 1¬ of secondPoint) then if (item 2 of firstPoint) > (item 2¬ of secondPoint) then put return & “split “ & quote & “\”¬ & quote & “,” & inMessage & “,” &¬ outMessage after theScript else put return & “split “ & quote & “/”¬ & quote & “,” & inMessage & “,” &¬ outMessage after theScript end if else if (item 2 of firstPoint) > (item 2¬ of secondPoint) then put return & “split “ & quote & “/”¬ & quote & “,” & outMessage & “,” &¬ inMessage after theScript else put return & “split “ & quote & “\”¬ & quote & “,” & outMessage & “,” &¬ inMessage after theScript end if end if put return & “end mouseUp” after theScript set the script of card button cbCount¬ to theScript end repeat choose browse tool end makePolyButton
![](/file/12652/www.mactech.com.tar/www.mactech.com/sites/all/themes/custom_front/img/search_text.gif)
- SPREAD THE WORD:
- Slashdot
- Digg
- Del.icio.us
- Newsvine