Getting Started
Installation
Add this package to your dependencies in your pubspec.yaml file:
dependencies:
flutter_box_transform: <latest_version>
or run following command in your project directory:
flutter pub add flutter_box_transform
Usage
Wrap the widget you want to resize or move with TransformableBox.
TransformableBox internally uses Positioned to place its content at a given position with a given
size. So, TransformableBox must be a child of a Stack widget.
Using TransformableBox inside a Stack
Stack(
children: [
TransformableBox(
rect: rect,
flip: flip,
onChanged: (event) {
setState(() { // update the state
box = event.rect;
flip = event.flip;
});
},
contentBuilder: (context, rect, flip) => Transform.scale(
scaleX: flip.isHorizontal ? -1 : 1,
scaleY: flip.isVertical ? -1 : 1,
child: Image.asset( // your widget goes here.
'assets/images/landscape.jpg',
width: rect.width,
height: rect.height,
fit: BoxFit.fill,
),
),
),
],
);
onChanged callback is called when user resizes or moves the box. You can use this callback to update the box by calling
setState method explicitly.
TransformableBox follows flutter's widget patterns by not storing any state. You must store the box and
flip state by yourself in your widget's state class and pass it to TransformableBox as constructor parameters.
Be sure to call setState to refresh the UI when changes occur.