FMX.DragAndDrop Sample

From Appmethod Code Examples
Jump to: navigation, search

This sample demonstrates how to implement object dragging features in the Firemonkey application.

Location

You can find the DragAndDrop sample project at:

Description

The DragAndDrop sample demonstrates how to implement object dragging features in your Firemonkey application. Moreover, the sample shows you how to set the image icon that will be displayed while dragging the object. The sample uses IFMXDragDropService to provide support for drag-and-drop operations. Concretely, the BeginDragDrop method is used to implement functionality to start the drag-and-drop process of a given object on the surface of a given form.

Note: This sample is only supported by Windows and OSX platforms.

How to Use the Sample

  1. Navigate to one of the locations given above and open:
    • Object Pascal: DragAndDrop.dproj.
    • C++: DragAndDrop.cbproj.
  2. Select the target platform, iOS and Android supported.
  3. Press F9 or choose Run > Run.
  4. Interact with the sample:
    • Type text in the box under the Input text to transfer label.
    • See the written text in the rectangle below.
    • Choose whether you want to drag the text as text or as image. Then, select the corresponding button.
      Note: if you select to drag the text as image, the sample makes a screenshot of the rectangle with the text.
    • Start the drag-and-drop process:
      1. Click on the rectangle with the text, maintain the mouse pressed and move the mouse to drag the object.
      2. Drop the object.

Files

File in Object Pascal File in C++ Contains

DragAndDrop.dproj

DragAndDropCpp.cbproj

The project itself.

fmMain.fmx

fmMain.fmx

The main form where the components are located.

fmMain.pas

DragAndDropCppPCH1.h, DragAndDropCpp.cpp

Used to define and implement the sample.

Classes

TForm3 is the main form that represents the main window of the sample. It contains the following components:

Implementation

  • The sample uses TPanel to hold multiple controls for organizing purposes.
  • The sample uses TEdit to provide the user an edit box to write text.
  • The sample uses TRectangle to show the written text.
  • The sample uses TRadioButton to present a set of mutually exclusive choices (choose between drag the object as text or as image).

When you run the application, the sample shows a TEdit box, two TRadio buttons labeled as Drag as text and Drag as image and a TRectangle object. When you type text into the TEdit box, an OnChangeTracking event automatically displays the text in the TRectangle. Moreover, you can choose whether you want to drag the text as text or as image by selecting the corresponding TRadioButton. Then, you can start the drag-and-drop process. When you start a drag-and-drop process, the sample uses the BeginDragDrop method to implement the drag-and-drop process of the TRectangle object on the surface of your FireMonkey form. Finally, the sample uses the ABitmap parameter of the BeginDragDrop method to set the image icon that is displayed while dragging the object.

Note: if you select the Drag as image button, the sample makes a screenshot of the TRectangle and uses it as the data to drag and drop.

Uses

See Also

Samples