draggable_widget

Creator: coderz1093

Last updated:

Add to Cart

Description:

draggable widget

A flutter package which will help you to create a draggable widget that can be dragged around the screen.
Demo #

Features 💚 #

Manually Control the position of the widget along with drags.
Automatically resizes itself when the widget changes
Highly customizable
Supports Flutter web as well

Properties 🔖 #
/// The widget that will be displayed as dragging widget
final Widget child;

/// The horizontal padding around the widget
final double horizontalSpace;

/// The vertical padding around the widget
final double verticalSpace;

/// Intial location of the widget, default to [AnchoringPosition.bottomRight]
final AnchoringPosition initialPosition;

/// Intially should the widget be visible or not, default to [true]
final bool intialVisibility;

/// The top bottom pargin to create the bottom boundary for the widget, for example if you have a [BottomNavigationBar],
/// then you may need to set the bottom boundary so that the draggable button can't get on top of the [BottomNavigationBar]
final double bottomMargin;

/// The top bottom pargin to create the top boundary for the widget, for example if you have a [AppBar],
/// then you may need to set the bottom boundary so that the draggable button can't get on top of the [AppBar]
final double topMargin;

/// Status bar's height, default to 24
final double statusBarHeight;

/// Shadow's border radius for the draggable widget, default to 10
final double shadowBorderRadius;

/// A drag controller to show/hide or move the widget around the screen
final DragController? dragController;

/// [BoxShadow] when the widget is not being dragged, default to
/// ```Dart
///const BoxShadow(
/// color: Colors.black38,
/// offset: Offset(0, 4),
/// blurRadius: 2,
/// ),
/// ```

final BoxShadow normalShadow;

/// [BoxShadow] when the widget is being dragged
///```Dart
///const BoxShadow(
/// color: Colors.black38,
/// offset: Offset(0, 10),
/// blurRadius: 10,
/// ),
/// ```
final BoxShadow draggingShadow;

/// How much should the [DraggableWidget] be scaled when it is being dragged, default to 1.1
final double dragAnimationScale;

copied to clipboard
AnchoringPosition can be among these 4 types #
enum AnchoringPosition {
topLeft,
topRight,
bottomLeft,
bottomRight,
center
}
copied to clipboard
How to use #
Stack(
children:[
// other widgets...
DraggableWidget(
bottomMargin: 80,
topMargin: 80,
intialVisibility: true,
horizontalSpace: 20,
shadowBorderRadius: 50,
child: Container(
height: 100,
width: 100,
decoration: BoxDecoration(
shape: BoxShape.circle,
color: Colors.blue,
),
),
initialPosition: AnchoringPosition.bottomLeft,
dragController: dragController,
),
],
)
copied to clipboard
DragController Functionality #
/// Jump to any [AnchoringPosition] programatically
void jumpTo(AnchoringPosition anchoringPosition)

/// Get the current screen [Offset?] of the widget
Offset? getCurrentPosition()

/// Makes the widget visible
void showWidget()

/// Hide the widget
void hideWidget()
copied to clipboard
Run the example app in the exmaple folder to find out more about how to use it.

License

For personal and professional use. You cannot resell or redistribute these repositories in their original state.

Customer Reviews

There are no reviews.