PhotoView library not being able to zoom in / zoom out of image

4.5k Views Asked by At

I am trying to do a simple task with PhotoView. I have an AssetImage and I am trying to display the image and the user can zoom the scale in / out.

i am using the Pubspec dependency:

photo_view: ^0.9.2

I found this test code online but doesn't seem to work either :(

import 'package:flutter/material.dart';
import 'package:photo_view/photo_view.dart';



class KodetrApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Photo View',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Photo View'),
        ),
        body: Center(
          child: AspectRatio(
            aspectRatio: 16 / 9,
            child: ClipRect(
              child: PhotoView(
                imageProvider: NetworkImage(
                  'https://kodetr.herokuapp.com/banners/post/flutter/flutter_photoview.webp',
                ),
                minScale: PhotoViewComputedScale.contained * 0.8,
                maxScale: PhotoViewComputedScale.covered * 2,
                enableRotation: true,

              ),
            ),
          ),
        ),
      ),
    );
  }
}
2

There are 2 best solutions below

3
Jessica Cespedes On

I tried your test code and it gave me an error, but I made a few changes and if it worked fine

import 'package:flutter/material.dart';
import 'package:photo_view/photo_view.dart';



class KodetrApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Photo View',
      home: Scaffold(
        appBar: AppBar(
          title: Text('Photo View'),
        ),
        body: Center(
          child: AspectRatio(
            aspectRatio: 16 / 9,
            child: ClipRect(
              child: PhotoView(
                imageProvider: AssetImage(ADD IMAGE HERE),
                minScale: PhotoViewComputedScale.contained * 0.8,
                maxScale: PhotoViewComputedScale.covered * 2,
                enableRotation: true,

              ),
            ),
          ),
        ),
      ),
    );
  }
}
0
SilkeNL On

If you want to add a network image and not from assets use PhotoView.customChild:

PhotoView.customChild(
child: Image.network('yourImageUrl')),