CODEWITHSUNDEEP
flutteruser-interfaceflutter-futurebuilder
user14733716
user14733716

Reputation: 31

(Flutter Futurebuilder) the appbar title won't load as soon as the page changes

import 'dart:convert';
import 'package:flutter/widgets.dart';
import 'package:flutter_app/home_page.dart';
import 'package:flutter_app/login_page.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:http/http.dart' as http;
import 'package:shared_preferences/shared_preferences.dart';
import 'package:geolocator/geolocator.dart';

class HomePage extends StatefulWidget {
  @override
  _HomePageState createState() => _HomePageState();
}


class _HomePageState extends State<HomePage> {
String name;
  @override
  void initState() {
    super.initState();
  }

Future <void>loadPref()async{
  SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
  return Future.delayed(Duration(seconds: 1),(){
    return name=sharedPreferences.getString("useFullName");
  });

}


logout()async{
  SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
  sharedPreferences.clear();
  sharedPreferences.commit();
  Navigator.of(context).pushAndRemoveUntil(MaterialPageRoute(builder: (BuildContext context) => LoginPage()), (Route<dynamic> route) => false);
}


 var locationMessege= "";

  void getCurrentLocation()async{
    var position = await Geolocator.getCurrentPosition(desiredAccuracy: LocationAccuracy.high);
    var lastPosition=await Geolocator.getLastKnownPosition();
    print(lastPosition);

    setState(() {
      locationMessege="$position.latitude,$position.longitude";
    });
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor:Colors.orangeAccent,
        title: FutureBuilder(
          future: loadPref(),
          builder: (context, snapshot) {
            if(name==null){
              return Text("Loading");
            }else{
              return Text("$name");
            }
          },
        ),
        actions: <Widget>[
          FlatButton(
            onPressed: () {
              logout();
            },
            child: Text("Log Out", style: TextStyle(color: Colors.white)),
          ),
        ],
      ),
      body: Container(
        decoration: BoxDecoration(
            image: DecorationImage(
                image: AssetImage("assets/bg1.png"), fit: BoxFit.cover)),
        child: Center(
          child: Container(
            padding: EdgeInsets.all(30),
            child: Column(
              mainAxisAlignment: MainAxisAlignment.center,
              crossAxisAlignment: CrossAxisAlignment.center,
              children: [

                Column(
                  children:<Widget>  [
                    Container(
                        width: 130.0,
                        height: 130.0,
                        decoration: BoxDecoration(
                            image: DecorationImage(
                                image: AssetImage("assets/solalogo2.png"), fit: BoxFit.cover))
                    ),
                    Text("GPS Location",style: TextStyle(
                        color: Colors.black,
                        fontSize: 30.0,
                        fontWeight: FontWeight.bold)),
                    Icon(Icons.location_on,
                    size: 46,
                    color: Colors.yellow,),

                    Text("Position:$locationMessege",style:TextStyle(
                        color: Colors.black,
                        fontSize: 20.0,
                        fontWeight: FontWeight.bold)),
                    FlatButton(onPressed:(){
                      getCurrentLocation();
                    },
                    color: Colors.orange,
                        child: Text("Get New Location",
                        style: TextStyle(
                          color: Colors.black,
                        ),))
                  ],
                ),
              ],
            ),
          ),
        ),
      ),
    );
  }
}

After the successful login its being directed to to this home page. I want to load the users name on the appbar title, but it always trigger the loading statement and not load the name till I close the app and load it again. When you reopen the app you get directed to home page if the user previously logged in. I'm new to flutter and this has been my 2nd week working with it and any useful tips and advice would be much appreciated.

Upvotes: 0

Views: 2130

Answers (3)

Priyesh
Priyesh

Reputation: 1313

Change the code of loadPref() method

Future <String> loadPref()async{
  SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
  return await sharedPreferences.getString("useFullName");

}

        FutureBuilder(
          future: loadPref(),
          builder: (context, snapshot) {
            if(snapshot.hasData){
              return Text("${snapshot.data}");
            }else{
              return Text("Loading");
            }
          },
        )

Upvotes: 0

ישו אוהב אותך
ישו אוהב אותך

Reputation: 29783

imho, using FutureBuilder for your case is a bit overkill.

You can use then method instead of using await. see https://api.flutter.dev/flutter/dart-async/Future/then.html.

So, change your initState() like the following code:

class _HomePageState extends State<HomePage> {
  String name = ""; // Defaulting to empty 
 
  @override
  void initState() {
    super.initState();

    SharedPreferences.getInstance().then((res) {
      setState(() {
        // Return string of "useFullName"
        // or return empty string if "userFullName" is null
        name = res.getString("useFullName")?? '';
      });
    });
  }
}

Now, you can simply using the name variable for your AppBar title:

@override
Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      backgroundColor:Colors.orangeAccent,
      title: Text(name),
    ),

    ...
  );
}

Upvotes: 1

user14733716
user14733716

Reputation: 31

  Future <String> loadPref()async{
SharedPreferences sharedPreferences = await SharedPreferences.getInstance();
return Future.delayed(Duration(seconds: 1),()async{
  return await sharedPreferences.getString("useFullName");
});

}

wrapping the return with a delay made it work , but i have absolutely no idea why it worked now but not before and credit for Priyesh suggested code i modified that to get it running. and if any one know why it didn't work please do let me know! thank you .

Upvotes: 0

Related Questions