How to pass data from child widget to parent widget using provider or valuenotifier in flutter

Question

Here is my parent widget.

class AddUserextends StatefulWidget {
  final ScrollController controller;
  AddUser(this.controller);

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

class _AddUserToManagePropertyState extends State<AddUserToManageProperty> {
  late TextEditingController _firstNameCtrl;
  late TextEditingController _lastNameCtrl;
  late TextEditingController _phoneNoCtrl;
  late ValueNotifier<num?> _category;


  final _scaffoldKey = GlobalKey<ScaffoldState>();
  final _formKey = GlobalKey<FormState>();

  final ValueNotifier<bool> _formStateEmitter = ValueNotifier(false);
  final ValueNotifier<bool> isSelected = ValueNotifier(false);

  @override
  void initState() {
    super.initState();
    _firstNameCtrl = TextEditingController(text: '');
    _lastNameCtrl = TextEditingController(text: '');
    _phoneNoCtrl = TextEditingController(text: '');

    _firstNameCtrl.addListener(() {
      _formStateEmitter.value = _fieldsStatus();
    });
    _lastNameCtrl.addListener(() {
      _formStateEmitter.value = _fieldsStatus();
    });
    _phoneNoCtrl.addListener(() {
      _formStateEmitter.value = _fieldsStatus();
    });

  }

  bool _fieldsStatus() {
    return HwValidators.required(_firstNameCtrl.text) == null &&
        HwValidators.required(_lastNameCtrl.text) == null &&
        HwValidators.required(_phoneNoCtrl.text) == null;
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      key: _scaffoldKey,
      appBar: HwAppBar(
        title: 'Add team member',
      ),
      body: Form(
        key: _formKey,
        child: FormWidget(
          maintainSafeArea: false,
          showBackBtn: false,
          fields: [
            HwTextField(
              label: 'FIRST NAME',
              controller: _firstNameCtrl,
              validator: HwValidators.nameValidator,
              keyboardType: TextInputType.text,
            ),
            HwSizedBox(height: 4),
            HwTextField(
              label: 'LAST NAME',
              controller: _lastNameCtrl,
              validator: HwValidators.nameValidator,
              keyboardType: TextInputType.text,
            ),
            HwSizedBox(height: 4),
            HwTextField(
              label: 'PHONE NO',
              controller: _phoneNoCtrl,
              validator: HwValidators.phoneValidator,
              keyboardType: TextInputType.phone,
            ),
            HwSizedBox(height: 4),
            HwSizedBox(height: 4),
            HwText('ACCESS LEVEL'),
            UserAccessListTiles(),
            HwSizedBox(
              height: 4,
            ),
          ],
        ),
      ),
    );
  }
}

The second last widget is UserAccessListTiles which is a widget that allows user to choose from two set of widgets like this:

class UserAccessListTiles extends StatelessWidget {
  List _userAccessListTile = [
    SelectableTile(
      title: 'Access to all stories',
      leading: SvgPicture.asset(HwSvgs.fullAccess),
      trailing: null,
    ),
    SelectableTile(
        title: 'Custom access',
        leading: SvgPicture.asset(HwSvgs.customAccess),
        trailing: null),
  ];

  final ValueNotifier<int> _selected = ValueNotifier(0);

  @override
  Widget build(BuildContext context) {
    return ValueListenableBuilder(
        valueListenable: _selected,
        builder: (context, int value, child) {
          return Column(
            children: [
              Container(
                child: ListView.builder(
                  shrinkWrap: true,
                  physics: NeverScrollableScrollPhysics(),
                  itemCount: 2,
                  itemBuilder: (context, index) {
                    return Column(
                      children: [
                        HwSizedBox(
                          height: 3,
                        ),
                        InkWell(
                          onTap: () {
                            _selected.value = index;
                          },
                          child: Container(
                            decoration: BoxDecoration(
                                border: Border.all(
                                  width: value == index ? 2 : 1,
                                  color: value == index
                                      ? HwColors.green
                                      : HwColors.divider,
                                ),
                                borderRadius: BorderRadius.circular(8.0)),
                            child: SelectableTile(
                              title: _userAccessListTile[index].title,
                              leading: _userAccessListTile[index].leading,
                              trailing: value == index
                                  ? SvgPicture.asset(HwSvgs.greenCheck)
                                  : null,
                            ),
                          ),
                        ),
                      ],
                    );
                  },
                ),
              ),
              _selected.value == 0 ? UserAccessListTilesRadio() : CustomAccess(),
            ],
          );
        });
  }
}

And finally both these widgets UserAccessListTilesRadio() and CustomAccess() have a set of RadioListTile that user can choose from and I want that chosen option to be available in the original parent widget as part of the Form.

How can I do it, please help.

Answer 1

I would recommend you to use state management i.e Bloc or Provider

e.g Provider Make a model that extends ChangeNotifierProvider

class MyProviderModel extends ChangeNotifierProvider{
int yourChosenValue;

 void updateChosenValue() {
   // Your logic
   notifyListeners();
 }
}

Init Provider in your Parent Widget

Provider(
  create: (_) => MyProviderModel(),
  child: Consumer<MyProviderModel>(
   builder: (_, a, child) {
      return // Your Form
    },
 )
)

Update Your MyProviderModel in your child Widget

context.read<MyProviderModel>().updateChosenValue();

Init Provider in your parent Widget