I am trying to implement a feature where the user provides input on one screen and the data is stored locally (Shared Preferences) and as soon as the user gets back to another screen or pops back, the data should be updated to that screen immediately from the previous screen. Currently what is happening is, the data is updated only if I navigate to another screen and navigate back to that screen.

SharedPreferences
import 'package:shared_preferences/shared_preferences.dart';


class UserSimplePreferences {
  static late SharedPreferences _preferences;
  static const _name = 'name';
  static const _age = 'age';
  static const _gender = 'gender';
  static const _church = 'church';
  static const _churchCity = 'churchCity';
  static const _churchState = 'churchState';


  static Future init() async =>
      _preferences = await SharedPreferences.getInstance();

  static Future setName(String name) async =>
      await _preferences.setString(_name, name);

  static String? getName() => _preferences.getString(_name);

  static Future setAge(String age) async =>
      await _preferences.setString(_age, age);

  static String? getAge() => _preferences.getString(_age);

  static Future setGender(String gender) async =>
      await _preferences.setString(_gender, gender);

  static String? getGender() => _preferences.getString(_gender);

  static Future setChurch(String church) async =>
      await _preferences.setString(_gender, church);

  static String? getChurch() => _preferences.getString(_church);


  static Future setChurchCity(String churchCity) async =>
      await _preferences.setString(_gender, churchCity);

  static String? getChurchCity() => _preferences.getString(_churchCity);


  static Future setChurchState(String churchState) async =>
      await _preferences.setString(_gender, churchState);

  static String? getChurchState() => _preferences.getString(_churchState);


}


Register(Here the data should be updated)

class Register extends StatefulWidget {


  @override
  _RegisterState createState() => _RegisterState();
}

class _RegisterState extends State<Register> {
  late String? name = UserSimplePreferences.getName();

 // final user = UserSimplePreferences.getUser();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
     }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
    body:Container(
        child:  Column(
          children: [
            Card(
              child: Text(name??''),
            ),
            Card(
              child: Text(name??''),
            ),
            Card(
              child: Text(name??''),
            )
          ],

       )
      ),
      floatingActionButton: FloatingActionButton(
        backgroundColor: Colors.indigo[900],
        onPressed: () {
          Navigator.push(
            context,
            MaterialPageRoute(builder: (_) {
              return AddUser(idUser: '',);
            }),
          );
        },
        child: Icon(Icons.add, color: Colors.white),
      ),
    );

  }
}



AddUser(where user provides input)
class AddUser extends StatefulWidget {

  final String? idUser;


  const AddUser({required this.idUser});

  @override
  _AddUserState createState() => _AddUserState();

}

class _AddUserState extends State<AddUser> {

  final formKey = GlobalKey<FormState>();
  String name = '';
 String age = '';
 String gender= '';
 String church= '';
 String  churchCity= '';
  String churchState= '';

  @override
  void initState() {
    super.initState();

    // name = UserSimplePreferences.getName() ?? '';
    // age = UserSimplePreferences.getAge() ?? '';
    // gender = UserSimplePreferences.getGender() ?? '';
    // church = UserSimplePreferences.getChurch() ?? '';
    //  churchCity = UserSimplePreferences.getChurchCity() ?? '';
    // churchState = UserSimplePreferences.getChurchState() ?? '';

  }

  @override
  Widget build(BuildContext context) => Scaffold(
    appBar: AppBar(
      automaticallyImplyLeading: false,
      title : Text('Please Enter Your Details',textAlign: TextAlign.center,)),

    body: SafeArea(
          child: ListView(
        padding: EdgeInsets.all(16),
        children: [

          buildName(),
          const SizedBox(height: 12),
          buildAge(),
          const SizedBox(height: 12),
          buildGender(),
          const SizedBox(height: 12),
          buildChurch(),
          const SizedBox(height: 12),
          buildChurchCity(),
          const SizedBox(height: 12),
          buildChurchState(),
          const SizedBox(height: 12),

          buildButton(),
        ],
      ),
    ),
  );

  Widget buildName() =>

    buildTitle(
    title: 'Name',
    child: TextFormField(
      initialValue: name,
      decoration: InputDecoration(
        border: OutlineInputBorder(),
        hintText: 'Your Name',
      ),
      onChanged: (name) => setState(() => this.name = name),
    ),
  );

  Widget buildAge() => buildTitle(
    title: 'Age',
    child: TextFormField(
      initialValue: age,
      decoration: InputDecoration(
        border: OutlineInputBorder(),
        hintText: 'Your Age',
      ),
      onChanged: (age) => setState(() => this.age = age),
    ),
  );
  Widget buildGender() => buildTitle(
    title: 'Gender',
    child: TextFormField(
      initialValue: gender,
      decoration: InputDecoration(
        border: OutlineInputBorder(),
        hintText: 'Your gender(M/F)',
      ),
      onChanged: (gender) => setState(() => this.gender = gender),
    ),
  );
  Widget buildChurch() => buildTitle(
    title: 'Church',
    child: TextFormField(
      initialValue: church,
      decoration: InputDecoration(
        border: OutlineInputBorder(),
        hintText: 'Your church',
      ),
      onChanged: (church) => setState(() => this.church = church),
    ),
  );
  Widget buildChurchCity() => buildTitle(
    title: 'Church City',
    child: TextFormField(
      initialValue: churchCity,
      decoration: InputDecoration(
        border: OutlineInputBorder(),
        hintText: 'Your Church City',
      ),
      onChanged: (churchCity) => setState(() => this.churchCity = churchCity),
    ),
  );
  Widget buildChurchState() => buildTitle(
    title: 'Church State',
    child: TextFormField(
      initialValue: churchState,
      decoration: InputDecoration(
        border: OutlineInputBorder(),
        hintText: 'Your Church State',
      ),
      onChanged: (churchState) => setState(() => this.churchState = churchState),
    ),
  );


  Widget buildButton() => ButtonWidget(
      text: 'Save',
      onClicked: () async {

        await UserSimplePreferences.setName(name);
        await UserSimplePreferences.setAge(age);
        await UserSimplePreferences.setGender(gender);
        await UserSimplePreferences.setChurch(church);
        await UserSimplePreferences.setChurchCity(churchCity);
        await UserSimplePreferences.setChurchState(churchState);
             Navigator.pop(context);
      });

  Widget buildTitle({
    required String title,
    required Widget child,
  }) =>
      Column(
        crossAxisAlignment: CrossAxisAlignment.stretch,
        children: [
          Text(
            title,
            style: TextStyle(fontWeight: FontWeight.bold, fontSize: 18),
          ),
          const SizedBox(height: 8),
          child,
        ],
      );
}

CodePudding user response：

You build view first time, then load data. There is no view interaction on force setState so nothing is changed on this view. What do You can do now? You have 2 ways:

1. Run setState after load variables from shared_pref
2. Use FutureBuilder to render another widget before, and after loading data I suggest 2nd option