Page 1 of 1

Let's DRAW! - drawing demo by trajecto

PostPosted: Fri Aug 06, 2004 3:32 am
by trajecto
I'M BACK EVERYBODY!!!

LET'S DRAW!!!

I am very happy to see the addition of drawing functions to GE :D
Now let's do it :!:

In this demo we will draw a random starfield of random colors. You can make the starfield denser by continually selecting the Down Arrow. the fantastic Game-Editor setpen(), moveto() and putpixel() functions are demonstrated here along with the C rand() function and the C for loop control.

HERE WE GO!

1. Start a new project and add an actor of type CANVAS.

2. Go to Config and change Game resolution to 240 x 320 Pocket PC (I'm a Pocket PC guy - you dont need to do this).

3. Resize your Canvas Actor to the View Size.

4. Right-Click Events Add Key Down and press the Down Key then Add Action Script Editor.

5. Enter the following code:

int posX = 240;
int posY = 320;
int loopCount = 0;
int x = 0;
int y = 0;

for(loopCount=1; loopCount<1000; loopCount++)

{
x = rand(posX);
y = rand(posY);
setpen(rand(255),rand(255),rand(255),0,1);
moveto(x,y);
putpixel(x,y);
}


6. Add then Immediate Action then Close.

7. Go into Game Mode and press the Down Arrow to try it out.

Here is how your program will look:
http://www.trajectorylabs.com/Draw01.gif
http://www.trajectorylabs.com/Draw02.gif

Here we have only drawn points, NEXT we will cover drawing lines and shapes like this little program I wrote called Imagine: http://www.trajectorylabs.com/Imagine.html

How does that sound???

PostPosted: Fri Aug 06, 2004 5:15 am
by Just4Fun
Hey trajecto!
Nice to see you back. I've missed you and your excellent tutorials! :D

PostPosted: Fri Aug 06, 2004 11:00 am
by jazz_e_bob
Thanks for the tutorial. Very well done. :)

I wish canvas actors could be infinite actors. Then you could scroll the starfield!

The imagine application looks brilliant BTW I LOVE that kind of stuff.

PostPosted: Fri Aug 06, 2004 12:34 pm
by makslane
Hey :-) Welcome back....

Only a tip: if you use the putpixel, you don't need call moveto before.

PostPosted: Sat Aug 07, 2004 12:28 am
by trajecto
THANKS EVERYBODY!
And Thanks Makslane that is right, I removed the moveto() and it works great, it's probably faster without the extra function.

OK LET'S DRAW A CIRCLE!
This is an Old School circle. Old School meaning we will draw it by formula. We will still be using points and be plotting the sine and cosine values of 0 through 360 to draw a circle. The circle will look like this:
http://www.trajectorylabs.com/Draw03.gif

In my example the value 100 is the diameter. The 120,160 values are the x,y center of the circle.

You can edit these values all you want. For example, if you use 50 as a multiplier for one of the cos/sin values and leave the other at 100 you will get a 45 degree ellipse like this:
http://www.trajectorylabs.com/Draw04.gif


OK HERE WE GO!
Start another project like before but use this script instead:

//Old School Circle Routine
//100 = diameter
// 120,160 = distance from 0,0

int loopCount = 100;
int x = 0;
int y = 0;

for(loopCount=0; loopCount<360; loopCount++)

{
x = 100*sin(loopCount)+120;
y = 100*cos(loopCount)+160;
setpen(255,255,255,0,1);
putpixel(x,y);
}



WANT MORE FOLKS???

PostPosted: Sat Aug 07, 2004 4:53 pm
by Just4Fun
That is sooo Kool! Thank you, thank you trajecto.

YES, I would like to see more,More,MORE!

How about a gradient? I would like to see some code for that! :lol:

PostPosted: Sat Aug 07, 2004 10:17 pm
by trajecto
A GRADIENT?

Like this?: http://www.trajectorylabs.com/Gradient.gif

NO PROBLEM:

int loopCount = 0;
int x = 0;
int y = 0;
int rColor = 0;
int gColor = 0;
int bColor = 0;

for(loopCount=0; loopCount<320; loopCount++)

{
x = loopCount;

setpen(0,0,bColor,0,1);
moveto(loopCount,y);
putpixel(x,y);
lineto(loopCount,y+320);
bColor++;
}

PostPosted: Sun Aug 08, 2004 2:29 am
by Just4Fun
Impressive! :shock:

How would this be modified to get the gradient to go on a diagonal from corner to corner?

You did this so quickly trajecto. Is that because of your C programming knowledge? Wow!!!

I'm really having fun with this code. I've figured out how to change the colors and to draw from top to bottom. :D

I'm still trying to figure out the diagonal though. :oops:

Thank you.... Rachel

PostPosted: Mon Aug 09, 2004 12:15 am
by trajecto
My somewhat C knowledge, it's pretty basic at best!

For the diagonal gradient I would just draw lines in the diagonal and increment the color each time.

PostPosted: Mon Aug 09, 2004 5:11 am
by jazz_e_bob
Why not just make it in Photoshop? Save it as a jpeg.

Faster than programming it. No maths involved. The lazy way out perhaps... :wink:

For more circle maths fun don't forget R O T O R (written under GE) 8)

http://www.maybanana.com/pantzboi/game_editor/rotor.exe

Image

PostPosted: Mon Aug 09, 2004 5:05 pm
by Just4Fun
Well Jazz,
Call me curious! I love knowing how things are done in programming. Coding fascinates me even though I'm terrible at it. I keep trying to understand. I hope that if I look at the code long enough, and read enough books, I will suddenly see the pattern and turn into a world class programmer. :lol:

Also, doesn't hard coding make a program run faster? I've read that but I don't know if it really matters much anymore. The processing power of even the lowly handheld has surpassed most of the great "glory day" machines.

It is just that I've *always* wanted to see real code for gradients,wipes, and fades... Maybe because they are included in many windows authoring systems that I've used and they are so pretty! I've never been able to figure out how they are coded nor find simple examples.

Then here comes trajecto who shows me the code for a gradient in a heart beat! :oops:

PostPosted: Wed Aug 11, 2004 11:12 pm
by trajecto
Try this to plot a Cardioid.

A heart-shaped plane curve, the locus of a fixed point on a circle that rolls on the circumference of another circle with the same radius.

Image: http://www.trajectorylabs.com/Cardioid.gif


//Cardioid
int x,y;
int p = 10;//Radius of Cardioid
float i,y1,x1,y2;
x=240;
y=320;
setpen(0,0,255,0,1);

moveto(0,y/2);
lineto(x,y/2);
moveto(x/2,0);
lineto(x/2,y);

for(i=-100;i<=100;i+=.005)
{
x1=p*(cos(i)+i*sin(i));
y2=p*(sin(i)-i*cos(i));
putpixel(x/2+(x1*1),y/2-(y2*1));
}






PostPosted: Thu Aug 12, 2004 4:28 am
by Just4Fun
WOW! :shock: :shock: :shock:

I've gotta look at this right away... Thank you!

PostPosted: Sat Aug 14, 2004 3:18 am
by Just4Fun
trajecto,Jazz,et al:
I've been trying to generate a simple mandlebrot based on trajecto's examples, but I can't seem to get things to work. I think the problem is in how to putpixel and generate the colors. Anyone know the code for a mandelbrot in GE?? If so, TIA. If not, no problem. I'll keep at it anyway... :lol:

PostPosted: Fri Sep 17, 2004 9:16 am
by ingsan
:shock: WOW !
I've missed a lot for not being here since the past 2 months ! Crazy, Trajecto ! You're just incredibly crazy 8)
Thanks for the great work !