CODEWITHSUNDEEP
flutterflutter-layout
MKapp
MKapp

Reputation: 517

Pull down in a flutter app to refresh the app state

I want to update/refresh the balanceAvailable value inside the Text Widget by pulling down the mobile screen in a flutter app.

I have attached a sample code that I am working on for your reference.

I does not seem to work as intended. I would be grateful if someone can provide a solution to this issue.

import 'package:flutter/material.dart';

void main() => runApp(MyApp());

class MyApp extends StatefulWidget {
  @override
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  final GlobalKey<RefreshIndicatorState> _refreshIndicatorKey =
      GlobalKey<RefreshIndicatorState>();

  double balanceAvailable = 0.0;

  Future<void> _onRefreshing() async {
    setState(() async {
      balanceAvailable = 100;
      print('newbalance : $balanceAvailable');
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        body: RefreshIndicator(
            key: _refreshIndicatorKey,
            onRefresh: _onRefreshing,
            child: Container(
              width: double.infinity,
              color: Colors.lightBlue,
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: <Widget>[
                  RaisedButton(
                    onPressed: () async {},
                    child: Text("Just a Button 1"),
                  ),
                  SizedBox(
                    height: 100,
                  ),
                  Text('$balanceAvailable'),
                ],
              ),
            )),
      ),
    );
  }
}

Upvotes: 0

Views: 226

Answers (1)

dshukertjr
dshukertjr

Reputation: 18603

In order for RefreshIndicator to work, it needs a vertically scrollable descendant like a ListView:

RefreshIndicator(
  key: _refreshIndicatorKey,
  onRefresh: _onRefreshing,
  child: ListView(
    physics: const AlwaysScrollableScrollPhysics(),
    children: [
      Container(
        width: double.infinity,
        color: Colors.lightBlue,
        child: Column(
          mainAxisSize: MainAxisSize.min,
          mainAxisAlignment: MainAxisAlignment.center,
          children: <Widget>[
            RaisedButton(
              onPressed: () async {},
              child: Text("Just a Button 1"),
            ),
            SizedBox(
              height: 100,
            ),
            Text('$balanceAvailable'),
          ],
        ),
      ),
    ],
  ),
)

Upvotes: 1

Related Questions