如何在Flutter中的小部件之间更改ScrollController的偏移值?

时间:2019-10-28 16:12:22

标签: flutter

我正在尝试将一个有状态小部件中的ScrollController的偏移值从另一有状态小部件更改。

我不是在使用导航器来更改屏幕,而是只是调用有状态的小部件。

在这种情况下,正在HomeScreen状态小部件内部调用InspectionForm状态小部件。

主屏幕状态小部件:

class HomeScreen extends StatefulWidget {
  @override
  _HomeScreenState createState() => _HomeScreenState();

class _HomeScreenState extends State<HomeScreen> {

final ScrollController _homeController = ScrollController();

Widget _buildForm() {
    if (_homeController.hasClients) {
      setState(() {
        _homeController.animateTo(
          0.0,
          curve: Curves.easeOut,
          duration: const Duration(milliseconds: 300),
        );
      });
    }

return InspectionForm();

}

@override
  Widget build(BuildContext context) {
return Scaffold(body: CustomScrollView(
              controller: _homeController,
              primary: false,
              slivers: <Widget>[
                SliverList(
                  delegate: SliverChildListDelegate(
                    [
                      Column(
                        children: <Widget>[
                          Container(
                            child: _buildForm(),
                          ),
                        ],
                      ),
                    ],
                  ),
                ),
              ],
            ),
          );
} 

有状态窗口小部件:

class InspectionForm extends StatefulWidget {

  @override
  _InspectionFormState createState() => _InspectionFormState();
}

class _InspectionFormState extends State<InspectionForm> {

@override
  Widget build(BuildContext context) {
return RaisedButton(
onPressed: (){

//Need to change the ScrollView offset when this button is pressed over here.


}

);
}

}

我简化了上面的代码,以使其更易于阅读,并简单地阐明我想做的事情。任何帮助将不胜感激。

1 个答案:

答案 0 :(得分:0)

在我看来,您已经知道Flutter ScrollController的工作方式,并且您的InspectionForm被实例化为HomeScreen的子代,因此您可以做的一件事是通过从您的HomeScreenInspectionForm的函数作为参数。此功能将从InspectionForm触发,但会在HomeScreen中定义,您可以使用ScrollController进行任何操作。像这样的东西(我没有尝试过这段代码,这只是供您理解的草稿)。

class HomeScreen extends StatefulWidget {
@override
_HomeScreenState createState() => _HomeScreenState();

class _HomeScreenState extends State<HomeScreen> {

final ScrollController _homeController = ScrollController();

Widget _buildForm(void Function(double) onFormButtonPressed) {
if (_homeController.hasClients) {
  setState(() {
    _homeController.animateTo(
      0.0,
      curve: Curves.easeOut,
      duration: const Duration(milliseconds: 300),
    );
  });
}

return InspectionForm(onFormButtonPressed);
}

void _onFormButtonPressed(double scrollOffset) {
  // Whatever you need to do with the ScrollController here...
}

@override
Widget build(BuildContext context) {
return Scaffold(body: CustomScrollView(
          controller: _homeController,
          primary: false,
          slivers: <Widget>[
            SliverList(
              delegate: SliverChildListDelegate(
                [
                  Column(
                    children: <Widget>[
                      Container(
                        child: _buildForm(_onFormButtonPressed),
                      ),
                    ],
                  ),
                ],
              ),
            ),
          ],
        ),
      );
}

然后,您的表单需要将该函数作为参数。

class InspectionForm extends StatefulWidget {
InspectionForm(this.onButtonPressed);

final void Function(double) onButtonPressed;

@override
_InspectionFormState createState() => _InspectionFormState();
}

class _InspectionFormState extends State<InspectionForm> {

@override
Widget build(BuildContext context) {
  return RaisedButton(
   onPressed: () { 
    // Compute some scrollOffset here, whatever you need...
    widget.onButtonPressed(scrollOffset); 
   }
  );
 }
}