FMXInteractiveGestures (Delphi)

From RAD Studio Code Examples
Jump to: navigation, search

Description

This interactive gestures example is designed for a touch screen interface. The example works on both Windows 8 and Windows 7.

The Add Picture option makes an Open dialog appear, where you can select pictures (.jpg, .jpeg, .bmp, .png – more extensions can be added in the procedure TForm36.MenuItem1Click). The pictures are added as 200x200 images on the form (one on top of the other if more than one picture is selected).

You can manipulate the picture(s) by using interactive gestures:

  • Pan – moves picture around
  • Zoom – makes picture smaller/bigger
  • Rotate – rotates the picture
  • Press and Tap – deletes the picture

TGestureEventInfo is used by the interactive gesture procedures.

Code

Declare the following in the interface section: 

type
 TForm36 = class(TForm)
 MenuBar1: TMenuBar;
 MenuItem1: TMenuItem;
 OpenDialog1: TOpenDialog;
 Panel1: TPanel;
 procedure MenuItem1Click(Sender: TObject);
 procedure Panel1Gesture(Sender: TObject; const EventInfo: TGestureEventInfo;
 var Handled: Boolean);
 private
 FImages: TList<TImage>;
 FLastPosition: TPointF;
 FLastDistance: Integer;
 procedure AddPicture(files: TStrings);
 procedure handlePan(eventInfo: TGestureEventInfo);
 procedure handleZoom(eventInfo: TGestureEventInfo);
 procedure handleRotate(eventInfo: TGestureEventInfo);
 procedure handlePressAndTap(eventInfo: TGestureEventInfo);
 public
 end;
var
 Form36: TForm36;

Here is the event handler for the Add Picture button (TForm36.MenuItem1Click calls the OpenDialog which in turn calls the AddPicture procedure): 

procedure TForm36.MenuItem1Click(Sender: TObject);
begin
 OpenDialog1.Filter := 'Images|*.jpg;*.jpeg;*.bmp;*.png';
 if OpenDialog1.Execute then
 begin
 AddPicture(OpenDialog1.files);
 end;

Event Handlers

Panel1Gesture

For the TPanel, a TForm36.Panel1Gesture is the event handler for the Pan, Zoom, Rotate, and PressAndTap gestures: 

procedure TForm36.Panel1Gesture(Sender: TObject;
 const EventInfo: TGestureEventInfo; var Handled: Boolean);
begin
 if EventInfo.GestureID = igiPan then
 handlePan(EventInfo)
 else if EventInfo.GestureID = igiZoom then
 handleZoom(EventInfo)
 else if EventInfo.GestureID = igiRotate then
 handleRotate(EventInfo)
 else if EventInfo.GestureID = igiPressAndTap then
 hand

TForm36.Panel1Gesture in turn calls the following procedures:

  • Pan: TForm36.handlePan
  • Zoom: TForm36.handleZoom
  • Press and Tap: TForm36.handlePressAndTap
  • Rotate: TForm36.handleRotate

handlePan

Here is the event handler when the GestureID = igiPan: 

procedure TForm36.handlePan(EventInfo: TGestureEventInfo);
var
 LObj: IControl;
 image: TImage;
begin
 LObj := Self.ObjectAtPoint(ClientToScreen(EventInfo.Location));
 if LObj is TImage then
 begin
 if not(TInteractiveGestureFlag.gfBegin in EventInfo.Flags) then
 begin
 image := TImage(LObj.GetObject);
 //Set the X coordinate.
 image.Position.X := image.Position.X + (EventInfo.Location.X - FLastPosition.X);
 if image.Position.X < 0 then
 image.Position.X := 0;
 if image.Position.X > (Panel1.Width - image.Width) then
 image.Position.X := Panel1.Width - image.Width;
 //Set the Y coordinate.
 image.Position.Y := image.Position.Y + (EventInfo.Location.Y - FLastPosition.Y);
 if image.Position.Y < 0 then
 image.Position.Y := 0;
 if image.Position.Y > (Panel1.Height - image.Height) then
 image.Position.Y := Panel1.Height - image.Height;
 end;
 FLastPosition := EventInfo.Location;
 end;

handleRotate

Here is the event handler when GestureID = igiRotate: 

procedure TForm36.handleRotate(eventInfo: TGestureEventInfo);
var
 LObj: IControl;
 image: TImage;
begin
 LObj := Self.ObjectAtPoint(ClientToScreen(EventInfo.Location));
 if LObj is TImage then
 begin
 image := TImage(LObj.GetObject);
 image.RotationAngle := RadToDeg(-EventInfo.Angle);
 end;

handleZoom

Here is the event handler when GestureID = igiZoom: 

procedure TForm36.handleZoom(EventInfo: TGestureEventInfo);
var
 LObj: IControl;
 image: TImage;
begin
 LObj := Self.ObjectAtPoint(ClientToScreen(EventInfo.Location));
 if LObj is TImage then
 begin
 if not(TInteractiveGestureFlag.gfBegin in EventInfo.Flags) then
 begin
 image := TImage(LObj.GetObject);
 image.Width := image.Width + (EventInfo.Distance - FLastDIstance)/2;
 image.Height := image.Height + (EventInfo.Distance - FLastDIstance)/2;
 image.Position.X := image.Position.X - (EventInfo.Distance - FLastDIstance)/2;
 image.Position.Y := image.Position.Y - (EventInfo.Distance - FLastDIstance)/2;
 end;
 end;
 FLastDIstance := EventInfo.Distance;
end;

handlePressAndTap

Here is the event handler when GestureID = igiPressAndTap: 

 procedure TForm36.handlePressAndTap(EventInfo: TGestureEventInfo);
 var
 LObj: IControl;
 image: TImage;
 begin
 LObj := Self.ObjectAtPoint(ClientToScreen(EventInfo.Location));
 if LObj is TImage then
 begin
 image := TImage(LObj.GetObject);
 FImages.Remove(image);
 FreeAndNil(image);
 end;
 end;

Uses

See Also

Samples

Retrieved from "https://docwiki.embarcadero.com/CodeExamples/Tokyo/e/index.php?title=FMXInteractiveGestures_(Delphi)&oldid=30383"