A widget that allow user resize the widget with drag

Overview

Flutter-Resizable-Widget

A widget that allow user resize the widget with drag

Note: this widget uses Getx

Example

bandicam.2021-11-11.12-34-41-056.mp4
const double dragWidgetSize = 30;

class HomePage extends StatelessWidget {
  const HomePage({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    final areaHeight = Get.height * 0.70;
    final areaWidth = Get.width * 0.70;
    final controller = Get.put(
      ResizableWidgetController(
        initialPosition: Offset(areaWidth / 2, areaHeight / 2),
        areaHeight: areaHeight,
        areaWidth: areaWidth,
        height: areaHeight / 2,
        width: areaWidth / 2,
        minWidth: 50,
        minHeight: 50,
      ),
    );

    return Scaffold(
      appBar: AppBar(
        title: const Text('Resizable Widget'),
      ),
      body: LayoutBuilder(builder: (context, constraint) {
        return Container(
          width: constraint.maxWidth,
          height: constraint.maxHeight,
          color: Colors.black,
          child: UnconstrainedBox(
            child: Container(
              width: areaWidth,
              height: areaHeight,
              alignment: Alignment.center,
              decoration: const BoxDecoration(
                image: DecorationImage(
                  image: AssetImage('assets/background.png'),
                  fit: BoxFit.cover,
                ),
              ),
              child: ResizableWidget(
                dragWidgetHeight: dragWidgetSize,
                dragWidgetWidth: dragWidgetSize,
                controller: controller,
                dragWidget: Container(
                  height: dragWidgetSize,
                  width: dragWidgetSize,
                  decoration: const BoxDecoration(
                    shape: BoxShape.circle,
                    color: Colors.white24,
                  ),
                ),
                child: Container(
                  decoration: BoxDecoration(
                    border: Border.all(
                      color: Colors.white,
                    ),
                  ),
                ),
              ),
            ),
          ),
        );
      }),
    );
  }
}

You might also like...

Circular Reveal Animation as Flutter widget!

Circular Reveal Animation as Flutter widget!

Circular Reveal Animation Circular Reveal Animation as Flutter widget! Inspired by Android's ViewAnimationUtils.createCircularReveal(...). Статья с оп

Aug 15, 2022

A Flutter Package providing Avatar Glow Widget

A Flutter Package providing Avatar Glow Widget

Avatar Glow This Flutter package provides a Avatar Glow Widget with cool background glowing animation. Live Demo: https://apgapg.github.io/avatar_glow

Sep 6, 2022

✨A clean and lightweight loading/toast widget for Flutter, easy to use without context, support iOS、Android and Web

✨A clean and lightweight loading/toast widget for Flutter, easy to use without context, support iOS、Android and Web

Flutter EasyLoading English | 简体中文 Live Preview 👉 https://nslog11.github.io/flutter_easyloading Installing Add this to your package's pubspec.yaml fi

Sep 24, 2022

A beautiful animated flutter widget package library. The tab bar will attempt to use your current theme out of the box, however you may want to theme it.

A beautiful animated flutter widget package library. The tab bar will attempt to use your current theme out of the box, however you may want to theme it.

Motion Tab Bar A beautiful animated widget for your Flutter apps Preview: | | Getting Started Add the plugin: dependencies: motion_tab_bar: ^0.1.5 B

Sep 17, 2022

a widget provided to the flutter scroll component drop-down refresh and pull up load.

a widget provided to the flutter scroll component drop-down refresh and pull up load.

flutter_pulltorefresh Intro a widget provided to the flutter scroll component drop-down refresh and pull up load.support android and ios. If you are C

Sep 20, 2022

Highly customizable, feature-packed calendar widget for Flutter

Highly customizable, feature-packed calendar widget for Flutter

TableCalendar Highly customizable, feature-packed calendar widget for Flutter. TableCalendar with custom styles TableCalendar with custom builders Fea

Sep 29, 2022

A simple widget for animating a set of images with full custom controls as an alternative to using a GIF file.

image_sequence_animator A simple widget for animating a set of images with full custom controls as an alternative to using a GIF file. If you have a G

Sep 18, 2022

Flutter 3D Flip Animation Widget

Flutter 3D Flip Animation Widget

flutter_flip_view This is a flutter Widget base on pure Dart code that provides 3D flip card visuals. Usage add package in your pubspec.yaml dependenc

Jun 9, 2022

A simple toggle switch widget for Flutter.

Toggle Switch A simple toggle switch widget. It can be fully customized with desired icons, width, colors, text, corner radius, animation etc. It also

Sep 17, 2022
Comments
  • Major refactoring

    Major refactoring

    This is just some basic refactoring, that i made while using this repository for my project. Appreciate your work, and i hope you will accept this pull request.

    Changed dynamic variables to fixed num types Organized imports Fixed different things according to the standarf Flutter refactoring recommendations

    opened by AtomJon 1
Owner
MohammadAminZamani.afshar
I'm a 17 years old boy who love programming and computer world and develop mobile applications with Flutter.
MohammadAminZamani.afshar
A tween that allow defining keyframes for various properties.

keyframes_tween A tween that allow defining keyframes for various properties. Quickstart import 'package:keyframes_tween/keyframes_tween.dart'; class

Aloïs Deniel 11 Sep 19, 2022
A collection of Animations that aims to improve the user experience for your next flutter project.

A collection of Animations that aims to improve the user experience for your next flutter project.

Ezaldeen Sahb 131 Aug 20, 2022
A Flutter library that makes animation easer. It allows for separation of animation setup from the User Interface.

animator This library is an animation library for Flutter that: makes animation as simple as the simplest widget in Flutter with the help of Animator

MELLATI Fatah 225 Sep 6, 2022
In this repo you can expertise how to build various User Interface in Flutter

?? Flutter UI ?? Introduction The language used here is Dart, which is a object oriented programming language with the sdk called Flutter,It's a googl

navee-ramesh 16 Jun 17, 2022
Sample Flutter Drawing App which allows the user to draw onto the canvas along with color picker and brush thickness slider.

DrawApp Sample Flutter Drawing App which allows the user to draw onto the canvas along with color picker and brush thickness slider. All code free to

Jake Gough 225 Sep 26, 2022
Loading times are unavoidable in application development. From a user experience (UX) perspective

loading A new Flutter project. Getting Started This project is a starting point for a Flutter application. A few resources to get you started if this

azzouz abdelhakim 2 Feb 12, 2022
A Flutter widget that easily adds the flipping animation to any widget

flip_card A component that provides a flip card animation. It could be used for hiding and showing details of a product. How to use import 'package:fl

Bruno Jurković 301 Sep 22, 2022
A widget for stacking cards, which users can swipe horizontally and vertically with beautiful animations.

A widget for stacking cards, which users can swipe horizontally and vertically with beautiful animations.

HeavenOSK 80 Sep 14, 2022
Animated triangles background widget with color gradients

Triangles background Animated triangles background widget with color gradients Getting Started click image to see the video Usage add this line to pub

Marco Bavagnoli 16 Sep 1, 2022
A draggable Flutter widget that makes implementing a SlidingUpPanel much easier!

sliding_up_panel A draggable Flutter widget that makes implementing a SlidingUpPanel much easier! Based on the Material Design bottom sheet component,

Akshath Jain 1.2k Sep 25, 2022