L'indicateur d'actualisation ne fonctionne pas sur le défilement dans Flutter

Dans ce didacticiel, vous apprendrez à résoudre si RefreshIndicator () ne fonctionne pas sur le défilement lorsque ListView () ou SingleChildScrollView () n'est pas entièrement rempli à sa hauteur. Voir la configuration simple sur ScrollView pour fonctionner parfaitement Refresh Indicator.

Lorsque les widgets défilants comme ListView() ou SingleChildScrollView() ne sont pas entièrement remplis à leur hauteur, le défilement est désactivé et, par conséquent, le RefreshIndicator() ne fonctionnera pas non plus.

Pour résoudre ce problème, votre widget déroulant doit défiler même s'il n'a pas pris toute sa hauteur.

RefreshIndicator(
  onRefresh: () async{
      await Future.delayed(Duration(seconds: 3));
  },
  child:SingleChildScrollView(
    physics: AlwaysScrollableScrollPhysics(),
  )
)

Il faut ajouter une physique toujours scrollable à SingleChildScrollView()ou ListView():

ListView(
   physics: AlwaysScrollableScrollPhysics()
)

Exemple d'application complète :

import 'package:flutter/material.dart';

void main(){
  runApp(MyApp());
}

class MyApp extends StatelessWidget{
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Home(),
    );
  }
}

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

class _HomeState extends State<Home> {
  @override
  Widget build(BuildContext context) {
    return  Scaffold(
      appBar: AppBar( 
          title: Text("Refresh Indicator"),
          backgroundColor: Colors.deepPurpleAccent,
      ),
      body: RefreshIndicator(
          onRefresh: () async{
              await Future.delayed(Duration(seconds: 3));
          },
          child:SingleChildScrollView(
            physics: AlwaysScrollableScrollPhysics(),
            child:Column(
                children: [
                  for(int x = 1; x <=4;x++)...[
                      Container(
                        height: 100,
                        color: Colors.redAccent,
                      )
                  ] 
                ]
            ),
         )
      ),
    );
  }
}

Capture d'écran de sortie :

De cette façon, vous pouvez résoudre le problème de l'indicateur d'actualisation qui ne fonctionne pas lorsque le widget déroulant ne remplit pas sa hauteur.