Curves-Intro

Ok, we have an idea of how things move on the Zinc canvas. Now lets
look at the more generalized type of widgets: curves. There are two
basic types of curves: segmented(straight sides) and bezier(curvy).
So things like lines, triangles,polygons, parallelograms, etc. can all
determined by a list of points.
The list of points is typically (x0,y0,x1,y1,x2,y2,x3,y3....xn,yn), where you
go clockwise from the first point.

So here is a screenshot of the first script:
[curve0.jpg] Htmlified script curve0
curve0 text

So lets explain the little things going on in this script.
The first thing you notice is I threw in some background images.
It's easy to do, see lines 0011-0016.

I have shown my old triangle, from the previous tutorial, and correctly
made it as a curve. So remember, from now on the "triangle" widget is
reserved for use with OpenGL gradients.(Which I won't be using in this tutorial.
) Next are an assortment of lines, and some polygons with different "fills".
Notice the "semi-transparency" of the AlphaStipple7 linepattern and the "Tk" fill.

So what actions will this script show? I'm trying to show translation, rotations,
and resetting a widget to "original positions". So run the script and play with it.
The first thing to notice is line 0163, the treset function. This will move the
widget back to it's "FIRST POSITION AFTER CREATION OR A COORDS MOVE". It will not
always move back to it's position of origin, if a coords has been applied.
You can see this by hitting the up and down arrows, then 'r'. It will return to
it's creation position. But now, click with mouse button(3), which does a coord move
to the center of the zinc canvas (at line 0156). Now start clicking with
mousebutton(1), to rotate the line around the center. If you hit 'r' now, line4
will return to it's "centered position". To get it back to it's creation position,
hit 'q' (lines 0170-0173). Here I reset line4 to remove rotation, then I translate
it to (0,0), then translate to it's original position which I saved as variables
at line 0073.

The "bbox" function which you see scatterred around, returns 2 coordinates, which
form a "boundary box" around the current widgets screen position. So I'm printing
it on STDOUT so you can view it.
What I am doing in the resetpos_orig function, is first removing any rotation,
then get the current position with bbox, then subtracting those cordinates to move
to (0,0), and then adding back in my original stored coordinates.

---- See Thru Curves ----

Now lets look at arcs and curves. Both circles and ellipses are arcs with their
coodinates specified by a bounding rectangle. The bounding rectangle is specified by
2 points of the diagonal across the box.

The contour (used for see-thru) command can only
be used on curves with arcs. Notice that at line 0049, the hole is not created.
The other thing to notice is creating pieslices and coords in an arc. An example
is at lines 0072-0079.

Here is a screenshot of the curve1 script:
[curve1.jpg] Htmlified script curve1
curve1 text

So run the script and watch the ball orbit around the center of the zinc canvas.
The thing to notice is the layering. The ball goes under certain widgets, and
over others. This is set by the priority setting. The default priority is 1,
and if not set, the widget created latest in the script, will be on top of those
created earlier. Priority applies to groups, and since no groups were defined in this
script, all widgets are in group 1. The higher the priority number, the higher in the
layering.


---- Bezier Curves and Inchworms ----

Now lets look at bezier curves. The TkZinc Perl demo has an excellent demo of
bezier curves called "Curves with cubic bezier control points".
The curve2 script
uses the control points of bezier curves to simulate an inchworm crawling.

Here is a screenshot of the curve2 script:
[curve1.jpg] Htmlified script curve2
curve2 text

When you run the script, you will see how the crawling motion is made. When the
inchworm getoff the right edge of the $zinc canvas, (at line 0126), the inchworm
is recreated back off the left edge.

I've also show how to make a flower petal with Bezier curves. The trick is to wrap
the 2 endpoints back around onto themselves, then stretch it, by placing the control
points at the upper corners of the canvas. When I make clones of the first petal, I
give them different colors and different rotations. Notice at lines 0053-0066, I save
the item name that $zinc assigns to each petal. This is used later to refer to them,
at lines 0104-0107. Notice how Zinc identifies them by a number. You can watch this
by uncommenting line 0061. Later on, this data will be put into hashes and stored.
But it is easier to see what is happening, with this "brute force" programming style.
Half the petals rotate in reverse directions by making the angle negative at lines
0104-0107


More later.
----------------------------------------------------