Skip to main content

Drag

Enables transferring data between and within applications per drag and drop.

modifier Drag
import { Frame, Rectangle, Overlay, Drag, DragInfo, Text, DropAction } from ui

export component Main {
    Rectangle(color: Color(0xFFFFFF00), radius: 4) with {
        Frame(height: 128)
        Overlay {
            Text("Hello world")
        }
        Drag(start: fun (event) {
            return DragInfo(
                data: ["text/plain": "Ut queant laxis"],
                supported_actions: [DropAction.copy, DropAction.move],
            )
        })
    }
}

export var main = Main()

Constructor​

(start:complete:minimum_distance:​children)​

start: (DragEvent) -> (DragInfo)​

Called when the drag starts, allowing you to set the data to be transferred in the returned DragInfo object.

See DragEvent, DragInfo.

complete: (DropAction) -> ()​

Called when the drag has finished. The DropAction parameter indicates the action that was performed by the target, e.g. DropAction.copy, DropAction.link or DropAction.move.

If the drag was cancelled, the action will be DropAction.cancel.

This callback is optional and can be omitted if you do not need to know the action performed by the target.

See DropAction.

minimum_distance: Float = 10​

The minimum distance the cursor has to move after the tap down before the gesture starts responding.

This is important if the builders want to combine both TapGesture and Drag on the same component.

children: Template() = template() ​

The children to display at the cursor during the drag operation.

If the template is not specified, the children will be based on the OS and the data transferred.

Layout Behavior​

None.

DragEvent​

class DragEvent

Properties​

position: Point​

The position of the pointer in the component's coordinate system when the drag started.

frame: Rect​

The component's bounding box during the event.

modifiers: KeyboardModifiers​

The keyboard modifiers active during the event, i.e. alt, control, or shift.

See KeyboardModifiers

DragInfo​

class DragInfo

Constructor​

(data:​supported_actions)​

data: [String: String]​

A map of MIME types to data strings that will be transferred during the drag operation.

It is possible to set multiple data entries for different types in order to support multiple formats, which the target can select from.

See this article for more information on MIME types.

supported_actions: [DropAction] = [DropAction.copy]​

A list of actions that the drag operation supports, e.g. DropAction.copy, DropAction.move, or DropAction.link.

The default value is [DropAction.copy], meaning that the target can copy the data.

See DropAction.