InteractiveViewer
A widget that enables pan gestures and zoom interactions with its child.
Properties
- alignPanAxis
- boundaryMargin
- builder
- child
- clipBehavior
- constrained
- hashCode
- maxScale
- minScale
- oninteractionEnd
- oninteractionStart
- oninteractionUpdate
- panEnabled
- runtimeType
- scaleEnabled
- transformationController
Example 1:
import 'package:flutter/material.dart';
void main() => runApp(DemoApp());
class DemoApp extends StatefulWidget {
@override
State<StatefulWidget> createState() {
return DemoAppState();
}
}
class DemoAppState extends State<DemoApp> {
@override
Widget build(BuildContext context) {
return MaterialApp(
home: Scaffold(
body: Center(
child: ClipRect(
child: InteractiveViewer(
child: Image.network(
'https://cdn.pixabay.com/photo/2021/01/29/09/30/parliament-5960363_1280',
),
),
),
),
),
);
}
}
Example 2:
Center(
child: ClipRect(
child: InteractiveViewer(
scaleEnabled: true,
maxScale: 10,
minScale: 1,
boundaryMargin: const EdgeInsets.all (30),
child: Image.network(
'https://cdn.pixabay.com/photo/2021/01/29/09/30/parliament-5960363_1280',
),
),
),
),
Example 3:
Center(
child: ClipRect(
child: InteractiveViewer(
constrained: false,
scaleEnabled: true,
maxScale: 10,
minScale: 1,
boundaryMargin: const EdgeInsets.all(30),
child: Image.network(
'https://cdn.pixabay.com/photo/2021/01/29/09/30/parliament-5960363_1280',
),
),
),
),
Video Link: