Akshay Khale
Akshay Khale

Reputation: 8361

Dart: Await function call is not waiting and returning Future object

I am completely new to Dart and Flutter Development, I understand Async...Await of Javascript but unable to get the similar results in Dart.

Below is a simplified version of a Database Driven Application:

import 'package:flutter/material.dart';

class MyTestActivity extends StatelessWidget {
  Future<int> testFunction() async {
    // Code returning Integer value from Await function Call
    return 20;
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Test',
        home: Scaffold(
          appBar: AppBar(
            title: Text('TEST'),
          ),
          body: Container(
            margin:
                const EdgeInsets.only(top: 10, bottom: 10, left: 5, right: 5),
            child: Text(testFunction().toString()),
          ),
        ));
  }
}

Below is the result of the above Widget: enter image description here

I would want value 20 over there.

Upvotes: 0

Views: 513

Answers (2)

Saud Qureshi
Saud Qureshi

Reputation: 1688

A Future in dart is like the Promise of javascript. It'll return the value when it's resolved (or throw error when rejected). And since you're dealing with a Promise (Future) here the return value of testFunction (if you don't await it) will be a Promise (Future). I would recommend if you're using Futures in your Widget tree, look into the FutureBuilder Widget which let's you better handle Futures in Widget tree. Restructure your app like this for now.

@override
Widget build(BuildContext context) {
    return MaterialApp(
        title: 'Test',
        home: Scaffold(
          appBar: AppBar(
            title: Text('TEST'),
          ),
          body: Container(
            margin:
                const EdgeInsets.only(top: 10, bottom: 10, left: 5, right: 5),
            child: FutureBuilder (
                 future: testFunction,
                 builder: (BuildContext context, AsyncSnapshot snapshot, ) {
                    if (snapshot.hasData) {
                         return Text (snapshot.data.toString());
                     }
                     return CircularProgressIndicator();
                  }
              ),
          ),
        ));
  }

Upvotes: 2

Akshay Khale
Akshay Khale

Reputation: 8361

Answer given by Saud worked for me but the code in his Answer has some issues, I am adding the code that worked for me:

@override
Widget build(BuildContext context) {
  return MaterialApp(
    title: 'Test',
    home: Scaffold(
      appBar: AppBar(
        title: Text('TEST'),
      ),
      body: Container(
        margin:
            const EdgeInsets.only(top: 10, bottom: 10, left: 5, right: 5),
        child: FutureBuilder<int>(
            future: testFunction(),// Even on Flutter website it's without parentheses but did not work.
            builder: (BuildContext context, AsyncSnapshot<int> snapshot) {
              if (snapshot.hasData) {
                return Text(snapshot.data.toString());
              }
              return CircularProgressIndicator();
            }),
      ),
    ));
}

Upvotes: 1

Related Questions