Layout
Rect Dragger
A flexible drag to move component for UI elements
Overview
Rect Dragger lets users drag a UI element around the screen or within a defined area. It supports screen bounds, custom RectTransforms as boundaries, optional out of bounds dragging, and animated smooth return. This makes it ideal for movable windows, floating panels, tooltips, and draggable UI widgets.
Usage
Add Rect Dragger component to any UI element with a RectTransform
Choose a boundary mode:
- NoBounds: free movement anywhere
- ScreenBounds: constrained within the canvas area
- RectBounds: constrained within a specified RectTransform
Enable allowOutOfBounds if you want the element to temporarily exit the boundary area and return smoothly
Start dragging!
Properties
| Name | Type | Description |
|---|---|---|
isDraggable | bool | Enables or disables dragging behavior |
boundaryType | BoundaryType | Selects boundary mode |
boundaryRect | RectTransform | Used only when boundaryType is RectBounds |
allowOutOfBounds | bool | Allows temporary dragging outside the boundary |
returnDuration | float | Duration for returning to bounds or original position |
useUnscaledTime | bool | Uses unscaled delta time for return animation |
returnCurve | AnimationCurve | Controls easing for smooth return motion |
Code Example
using UnityEngine;
using Evo.UI;
public class RectDraggerExample : MonoBehaviour
{
public RectDragger dragger;
void Start()
{
// Enable or disable dragging
dragger.isDraggable = true;
// Constrain within screen bounds
dragger.boundaryType = RectDragger.BoundaryType.ScreenBounds;
// Optional: use a custom RectTransform as boundary
// dragger.boundaryType = RectDragger.BoundaryType.RectBounds;
// dragger.boundaryRect = someRectTransform;
// Allow movement outside boundary but return smoothly
dragger.allowOutOfBounds = true;
// Return animation settings
dragger.returnDuration = 0.3f;
dragger.useUnscaledTime = true;
dragger.returnCurve = AnimationCurve.EaseInOut(0, 0, 1, 1);
}
}