easy_zoom_widget #

A simple and easy-to-use Flutter package that makes any widget zoomable with pinch, double-tap, and pan gestures. Perfect for images, custom widgets, and any content that needs zoom functionality!

✨ Features #

• 🔍 Pinch to Zoom - Use two fingers to zoom in and out smoothly
• 👆 Double Tap - Double tap to zoom in, tap again to zoom out
• 🖐️ Pan & Move - Drag around when zoomed in
• 🎛️ Fully Customizable - Configure min/max zoom, animation speed, and more
• 🎮 Programmatic Control - Control zoom programmatically with ZoomController
• 🎨 Works with Any Widget - Images, containers, custom widgets, anything!
• ⚡ Smooth Animations - Beautiful, fluid zoom animations
• 🪶 Lightweight - No external dependencies

📦 Installation #

Add this to your pubspec.yaml:

dependencies:
  easy_zoom_widget: ^1.0.0

Then run:

flutter pub get

🚀 Quick Start #

Basic Usage #

Wrap any widget with EasyZoomWidget:

import 'package:easy_zoom_widget/easy_zoom_widget.dart';

EasyZoomWidget(
  child: Image.network('https://picsum.photos/800/600'),
)

That's it! Your widget is now zoomable! 🎉

With Custom Settings #

EasyZoomWidget(
  minScale: 0.8,
  maxScale: 5.0,
  doubleTapScale: 2.5,
  child: Container(
    width: 300,
    height: 300,
    color: Colors.blue,
    child: Center(child: Text('Zoom me!')),
  ),
)

With Controller (Programmatic Control) #

class MyWidget extends StatefulWidget {
  @override
  State<MyWidget> createState() => _MyWidgetState();
}

class _MyWidgetState extends State<MyWidget> {
  final ZoomController _controller = ZoomController();

  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Expanded(
          child: EasyZoomWidget(
            controller: _controller,
            child: Image.asset('assets/photo.jpg'),
          ),
        ),
        Row(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: () => _controller.zoomIn(),
              child: Text('Zoom In'),
            ),
            SizedBox(width: 10),
            ElevatedButton(
              onPressed: () => _controller.zoomOut(),
              child: Text('Zoom Out'),
            ),
            SizedBox(width: 10),
            ElevatedButton(
              onPressed: () => _controller.reset(),
              child: Text('Reset'),
            ),
          ],
        ),
      ],
    );
  }
}

Listen to Scale Changes #

EasyZoomWidget(
  onScaleChanged: (scale) {
    print('Current zoom scale: $scale');
  },
  child: YourWidget(),
)

🎨 Customization Options #

🎮 ZoomController Methods #

💡 Tips & Best Practices #

1. For Images: Wrap your Image widget with EasyZoomWidget for instant zoom functionality
2. For Custom Widgets: Works perfectly with any Flutter widget - Container, Column, Stack, etc.
3. Performance: The package is optimized and lightweight - no performance issues even with large images
4. Gesture Priority: Double-tap has priority over single tap, pinch works alongside pan gestures
5. Controller Usage: Use controller when you need buttons or programmatic zoom control

🐛 Troubleshooting #

Q: Widget doesn't zoom?
A: Make sure the parent widget has defined size (height/width) or uses Expanded/Flexible

Q: Zoom feels sluggish?
A: Adjust animationDuration to make it faster: Duration(milliseconds: 200)

Q: Want to disable certain gestures?
A: Use enableDoubleTap: false, enablePinch: false, or enablePan: false

📄 License #

This project is licensed under the MIT License - see the LICENSE file for details.

🤝 Contributing #

Contributions are welcome! Please feel free to submit a Pull Request.

💬 Support #

If you like this package, please give it a ⭐ on GitHub and a 👍 on pub.flutter-io.cn!

For bugs or feature requests, please create an issue on GitHub.

Happy Zooming! 🔍✨