如何使用按钮将项目添加到动态列表到另一个带有列表的屏幕？

Question

我还不太熟悉 flutter 和一般的编码。我在这里也很新，所以对于我在发布问题时可能犯的任何错误，我深表歉意。此外，如果需要，我使用 android studio。
为了更具描述性，我想使用 sharedPreferences 将从 1stScreen 的 4 个文本字段中获取的数据保存为数组并将它们添加到列表中第二个屏幕。一个什么都没有的列表，如果保存了第一个屏幕的数据，则列表将显示 1 个包含已保存数据的项目。
这是我乱七八糟的代码：

import 'package:flutter/material.dart';
import 'package:shared_preferences/shared_preferences.dart';
import 'package:flutter/services.dart';
import 'package:provider/provider.dart';

class ListProvider extends ChangeNotifier {
  List<String> litems = List<String>();

  List<String> get Items =>
      this.litems;

  set logList(List<String> value) {
    litems = value;
    notifyListeners();
  }
}
void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(

        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;

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

class _MyHomePageState extends State<MyHomePage> with ChangeNotifier {
  TextEditingController firstname = TextEditingController();
  TextEditingController lastname = TextEditingController();
  TextEditingController birthday = TextEditingController();
  TextEditingController address = TextEditingController();
  //


  String data = "";
  String data1 = "";
  String data2 = "";
  String data3 = "";
  String firstname1 = "f";
  String lastname1 = "l";
  String birthday1 = "";
  String address1 = "";



  Future<bool>saveData() async{
    SharedPreferences preferences = await SharedPreferences.getInstance();
    return await preferences.setString(firstname1, firstname.text);
  }
  Future<bool>saveData1() async{
    SharedPreferences preferences1 = await SharedPreferences.getInstance();
    return await preferences1.setString(lastname1, lastname.text);
  }
  Future<bool>saveData2() async{
    SharedPreferences preferences = await SharedPreferences.getInstance();
    return await preferences.setString(birthday1, birthday.text);
  }
  Future<bool>saveData3() async{
    SharedPreferences preferences1 = await SharedPreferences.getInstance();
    return await preferences1.setString(address1, address.text);
  }

///////////

  Future<String> loadData() async{
    SharedPreferences preferences = await SharedPreferences.getInstance();
    return preferences.getString(firstname1);
  }
  Future<String> loadData1() async{
    SharedPreferences preferences2 = await SharedPreferences.getInstance();
    return preferences2.getString(lastname1);
  }
  Future<String> loadData2() async{
    SharedPreferences preferences = await SharedPreferences.getInstance();
    return preferences.getString(birthday1);
  }
  Future<String> loadData3() async{
    SharedPreferences preferences2 = await SharedPreferences.getInstance();
    return preferences2.getString(address1);
  }


  setData(){
    loadData().then((value){
      setState(() {
        data = value;
      });
    });
  }
  setData1(){
    loadData1().then((value){
      setState(() {
        data1 = value;
      });
    });
  }
  setData2(){
    loadData2().then((value){
      setState(() {
        data2 = value;
      });
    });
  }
  setData3(){
    loadData3().then((value){
      setState(() {
        data3 = value;

      });
    });
  }

  add(screen2){
    screen2.litems.add(data);
    notifyListeners();
    setState(() {

    });
  }




  @override
  Widget build(BuildContext context) {

    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.spaceAround,
          children: <Widget>[
            TextField(
              controller: firstname,
              decoration: InputDecoration(
                  hintText: "FIRST NAME"
              ),
            ),
            TextField(
              controller: lastname,
              decoration: InputDecoration(
                  hintText: "LAST NAME"
              ),
            ),
            TextField(
              controller: birthday,
              decoration: InputDecoration(
                  hintText: "BIRTHDAY"
              ),
            ),
            TextField(
              controller: address,
              decoration: InputDecoration(
                  hintText: "ADDRESS"
              ),
            ),
            RaisedButton(
              onPressed: (){
                saveData();
                saveData1();
                saveData2();
                saveData3();
                setData();
                setData1();
                setData2();
                setData3();
                add(screen2());
              },
              child: Text("ADD"),
            ),
            RaisedButton(
              onPressed: (){
                Navigator.push(
                  context,
                  MaterialPageRoute(builder: (context) => screen2()),
                );
              },
              child: Text("SHOW ALL"),
            ),
          ],
        ),
      ),
    );
  }
}

