initialScrollOffset 在 SingleChildScrollView 中不起作用
initialScrollOffset didn't work in SingleChildScrollView
正如你所看到的,有一个红色的水平线SingleChildScrollView
,每次我点击滚动按钮它的偏移量都会增加20。
这是我的代码:
import 'package:flutter/material.dart';
import 'package:flutter_storage/managers/screen_util.dart';
class DraftPage extends StatefulWidget {
DraftPage({Key key}) : super(key: key);
@override
_DraftPageState createState() => _DraftPageState();
}
class _DraftPageState extends State<DraftPage> {
int index = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Test'),
),
body: Column(
children: [
SizedBox(
width: ScreenUtil.screenWidth,
height: 30,
child: _LineView(currentIndex: index),
),
SizedBox(height: 20),
RaisedButton(
child: Text('scroll'),
onPressed: () {
setState(() {
index++;
});
},
),
],
),
);
}
}
class _LineView extends StatelessWidget {
const _LineView({Key key, @required this.currentIndex}) : super(key: key);
final int currentIndex;
@override
Widget build(BuildContext context) {
final offset = currentIndex * 20.0;
print(offset);
final controller =
ScrollController(initialScrollOffset: offset, keepScrollOffset: false);
controller.addListener(() {
print(controller.offset);
});
final row = Row(
children: [
Container(
width: 1000,
height: 30,
color: Colors.red,
child: Text('666666666666666666666'),
),
],
);
final scrollView = SingleChildScrollView(
controller: controller,
scrollDirection: Axis.horizontal,
child: row,
);
return scrollView;
}
}
但是,当我点击滚动按钮时,scrollView 的偏移量根本没有改变。
我的代码有什么问题?
你可以复制我的代码测试一下
一个肮脏的修复方法是将 key: Key(offset.toString())
添加到您的 SingleChildScrollView
。这是因为此视图不知道在构建过程中发生了某些更改。
一个干净的修复方法是让 _LineView
接受一个 scrollController,然后当按下按钮时,使用 scrollController.jumpTo
进行偏移。控制器的处置可以在您的 DraftPage
.
中完成
正如你所看到的,有一个红色的水平线SingleChildScrollView
,每次我点击滚动按钮它的偏移量都会增加20。
这是我的代码:
import 'package:flutter/material.dart';
import 'package:flutter_storage/managers/screen_util.dart';
class DraftPage extends StatefulWidget {
DraftPage({Key key}) : super(key: key);
@override
_DraftPageState createState() => _DraftPageState();
}
class _DraftPageState extends State<DraftPage> {
int index = 0;
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text('Test'),
),
body: Column(
children: [
SizedBox(
width: ScreenUtil.screenWidth,
height: 30,
child: _LineView(currentIndex: index),
),
SizedBox(height: 20),
RaisedButton(
child: Text('scroll'),
onPressed: () {
setState(() {
index++;
});
},
),
],
),
);
}
}
class _LineView extends StatelessWidget {
const _LineView({Key key, @required this.currentIndex}) : super(key: key);
final int currentIndex;
@override
Widget build(BuildContext context) {
final offset = currentIndex * 20.0;
print(offset);
final controller =
ScrollController(initialScrollOffset: offset, keepScrollOffset: false);
controller.addListener(() {
print(controller.offset);
});
final row = Row(
children: [
Container(
width: 1000,
height: 30,
color: Colors.red,
child: Text('666666666666666666666'),
),
],
);
final scrollView = SingleChildScrollView(
controller: controller,
scrollDirection: Axis.horizontal,
child: row,
);
return scrollView;
}
}
但是,当我点击滚动按钮时,scrollView 的偏移量根本没有改变。
我的代码有什么问题?
你可以复制我的代码测试一下
一个肮脏的修复方法是将 key: Key(offset.toString())
添加到您的 SingleChildScrollView
。这是因为此视图不知道在构建过程中发生了某些更改。
一个干净的修复方法是让 _LineView
接受一个 scrollController,然后当按下按钮时,使用 scrollController.jumpTo
进行偏移。控制器的处置可以在您的 DraftPage
.