Main Menu


Sponsored Links

  


  
  
Web Cartoon Maker: a Fun Way to Learn C++ Contents Previous Next

Methods to Work with Image and Text Objects

" Set" Methods

You already know two methods to work with Image and Tex t objects. These are SetVisible and SetPos . You also know one method specific for text objects only. This is SetText . There are some more so called "set" methods available for text and image objects. All these methods set a control point for one or more object parameters at the current time in scene. If these parameters are numerical ( int or double ) they change smoothly between the control points, like a ball position in the above example. Methods are like functions. They also have parameters. They also can be called in your program. The only difference it that they are related to one particular object. The following "set" methods can be used in Web Cartoon Maker with all objects:

  • SetVisible – this method accepts true or false as a parameter to make an object visible or invisible in the current scene after current time.

  • SetPos – this method changes the object position on the screen. It accepts 2 double coordinates x and y and creates a control point at the current time in scene. Object's position between control points is changing smoothly in time. If you want to change coordinates immediately then you can create 2 control points at the same time by calling, for example, MyObject.SetPos ( 100, 100 ) and then MyObject.SetPos ( -100, -100 ) immediately after first SetPos instruction. Here is an example with 2 scenes in it. In the first scene the coordinates are changing smoothly. In the second scene the coordinates are changing immediately. This is also our first example with 2 scenes. As you can notice, all the objects in Scen1 disappear when second scene is started. I'll show you some more examples with multiple scenes later.

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetPos ( 100, 100 );


Sleep ( 1 );

Ball.SetPos ( -100, -100 );

}


void Scene2 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetPos ( 100, 100 );


Sleep ( 1 );

Ball.SetPos ( 100, 100 );

Ball.SetPos ( -100, -100 );


Sleep ( 1 ); // to see the results of moving the object

}

  • SetX and SetY. These 2 methods available for your convenience to set only individual coordinates of the objects. These methods are similar to SetPos but accept only one double parameter and update only individual coordinated

  • SetAngle – this method changes an object's angle on the screen. It accepts one double parameter – angle in degrees. It creates a control point like SetPos and every other "set" method with numeric ( int or double ) parameters. Here is an example of rotating a ball:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetAngle ( 0 );


Sleep ( 1 );

Ball.SetAngle ( 720 );

}

  • SetScale – this method changes an object's size. It accepts a double parameter specifying the scale factor. Scale factor 1.0 means that the object is displayed with its own default size. Scale factor less than 1.0 means that the object is smaller than default size and scale factor greater than 1.0 means that the object is bigger its than default size. This method creates a control point like every "set" method with numeric ( int or double ) parameters. Here is an example of how you can make a ball to grow:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetScale ( 0 );


Sleep ( 1 );

Ball.SetScale ( 2 );

}

  • SetXScale and SetYScale. These two methods are similar to SetScale , but scale an object only horizontally or vertically. They also accept one double parameter and scale an object only in one direction.

  • Set Transparency – this method can make an object semi-transparent. it accepts a double parameter specifying the transparency factor. Transparency factor 1.0 means that the object is fully transparent (invisible). Transparency factor less than 1.0 means that the object is partially transparent. Transparency factor 0.0 (default) means that the object is not transparent. This method creates a control point like every "set" method with numeric ( int or double ) parameters. The example below will show you how you can make a ball to appear out of "thin air". Please keep in mind that transparency for some SVG files does not work too well. If this is a problem you might want to replace a ball image with a PNG image from your hard drive. Note the PNG image must support transparency and the area outside the ball must be transparent.

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetTransparency ( 1 );


Sleep ( 1 );

Ball.SetTransparency ( 0 );

}

  • SetMirror – this method can flip your object horizontally. It accepts true or false as a parameter. Parameter true means that the object will be flipped (or mirrored) after current time in your cartoon scene. Parameter false means that it will not be flipped. Since this function does not accept a numeric parameter ( int or double ), it does not create a control point and the change happens immediately.

Lets use some of these methods to compile an example. The example below will show you a moving and rotating ball changing its transparency and size. We will also use a landscape example

void Scene1 ()

{

// setup background

Image Back ( "backgrounds/landscape.svg" );

Back.SetVisible ( true );


// add a ball image at (0,200)

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );


Ball.SetPos ( 400, 0 );

Ball.SetAngle ( 0 );

Ball.SetTransparency ( 1 );

Ball.SetScale ( 0 );


Sleep ( 2 );


Ball.SetPos ( 0, 100 );

Ball.SetAngle ( -360 );

Ball.SetTransparency ( 0 );

Ball.SetScale ( 3 );

}

Here is what you should see:

" Get" Methods

S ometimes you may want to know what the current coordinates and other parameters of an object in the scene are. While it may sounds easy – just the latest coordinates or parameters we set, it is not always true. For example we can get back in time using SetTime function like this:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );


Ball.SetPos ( 0, 0 ); // initial position


SetTime ( 2.0 );

Ball.SetPos ( 100, 100 ); // target position


SetTime ( 1.0 ); // we go back in time!

// what is the ball position now???

}

There are several "get" methods available for this purpose. They return the current object's coordinates and other parameters. These are:

  • Get Visible – returns true if an object is visible of false if it is not.

