Flutter 在Flatter中按按钮以列表形式插入新的小部件

我正在制作一个这样的屏幕，可以从电话簿中选择联系人，并将姓名作为列表插入我的应用程序中。我想要的是，当我按下添加医务人员（+）按钮时，它应该选择一个联系人并显示姓名。 我为MOM部分制作了一个小部件，但每当我点击按钮时，它就会将MOM改写为我从电话簿中选择的任何联系人

我制作了这个屏幕：

我也想以和妈妈一样的方式添加爸爸和妹妹的联系方式，但我无法这样做

这是我的屏幕代码：

import 'package:epicare/NavigBar.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:flutter_switch/flutter_switch.dart';
import 'package:permission_handler/permission_handler.dart';
import 'package:contact_picker/contact_picker.dart';

//Check contacts permission
Future<PermissionStatus> _getPermission() async {

  final PermissionStatus permission = await Permission.contacts.status;
  if (permission != PermissionStatus.granted &&
      permission != PermissionStatus.denied) {
    final Map<Permission, PermissionStatus> permissionStatus =
    await [Permission.contacts].request();
    return permissionStatus[Permission.contacts] ??
        PermissionStatus.undetermined;
  } else {
    return permission;
  }
}


class CaregiverScreen extends StatefulWidget {
  @override
  _CaregiverScreenState createState() => _CaregiverScreenState();
}

class _CaregiverScreenState extends State<CaregiverScreen> {
  final ContactPicker _contactPicker = new ContactPicker();
  Contact _contact;

  final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
  bool isSwitched = true;
  @override
  Widget build(BuildContext context) {
    //Size size = MediaQuery.of(context).size;
    return Scaffold(
      key: _scaffoldKey,
      backgroundColor: Colors.white,
      appBar: AppBar(
        backgroundColor: const Color(0xffE5E0A1),
        elevation: 0,
        centerTitle: true,
        title: Text(
          "Add Caregiver",
          style: TextStyle(
            fontSize: 15.0,
            color: Colors.black,
            fontFamily: 'Montserrat',
            fontWeight: FontWeight.normal,
          ),
        ),
        leading: IconButton(
          icon: Icon(
            Icons.arrow_back,
            color: Colors.black,
          ),
          onPressed: () {
            Navigator.push(
              context,
              MaterialPageRoute(
                builder: (context) {
                  return Homepage();
                },
              ),
            );
          },
        ),
      ),
      body: SingleChildScrollView(
        child: Container(
          padding: EdgeInsets.symmetric(horizontal: 10, vertical: 40),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            children: [
              Row(
                children: [
                  MaterialButton(
                    onPressed: () async {

                      final PermissionStatus permissionStatus = await _getPermission();
                      if (permissionStatus == PermissionStatus.granted) {
                        //We can now access our contacts here
                        // var contactNumber = openContactBook();
                        Contact contact = await _contactPicker.selectContact();
                        setState(() {
                          _contact = contact;
                        });
                      }
                      else {
                        //If permissions have been denied show standard cupertino alert dialog
                        showDialog(
                            context: context,
                            builder: (BuildContext context) => CupertinoAlertDialog(
                              title: Text('Permissions error'),
                              content: Text('Please enable contacts access '
                                  'permission in system settings'),
                              actions: <Widget>[
                                CupertinoDialogAction(
                                  child: Text('OK'),
                                  onPressed: () => Navigator.of(context).pop(),
                                )
                              ],
                            ));
                      }
                    },
                    color: const Color(0xffd4d411),
                    textColor: Colors.white,
                    child: Icon(
                      Icons.add,
                      size: 32,
                    ),
                    padding: EdgeInsets.all(3),
                    shape: CircleBorder(),
                  ),
                  Text(
                    'Add a Caregiver',
                    style: TextStyle(
                        fontFamily: 'Montserrat',
                        fontSize: 13,
                        color: const Color(0xff000000),
                        height: 1.5384615384615385,
                        fontWeight: FontWeight.w600),
                    textHeightBehavior:
                        TextHeightBehavior(applyHeightToFirstAscent: false),
                    textAlign: TextAlign.left,
                  )
                ],
              ),
                _contact == null ? Container() : CaregiversList(_contact.fullName),
            ],
          ),
        ),
      ),
    );
  }
