FMX.TSwipeTransitionEffect Animation

From RAD Studio Code Examples
Jump to: navigation, search

Description

This example shows how to use a TSwipeTransitionEffect transition and a TPathAnimation to simulate the turning of a book page.

1. To build and test this example, create a Multi-Device Application - Delphi, then add the next objects to the form:
2. Load a bitmap to the TImage and select the Target and Back bitmaps for the TSwipeTransitionEffect.
3. Add the following code to the OnClick event handlers of the image:

Code

procedure TForm1.Image1Click(Sender: TObject);
begin
  PathAnimation1.Enabled := False;
  SelectionPoint1.Position.Point := PointF(0,0);
  SelectionPoint1.Opacity := 0;
  PathAnimation1.Parent := SelectionPoint1;
  PathAnimation1.Path.Clear;
// begin Path for mouse pointer
  PathAnimation1.Path.MoveTo(PointF(0,0));
  PathAnimation1.Path.LineTo(PointF(Form1.Width/2,Form1.Height/2));
  PathAnimation1.Path.LineTo(PointF(Form1.Width*2,0));
// end
  PathAnimation1.Duration := 2;
  PathAnimation1.Start;
end;
4. Add the following code to the OnFinish and OnProcess event handlers of the TPathAnimation:

Code

procedure TForm1.PathAnimation1Finish(Sender: TObject);
var
  BitMap : TBitmap;
begin
  BitMap := TBitmap.Create(0,0);
  BitMap.Assign(SwipeTransitionEffect1.Target);
  SwipeTransitionEffect1.Target := Image1.Bitmap;
  Image1.Bitmap.Assign(BitMap);
  SwipeTransitionEffect1.MousePoint := PointF(0,0);
end;

procedure TForm1.PathAnimation1Process(Sender: TObject);
begin
SwipeTransitionEffect1.MousePoint:=SelectionPoint1.Position.Point;
end;

The image will swipe its bitmap on every mouse click. The next image shows the resulting animation:

TSwipe Effect Animation.gif

Uses

See Also

Personal tools
Assistance