bool bVisible = Ball.GetVisible ();

  • GetX – returns an x coordinate of an object as a double

double dXPos = Ball.GetX ();

  • GetY – returns an y coordinate of an object as a double

double dYPos = Ball.GetY ();

  • GetAngle – returns an angle of an object as a double

double dAngle = Ball.GetAngle ();

  • GetXScale – returns a horizontal scale factor of an object as a double

double dXScale = Ball.GetXScale ();

  • GetYScale – returns a vertical scale factor of an object as a double

double dYScale = Ball.GetYScale ();

  • GetTransparency – returns a transparency scale factor of an object as a double

double dTransp = Ball.GetTransparency ();

  • GetMirror – returns true if an object is mirrored of false if it is not.

bool bMirror = Ball.GetMirror ();

In the example below you can see an example of ball moving and its coordinates displaying every second:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );


Ball.SetPos ( -400, 0 ); // initial position


SetTime ( 5.0 );

Ball.SetPos ( 400, 100 ); // target position


SetTime (0);

Text Coord ( "" ); // empty string, we'll change it later

Coord.SetVisible ( true );

Coord.SetText ( "(" + Ball.GetX () + "," + Ball.GetY () + ")" );


SetTime (1);

Coord.SetText ( "(" + Ball.GetX () + "," + Ball.GetY () + ")" );


SetTime (2);

Coord.SetText ( "(" + Ball.GetX () + "," + Ball.GetY () + ")" );


SetTime (3);

Coord.SetText ( "(" + Ball.GetX () + "," + Ball.GetY () + ")" );


SetTime (4);

Coord.SetText ( "(" + Ball.GetX () + "," + Ball.GetY () + ")" );


SetTime (5);

Coord.SetText ( "(" + Ball.GetX () + "," + Ball.GetY () + ")" );

}

You should be able to see the following cartoon when the above program is compiled:



" Change" Methods

As I said before "set " methods add some kind of control point in your animated cartoon. Sometimes it is very convenient, but sometimes it is not. For example what if we want to move a ball, then wait and then move it again. Let's look into following example:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetPos ( 0, 0 ); // initial position

Sleep ( 1 );

Ball.SetPos ( 100, 100 ); // position after first move second

Sleep ( 1 );

Ball.SetPos ( 100, 100 ); // position before second move

Sleep ( 1 );

Ball.SetPos ( 200, 200 ); // position after second move

}

As you can see from this example , we need to have two control points with coordinates (100,100) to have our ball to stay still between the two moves. It is not very convenient. But all the "set" methods with numerical parameters (int or double) also have similar "change" methods. These "change" methods have the same parameters as "set" methods plus on more parameter – duration. For example there is a ChangePos method which accepts three double parameters. One – for new x coordinate, one - fro new y coordinate and one – for "duration". These functions actually add two control points. One – with the current object's parameter at the current time in cartoon, and one – with the target parameter after "duration" number of seconds passed. These functions also change the time in your cartoon by "duration" number of seconds. In the above example three lines can be replaced with just one:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );

Ball.SetPos ( 0, 0 ); // you can skip this, (0,0) is the default


Ball.ChangePos ( 100, 100 , 1 ); // first move

Sleep ( 1 ); // wait

Ball.ChangePos ( 200, 200 , 1 ); // second move

}

As I already said there are "change" methods equivalents for every "set" method with numerical parameters. These are:

  • ChangePos

  • ChangeX

  • ChangeY

  • ChangeAngle

  • ChangeScale

  • ChangeXScale

  • ChangeYScale

  • ChangeTransparency

Here is an example changing the ball's parameters one by one:

void Scene1 ()

{

Image Ball ( "sport/beach_ball.svg" );

Ball.SetVisible ( true );


Ball.ChangePos ( 100, 100 , 1 );

Ball.ChangeAngle ( 360, 1 );

Ball.ChangeScale ( 2, 1 );

Ball.ChangeTransparency ( 2, 1 );

}

I recommend compiling the above example to see how it works. Using these "change" methods is probably the most convenient way of working with objects in Web Cartoon Maker.

Please also keep in mind that all the "set", "get" and "change" methods described in this chapter can work with either images or text. For example we can do exactly the same things with a text object:

void Scene1 ()

{

Text MyText ( "Hello" );

MyText.SetVisible ( true );


MyText.ChangePos ( 100, 100, 1 );

MyText.ChangeAngle ( 360, 1 );

MyText.ChangeScale ( 2, 1 );

MyText.ChangeTransparency ( 2, 1 );

}


Contents Previous Next
  
News

New Tales Animator Video by Alan Sturgess

Alan Sturgess shared an excellent video he made using Tales Animator! You can still download Tales Animator here. Unfortunately it is only available for Wi

...

Simple Online Character Designer

There is a prototype of simple online character designer available HERE. It is only a prototype, it does not contain many pieces yet but it can already generat

...

Book is updated

Now our book "Web Cartoon Maker: A Fun Way to Learn C++" is fully in synch with WCM 1.5! It is available for download and online reading HERE.

...

Web Cartoon Maker 1.5 is here!

Web Cartoon Maker 1.5 is finally here! You can download it HERE! Here is what was updated in version 1.5: Web Cartoon Maker Desktop Edition is now fully standal

...

read more news...


Poll