这是我需要从中访问列表的第二个屏幕。

摘自 this

的代码片段

    class screen2 extends StatefulWidget {
      @override
      State createState() => new DyanmicList();
    }

    class DyanmicList extends State<screen2> with ChangeNotifier {
      List<String> litems = [];




      final TextEditingController eCtrl = new TextEditingController();
      @override
      Widget build (BuildContext ctxt) {
        return new Scaffold(
            appBar: new AppBar(title: new Text("Screen2"),),
            body: new Column(
              children: <Widget>[
                new TextField(
                  controller: eCtrl,
                  onSubmitted: (text) {
                    litems.add(text);
                    eCtrl.clear();
                    setState(() {});
                  },
                ),
                new Expanded(
                    child: new ListView.builder
                      (
                        itemCount: litems.length,
                        itemBuilder: (BuildContext ctxt, int Index) {
                          return new Text(litems[Index]);
                        }
                    )
                )
              ],
            )
        );
      }
    }

Answer 1

在屏幕 1 中，当按下提交按钮时，将 4 个信息添加到列表中并存储到 sharedPreferences。

屏幕 1

var list = List<Info>();
        ...
list.add(Info(firstName,lastName,birthday,address));
prefs.storeList(json.encode(list));

信息

class Info {
  String firstName;
  String lastName;
  String birthday;
  String address;

  Info(this.firstName, this.lastName,this.birthday,this.address);
}

SharedPreferences

     Future storeList(String info) async {
        SharedPreferences prefs = await SharedPreferences.getInstance();
        prefs.setString(INFO, info);
      }
    
   Future getListFromSharedPreferences() async {
    SharedPreferences prefs = await SharedPreferences.getInstance();
    return prefs.getString(INFO);
  }

屏幕 2

在屏幕 2 小部件构建中，使用 FutureBuilder 从 sharedPreferences 获取列表。

 FutureBuilder(
        future: sharedPreferences.getListFromSharedPreferences(),
        builder: (context, snapshot) {
          if (snapshot.hasData) {
            return ListView.builder(
                itemCount: (jsonDecode(snapshot.data)).length,
                itemBuilder: (BuildContext ctxt, int index) {
                  return new Text(jsonDecode(snapshot.data)[index]);
                });
          } else {
            return Text("No data");
          }
        });

Answer 2

如果您想使用 SharedPreferences 来保存 List of String，您可以使用 setStringList() 而不是 setString() 您可以通过以下方式实现。

在您的第一个屏幕上，

RaisedButton(
      onPressed: (){
         List<String> _userData = [];
        _userData.add(firstname.text);
        _userData.add(lastname.text);
        _userData.add(birthday.text);
        _userData.add(address.text);
               
        SharedPreferences myPrefs = await SharedPreferences.getInstance();
        myPrefs.setStringList("user", _userData);
              },
       child: Text("ADD"),

然后在第二个屏幕上

class screen2 extends StatefulWidget {
      @override
      State createState() => new DyanmicList();
    }

    class DyanmicList extends State<screen2> {
      List<String> litems = [];



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

getUser() async{
SharedPreferences myPrefs = await SharedPreferences.getInstance();
var userData=  myPrefs.getStringList("user");
setState((){
litems = userData;
});
}

      final TextEditingController eCtrl = new TextEditingController();
      @override
      Widget build (BuildContext ctxt) {
        return new Scaffold(
            appBar: new AppBar(title: new Text("Screen2"),),
            body: new Column(
              children: <Widget>[
                new TextField(
                  controller: eCtrl,
                  onSubmitted: (text) {
                    litems.add(text);
                    eCtrl.clear();
                    setState(() {});
                  },
                ),
                new Expanded(
                    child: new ListView.builder
                      (
                        itemCount: litems.length,
                        itemBuilder: (BuildContext ctxt, int Index) {
                          return new Text(litems[Index]);
                        }
                    )
                )
              ],
            )
        );
      }
    }

如何使用按钮将项目添加到动态列表到另一个带有列表的屏幕？

How do I add an item to a dynamic-list, using a button, to another screen with the list?

arrays

listview

sharedpreferences

dart

flutter