我正在交互式查看器中缩放图像,交互式查看器是容器的子级,为容器设置一些高度,在缩放图像后,视口中的特定位置,我无法滚动和缩放图像
class MyApp extends StatelessWidget {
static const String _title = 'Flutter Code Sample';
@override
Widget build(BuildContext context) {
return MaterialApp(
title: _title,
home: Scaffold(
appBar: AppBar(title: const Text(_title)),
body: Zoom(),
),
);
}
}
class Zoom extends StatefulWidget
{
@override
MyStatelessWidget createState()=> MyStatelessWidget();
}
/// This is the stateless widget that the main application instantiates.
class MyStatelessWidget extends State<Zoom> {
@override
Widget build(BuildContext context) {
return Center(
child:Container(height: 300,
child: InteractiveViewer(
scaleEnabled: true,maxScale: 4.0,
child: Center(
child:Container( child:Image.asset('Assets/Java-001.jpg',fit: BoxFit.cover,alignment: Alignment.center,)),
),
)));
}
}
我该如何解决这个问题?
答案 0 :(得分:0)
尝试将以下参数添加到InteractiveViewer小部件中:
scrollToDiv() {
document.getElementById('pricing').scrollIntoView({
behavior: 'smooth',
})
var elements = document.getElementsByClassName('example-classname')
for(let e of elements) e.classList.add('glow')
var scrollTimeout
clearTimeout(scrollTimeout)
scrollTimeout = setTimeout(function () {
for(let e of elements) e.classList.remove('glow')
}, 2000)
}
答案 1 :(得分:0)
如果您的小部件大于视口,您需要将 constrained
设置为 false
。
constrained:如果设置为false,则子项将被赋予无限约束。当孩子应该比 InteractiveViewer 大时,这通常很有用。
InteractiveViewer(
constrained: false, // Set it to false.
child: YourContainer(...),
)