go to Part:   previous   next   1   2   3   4   5   6   7   8   9   10   11 

Patterns Part 6

Doing it with objects

Remember… We are learning programming.  If the result is also visually interesting, then that's good.  But it's not the main thing.

In the previous parts we just painted.  Now we're going to use objects instead.

We would like to get something like this:

We're drawing rectangles, circles, lines and rounded rectangles with various colours and thicknesses.  But we want to control the colours.  Also, in our previous program, we had a button on the same window as the patterns and that was not so good.

So we make two windows now instead of one.  Do this:

  1. start Revolution
  2. select File—>New Mainstack
  3. use the property inspector to name the stack "Patterns"
  4. select File—>New Substack of Patterns (you can only do that if you did point 3 correctly!)
  5. use the property inspector to name the stack "Controls"
  6. Move the windows and resize them so they look like the image above (but there will of course be nothing in them yet!).

Properties

All objects have properties.  That is why you can write code like set the width of button "Go!" to 150.  The word width is the name of a property of the object button "Go!".

We can also make our own properties. For the Patterns stack we will create quite a few new properties, and we will give them names that we choose.

The controls

The stack Controls with the little window will control the patterns window

Drag a scrollbar from the tools palette to the controls window:

In the property inspector, call this scrollbar "SquareSize" and click the showvalue off:

The scrollbar changes to a blue dot on a rail: a slider.

Note: the property inspector shows three numbers:

  1. the startvalue is the value the scrollbar gives when the blue dot is at the left.  It is 1.
  2. the endvalue is the value the scrollbar gives when the blue dot is at the right.  It is 100.
  3. the thumbposition is the position of the blue dot.  It is 1.

These values are OK for now.

Drag a field from the tools palette into the Controls window and call it SquareSize too:

There is no problem in having two objects with the same name, as long as they are different types.

Now, look in the Application Browser:

You may have to click the littel triangles at the left to open up the stacks.  First, you see in the left panel that there is a main stack called Patterns and a substack called Controls.  They have different icons and the substack is slightly to the right.

If you select the card of the substack, as I have done, then the right part shows our two objects: the first is a scrollbar called SquareSize and the second a field called SquareSize too.

Right-click on the scrollbar in the application browser and select Edit Script:

In the script window, type:

 on ScrollbarDrag

put the thumbposition of me into field "SquareSize"

end ScrollbarDrag

 

Then, go into run mode and drag the blue dot from left to right.  Observe that the value is put into the field and changes as you drag.  Its lowest value is 1 and the highest value is 100.

Before going to the next part, let's adjust the size and position of the scrollbar and the field.  Go into programming mode and make it look something like this:

Good.  In the next part we're doing the colour picker.

(next part)