Widget CaregiversList(String name){
    print(name);
    var c = name.split(' ');
    print(c[0]);
    var caregiver = c[0];
    var output = getInitials(string: caregiver, limitTo: 1);
    print(output);
    // var i = caregiver.codeUnitAt(0);
    // print(i);
    return Container(
    padding: EdgeInsets.symmetric(vertical: 20, horizontal: 27),
    child: Row(
      //crossAxisAlignment: CrossAxisAlignment.center,
      //mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        CircleAvatar(
          radius: 24,
          backgroundColor: const Color(0xffd4d411),
          child: CircleAvatar(
            radius: 22,
            backgroundColor: Colors.white,
            child: Text(
              output,
              style: TextStyle(
                fontFamily: 'Segoe UI',
                fontSize: 20,
                color: const Color(0xff000000),
              ),
            ),
          ),
        ),
        SizedBox(width: 19),
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              caregiver,
              style: TextStyle(
                  fontFamily: 'Montserrat',
                  fontSize: 13,
                  color: const Color(0xff000000),
                  height: 1.5384615384615385,
                  fontWeight: FontWeight.w600),
              textHeightBehavior: TextHeightBehavior(
                  applyHeightToFirstAscent: false),
              textAlign: TextAlign.left,
            ),
            isSwitched
                ? Text(
                    "Activated",
                    style: TextStyle(
                        fontFamily: 'Montserrat',
                        fontSize: 10,
                        color: const Color(0x80232425),
                        fontWeight: FontWeight.w500),
                    textAlign: TextAlign.left,
                  )
                : Text(
                    "Disabled",
                    style: TextStyle(
                        fontFamily: 'Montserrat',
                        fontSize: 10,
                        color: const Color(0x80232425),
                        fontWeight: FontWeight.w500),
                    textAlign: TextAlign.left,
                  ),
          ],
        ),
        SizedBox(width: 143),
        FlutterSwitch(
          width: 40.0,
          height: 20.0,
          value: isSwitched,
          toggleSize: 15,
          borderRadius: 40.0,
          padding: 2.0,
          showOnOff: false,
          activeColor: const Color(0xffd4d411),
          activeToggleColor: Colors.white,
          inactiveColor: const Color(0xffDDDBAF),
          inactiveToggleColor: Colors.white,
          onToggle: (value) {
            setState(() {
              isSwitched = value;
              print(isSwitched);
            });
          },
        ),
      ],
    ),
  );

}
  String getInitials({String string, int limitTo}) {
    var buffer = StringBuffer();
    var split = string.split(' ');
    for (var i = 0 ; i < (limitTo ?? split.length); i ++) {
      buffer.write(split[i][0]);
    }
    return buffer.toString();
  }
}

