FireMonkey FMXTimerAnimation C++ animation code sample

By: Tim DelChiaro

Abstract: These examples show how to move an image on a form, using three different techniques

    FMXTimerAnimation (C++)

 

    Language:

    Versions:

 

Contents

    Description

The following examples show how to move an image on a form, using three different techniques. The first example uses a TTimer object. The last two projects use animations (TFloatAnimation and TPathAnimation, respectively). All three have the same result: when the user presses the button, the image moves in a diamond shape around the button.

To replicate this example, create a new FireMonkey HD application and place the following components on your form:

Use the Object Inspector to add a bitmap image to the Bitmap property of the TImage object, and to create event handlers for the OnCreate event of the TForm and the OnClickevent of the TButton.

Include the following code in the Form.OnCreate event handler, or set these properties at design time, in the Object Inspector.

  // C++
  Form1->Width = 500;
  Form1->Height = 500;
  Form1->Caption = "FMX Timer Animation";
  Image1->Width = 100;
  Image1->Height = 100;
  Image1->Position->X = 0;
  Image1->Position->Y = 200;
  Button1->Position->X = 200;
  Button1->Position->Y = 240;
  Button1->Text = "START";

The form should look like in the following image.

File:TTimer_1.JPG

After writing one of the following code pieces and running the project, the image moves on a diamond-shaped path around the button.

File:TTimer_2.JPG

    Using TTimer

Add the Timer1 and the Timer1Timer declarations before using the code below.

// C++
void __fastcall TForm2::Button1Click(TObject *Sender) {
	Timer1->Enabled = true;
}
// ---------------------------------------------------------------------------
 
void __fastcall TForm2::FormCreate(TObject *Sender) {
	Timer1 = new TTimer(this);
	Timer1->Interval = 100;
	Timer1->OnTimer = Timer1Timer;
	Timer1->Enabled = false;
}
// ---------------------------------------------------------------------------
 
void __fastcall TForm2::Timer1Timer(TObject *Sender) {
	if (Image1->Position->X < 200 && Image1->Position->Y <= 200) {
		Image1->Position->X += 10;
		Image1->Position->Y -= 10;
 
	}
	else if (Image1->Position->X >= 200 && Image1->Position->Y < 200) {
		Image1->Position->X += 10;
		Image1->Position->Y += 10;
	}
	else if (Image1->Position->X > 200 && Image1->Position->Y >= 200) {
		Image1->Position->X -= 10;
		Image1->Position->Y += 10;
	}
	else {
		Image1->Position->X -= 10;
		Image1->Position->Y -= 10;
	}
}
// ---------------------------------------------------------------------------

    Using TFloatAnimation

Use the Object Inspector to create three TFloatAnimation instances having the TImage as parent. Create a handler for the second animation's OnFinish event.

// C++
 
void __fastcall TForm2::Button1Click(TObject *Sender){
	if (!FloatAnimation1->Running){
		FloatAnimation1->Start();
		FloatAnimation2->Start();
	}
}
//---------------------------------------------------------------------------
 
void __fastcall TForm2::FloatAnimation2Finish(TObject *Sender){
	FloatAnimation3->Start();
}
//---------------------------------------------------------------------------
 
void __fastcall TForm2::FormCreate(TObject *Sender){
	FloatAnimation1->PropertyName = "Position.X";
	FloatAnimation1->StartFromCurrent = true;
	FloatAnimation1->StopValue = Image1->Position->X + 400;
	FloatAnimation1->Duration = 4;
	FloatAnimation1->Loop = true;
	FloatAnimation1->AutoReverse = true;
 
	FloatAnimation2->PropertyName = "Position.Y";
	FloatAnimation2->StartFromCurrent = true;
	FloatAnimation2->StopValue = Image1->Position->Y - 200;
	FloatAnimation2->Duration = 2;
 
	FloatAnimation3->PropertyName = "Position.Y";
	FloatAnimation3->StartFromCurrent = true;
	FloatAnimation3->StopValue = Image1->Position->Y + 200;
	FloatAnimation3->Duration = 4;
	FloatAnimation3->Loop = true;
	FloatAnimation3->AutoReverse = true;
}
//---------------------------------------------------------------------------

    Using TPathAnimation

Add FMX.Ani to the uses list.

// C++
 
void __fastcall TForm2::Button1Click(TObject *Sender) {
	PathAnimation1->Start();
}
// ---------------------------------------------------------------------------
 
void __fastcall TForm2::FormCreate(TObject *Sender) {
	PathAnimation1 = new TPathAnimation(this);
	PathAnimation1->Parent = Image1;
	PathAnimation1->Path->MoveTo(PointF(0, 0));
	PathAnimation1->Path->LineTo(PointF(200, -200));
	PathAnimation1->Path->LineTo(PointF(400, 0));
	PathAnimation1->Path->LineTo(PointF(200, 200));
	PathAnimation1->Path->ClosePath();
	PathAnimation1->Loop = true;
	PathAnimation1->Duration = 8;
}
// ---------------------------------------------------------------------------

    Uses

Server Response from: ETNASC03