Even more squares (and still a bit of Forth)

Some basic blending

We have ended the previous "more squares" tutorial with the squarish word that could render n grey-square on demand. To achieve that we passed these commands to the interpreter:

: random-position  1.3 rand 0.65 - transx 1. rand 0.5 - transy ;
: random-grey  1. rand dup dup rgb ;
: random-size  0.25 rand ; 
: random-rotation 360. rand rotz ;
: grey-square  m-push random-position random-rotation random-grey random-size square m-pop ;
: squarish  for grey-square next ;

Note: We assume that you initialized properly PF in a 2D drawing mode before typing that!

We are now going to slightly change random-grey, so far we have been generating random gray using a list of 3 RGB values passed to the rgb word. Replace this word with rgba and you are able to also control the alpha channel. Obviously you need now to pass a list of 4 values to this new word. Let's be orginal and generate it with rand:

: random-grey  1. rand dup dup 1. rand rgba ;

Because new words are compiled on top of words they depend on, this change will have no effect on the already compiled squarish until you re-define it with its depedencies:

: grey-square  m-push random-position random-rotation random-grey random-size square m-pop ;
: squarish  for grey-square next ;

Last but not least, you need to tell PF to turn on the blending on and set which blend type out of three you wish to work with (default value is 0 which means no blending). This setting needs to be set only once, PF will stick with it until you change your mind and set it to a different value.

2 blend

Note: When you are using blending mode 2, mixing 2 pixels results in an average mix weighted by the alpha value of pixel on top. Mode 1 is explained in the next tutorial.

100 squarish

Simple texturing

Instead of playing with plain colors it is possible to apply a texture on those squares.

First of all, we need to access to some extra words for image file manipulations. This is done by loading the PNG plugin.

load-png

We then load the png file we would like to use as a texture and store it as a constant that we call TEX (See Forth Introduction for a quick refresh on variables and constants in PF). A step by step description of the following operation is: first we specify the file we want to use, this string is passed to import-png that put the file on the stack, then >texture convert this element into a proper texture packet. Finally we ask PF to store the resulting packet as constant named TEX.

"pinkhead.png" import-png >texture constant TEX

Note: Please find attached at the bottom of this page the png file used in this example.

Next step is to tell PF we're using this TEX image to texture every graphics objects. For this we call TEX and pass it to the texture word. Then we define a new word similar to grey-square but without the random-grey system. We also need to define another for loop to draw a lot of this new graphic. We do not forget to turn off the blending system and restore the rgb value that was changed by the last random-grey.

TEX texture
: happy-square  m-push random-position random-rotation random-size square m-pop ;
: pinksquarish  for happy-square next ;
0 blend
1 1 1 rgb