RefreshIndicator not working with SingleChildScrollView as child

user_3886118 0
Viewed 2498

I am trying to use RefreshIndicator to reload a list I show on my home screen. The code looks similar to this: 

class Home extends StatefulWidget {
  @override
  _StartHomeState createState() => _StartHomeState();
}

class _StartHomeState extends State<Home> {
  EventsList events;

  @override
  void initState() {
    super.initState();
    events = EventsList();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      resizeToAvoidBottomPadding: false,
      body: RefreshIndicator(
        onRefresh: resfreshEventList,
        child: SingleChildScrollView(
          physics: AlwaysScrollableScrollPhysics(),
          child: Column(
            children: [
              HomeTopBar(),
              events,
            ],
          ),
        ),
      ),
    );
  }

  Future<Null> resfreshEventList() async {
    await Future.delayed(Duration(seconds: 2));

    setState(() {
      events = EventsList();
    });
    return null;
  }
}

EventsList is another stateful widget that will call an API and map the response to a list of widgets. I have tried setting the physics property of the SingleChildScrollView as mentioned here: https://github.com/flutter/flutter/issues/22180 but no luck. Using ListView instead of the SingleChildScrollView doesn't work either.

dart flutter
1 Answers

It seems to be working fine in this example When I pull to refresh then resfreshEventList gets fired and also setState is working without any problem.

Here is the code which I am using: 

import 'package:flutter/material.dart';

class Home extends StatefulWidget {
  @override
  _StartHomeState createState() => _StartHomeState();
}

class _StartHomeState extends State<Home> {
  // EventsList events;
  int number = 0;

  @override
  // void initState() {
  //   super.initState();
  //   events = EventsList();
  // }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        home: Scaffold(
      appBar: AppBar(
        title: Text("RefreshIndicator Example"),
      ),
      resizeToAvoidBottomPadding: false,
      body: RefreshIndicator(
        onRefresh: resfreshEventList,
        child: SingleChildScrollView(
          physics: AlwaysScrollableScrollPhysics(),
          child: Column(
            children: [
              // HomeTopBar(),
              // events,
              Container(
                height: 200,
                width: 200,
                color: Colors.red,
                child: Center(
                  child: Text(number.toString()),
                ),
              ),
              Divider(),
              Container(
                height: 200,
                width: 200,
                color: Colors.red,
                child: Center(
                  child: Text(number.toString()),
                ),
              ),
              Divider(),
              Container(
                height: 200,
                width: 200,
                color: Colors.red,
                child: Center(
                  child: Text(number.toString()),
                ),
              ),
              Divider(),
              Container(
                height: 200,
                width: 200,
                color: Colors.red,
                child: Center(
                  child: Text(number.toString()),
                ),
              ),
              Divider(),
              Container(
                height: 200,
                width: 200,
                color: Colors.red,
                child: Center(
                  child: Text(number.toString()),
                ),
              )
            ],
          ),
        ),
      ),
    ));
  }

  Future<Null> resfreshEventList() async {
    // await Future.delayed(Duration(seconds: 2));

    // setState(() {
    //   events = EventsList();
    // });
    setState(() {
      number = number + 1;
    });
    print("Refresh Pressed");
    return null;
  }
}

Output:

enter image description here

user_56691200
Related