pinch_zoom_any 0.0.1
pinch_zoom_any: ^0.0.1 copied to clipboard
Add pinch-to-zoom, pan, double-tap zoom, and double-tap reset to any Flutter widget. Zero dependencies — pure Flutter.
pinch_zoom_any #
Add pinch-to-zoom, pan, double-tap to zoom, and double-tap to reset to any Flutter widget — with zero external dependencies.
Features #
- 🤏 Pinch to zoom — smooth, natural gesture using Flutter's scale gesture
- ✋ Pan / drag while zoomed — move freely around the zoomed content
- 👆 Double-tap to zoom — toggles between 1× and
doubleTapScale - 🔄 Double-tap to reset — if already zoomed, double-tap returns to 1×
- ⚡
resetOnRelease— snap back to original size when fingers lift - 📡
onScaleChangedcallback — react to scale changes in real time - 🎨 Works on any widget — images, cards, text, custom widgets, anything
Getting started #
Add to your pubspec.yaml:
dependencies:
pinch_zoom_any: ^0.1.0
Then run:
flutter pub get
Usage #
Basic — wrap any widget #
import 'package:pinch_zoom_any/pinch_zoom_any.dart';
PinchZoomAny(
child: Image.network('https://example.com/photo.jpg'),
)
With custom zoom limits #
PinchZoomAny(
minScale: 1.0,
maxScale: 5.0,
doubleTapScale: 2.5,
child: Image.asset('assets/map.png'),
)
Reset on release (e.g. for previews) #
PinchZoomAny(
resetOnRelease: true,
child: Card(
child: Padding(
padding: EdgeInsets.all(16),
child: Text('Pinch me — I snap back!'),
),
),
)
React to scale changes #
PinchZoomAny(
onScaleChanged: (scale) {
print('Current scale: $scale');
},
child: MyCustomWidget(),
)
API Reference #
PinchZoomAny #
| Parameter | Type | Default | Description |
|---|---|---|---|
child |
Widget |
required | The widget to make zoomable |
minScale |
double |
1.0 |
Minimum zoom level |
maxScale |
double |
4.0 |
Maximum zoom level |
doubleTapScale |
double |
2.0 |
Zoom level reached on double-tap |
resetOnRelease |
bool |
false |
Snap back to 1× when fingers lift |
clipBehavior |
Clip |
Clip.hardEdge |
Clipping applied to zoomed content |
onScaleChanged |
ValueChanged<double>? |
null |
Callback fired on every scale change |
How it works #
PinchZoomAny uses Flutter's built-in GestureDetector with onScaleStart, onScaleUpdate, and onScaleEnd to track the pinch gesture. A Matrix4 transform is applied via Transform to scale and translate the child. An AnimationController handles smooth snap-back and double-tap transitions.
No external packages are used — this is pure Flutter.
License #
MIT — see LICENSE.