import'包：epicare/NavigBar.dart'；
进口“包装：颤振/cupertino.dart”；
进口“包装：颤振/材料.省道”；
进口“包装：颤振开关/颤振开关.省道”；
导入“package:permission_handler/permission_handler.dart”；
导入“包：联系_picker/contact_picker.dart”；
//检查联系人权限
Future\u getPermission（）异步{
最终许可状态许可=等待许可.contacts.status；
if（permission！=PermissionStatus.grated&&
权限！=权限状态。拒绝）{
最终地图许可状态=
等待[Permission.contacts].request（）；
返回permissionStatus[权限.联系人]？？
许可状态。未确定；
}否则{
返回许可；
}
}
类医务人员屏幕扩展StatefulWidget{
@凌驾
_医务人员屏幕状态createState（）=>\u医务人员屏幕状态（）；
}
类_\screenstate扩展状态{
最终接触器选择器_接触器选择器=新接触器选择器（）；
联系人(u Contact);；
最终GlobalKey _scaffoldKey=新的GlobalKey（）；
bool isSwitched=true；
@凌驾
小部件构建（构建上下文）{
//Size Size=MediaQuery.of（context）.Size；
返回脚手架(
钥匙：_scaffoldKey，
背景颜色：Colors.white，
appBar:appBar(
背景颜色：常量颜色（0xffE5E0A1），
海拔：0，
标题：对，
标题：正文(
“添加医务人员”，
样式：TextStyle(
字体大小：15.0，
颜色：颜色，黑色，
fontFamily：“蒙特塞拉特”，
fontWeight:fontWeight.normal，
),
),
领先：IconButton(
图标：图标(
Icons.arrow_back，
颜色：颜色，黑色，
),
已按下：（）{
导航器。推(
上下文
材料路线(
生成器：（上下文）{
返回主页（）；
},
),
);
},
),
),
正文：SingleChildScrollView(
子：容器(
填充：边缘组。对称（水平：10，垂直：40），
子：列(
crossAxisAlignment:crossAxisAlignment.start，
儿童：[
划船(
儿童：[
材料按钮(
onPressed:（）异步{
最终许可状态PermissionStatus=等待_getPermission（）；
if（permissionStatus==permissionStatus.grated）{
//我们现在可以在这里访问我们的联系人
//var contactNumber=openContactBook（）；
Contact Contact=wait_Contact picker.选择Contact（）；
设置状态（）{
_接触=接触；
});
}
否则{
//如果权限被拒绝，则显示标准cupertino警报对话框
显示对话框(
上下文：上下文，
生成器：（BuildContext上下文）=>CupertinoAlertDialog(
标题：文本（“权限错误”），
内容：文本（'请启用联系人访问'
“系统设置中的权限”），
行动：[
铜中毒(
子项：文本（'OK'），
onPressed:（）=>Navigator.of（context.pop（），
)
],
));
}
},
颜色：常量颜色（0xFFD411），
textColor:Colors.white，
子：图标(
Icons.add，
尺码：32，
),
填充：边缘设置。全部（3），
形状：CircleBorder（），
),
正文(
“添加医务人员”，
样式：TextStyle(
fontFamily：“蒙特塞拉特”，
尺寸：13，
颜色：常量颜色（0xff000000），
身高：1.538461538415385，
fontWeight:fontWeight.w600），
文本高度行为：
TextHeightBehavior（ApplyHeightToFirstAscend:false），
textAlign:textAlign.left，
)
],
),
_contact==null？Container（）：医务人员列表（_contact.fullName），
],
),
),
),
);
}
小部件医务人员列表（字符串名称）{
印刷品（姓名）；
var c=名称。拆分（“”）；
打印（c[0]）；
var护理者=c[0]；
var输出=getInitials（字符串：医务人员，限制为：1）；
打印（输出）；
//var i=护理者代码单位（0）；
//印刷品（一）；
返回容器(
填充：边缘组。对称（垂直：20，水平：27），
孩子：排(
//crossAxisAlignment:crossAxisAlignment.center，
//mainAxisAlignment:mainAxisAlignment.spaceBetween，
儿童：[
圆形(
半径：24，
背景颜色：常量颜色（0xFFD441），
芝加哥
class Caregiver {
  String name;
  bool isActive;
  
  Caregiver({this.name, this.isActive});
  
  factory Caregiver.fromJson(Map<String, dynamic> map) {
    if (map == null) return null;
    return Caregiver(name: map['name'] ?? "", 
                     isActive: map['isActive']);
  }
}

List<Caregiver> _careList = [];

Contact contact = await _contactPicker.selectContact();
setState(() {
  _careList.add(Caregiver(name: contact, isActive: true));
});

ListView.separated(
 physics: NeverScrollableScrollPhysics(),
 shrinkWrap: true,
 primary: false,
itemBuilder: (context, index) {        
  return _caregiverWidget(index);
},
separatorBuilder: (_, __) => Divider(),
itemCount: _careList.length);

Widget _caregiverWidget(int index) {
  Caregiver _caregiver = _careList[index];
  print(_caregiver.name);
  var c = _caregiver.name.split(' ');
  print(c[0]);
  var caregiver = c[0];
  var output = getInitials(string: caregiver, limitTo: 1);
  print(output);
  // var i = caregiver.codeUnitAt(0);
  // print(i);
  return Container(
    padding: EdgeInsets.symmetric(vertical: 20, horizontal: 27),
    child: Row(
      //crossAxisAlignment: CrossAxisAlignment.center,
      //mainAxisAlignment: MainAxisAlignment.spaceBetween,
      children: <Widget>[
        CircleAvatar(
          radius: 24,
          backgroundColor: const Color(0xffd4d411),
          child: CircleAvatar(
            radius: 22,
            backgroundColor: Colors.white,
            child: Text(
              output,
              style: TextStyle(
                fontFamily: 'Segoe UI',
                fontSize: 20,
                color: const Color(0xff000000),
              ),
            ),
          ),
        ),
        SizedBox(width: 19),
        Column(
          crossAxisAlignment: CrossAxisAlignment.start,
          children: [
            Text(
              caregiver,
              style: TextStyle(
                  fontFamily: 'Montserrat',
                  fontSize: 13,
                  color: const Color(0xff000000),
                  height: 1.5384615384615385,
                  fontWeight: FontWeight.w600),
              textHeightBehavior:
                  TextHeightBehavior(applyHeightToFirstAscent: false),
              textAlign: TextAlign.left,
            ),
            _caregiver.isActive
                ? Text(
                    "Activated",
                    style: TextStyle(
                        fontFamily: 'Montserrat',
                        fontSize: 10,
                        color: const Color(0x80232425),
                        fontWeight: FontWeight.w500),
                    textAlign: TextAlign.left,
                  )
                : Text(
                    "Disabled",
                    style: TextStyle(
                        fontFamily: 'Montserrat',
                        fontSize: 10,
                        color: const Color(0x80232425),
                        fontWeight: FontWeight.w500),
                    textAlign: TextAlign.left,
                  ),
          ],
        ),
        SizedBox(width: 143),
        FlutterSwitch(
          width: 40.0,
          height: 20.0,
          value: _caregiver.isActive,
          toggleSize: 15,
          borderRadius: 40.0,
          padding: 2.0,
          showOnOff: false,
          activeColor: const Color(0xffd4d411),
          activeToggleColor: Colors.white,
          inactiveColor: const Color(0xffDDDBAF),
          inactiveToggleColor: Colors.white,
          onToggle: (value) {
            setState(() {
              _caregiver.isActive = value;
              _careList.removeAt(index);
              _careList.insert(index, _caregiver);
            });
          },
        ),
      ],
    ),
  );
}