FMX.DragAndDrop Sample

From RAD Studio Code Examples
Jump to: navigation, search

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


You can find the DragAndDrop sample project at:

  • Start | Programs | Embarcadero RAD Studio Alexandria | Samples and then navigate to:
    • Object Pascal\Multi-Device Samples\User Interface\DragAndDrop
    • CPP\Multi-Device Samples\User Interface\DragAndDrop
  • Subversion Repository:
    • You can find Delphi and C++ code samples in GitHub Repositories. Search by name into the samples repositories according to your RAD Studio version.


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:
    • Delphi: 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.


File in Delphi File in C++ Contains



The project itself.



The main form where the components are located.


DragAndDropCppPCH1.h, DragAndDropCpp.cpp

Used to define and implement the sample.


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


  • 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.


See Also