Can't Update a String Variable After initializing it in Flutter

Issue

I want to Update the new value of the 'holecode' variable in 'inputform.dart' then get this new value to the 'otpscreen.dart' The Problem that in each time I try to get the value of the 'holecode' string variable I get the 'default' value which I initialize it.I tried to make the 'holecode' variable as late String holecode; but it return Null in the second Screen in each time I try to get it's value.

inputform.dart:

import 'package:flutter/material.dart';
class Inputform extends StatefulWidget {
  List<String> code = ["","","","","",""];
  String holeCode = "default";
  @override
  State<Inputform> createState() => InputformState();
}

class InputformState extends State<Inputform> {
  @override
  Widget build(BuildContext context) {
    return TextFormField(
              onChanged: (value) {
                setState(() {
                  widget.code[0] = value;
                  widget.holeCode = widget.code[0] + 222205;
                });
                if (value.length == 1) {
                  FocusScope.of(context).nextFocus();
                 }
                }
               ),
              },

otp.dart:

import 'package:flutter/material.dart';

class OtpVerification extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => Otp();
}
class Otp extends State<OtpVerification> {
  final Inputform ani= new Inputform ();

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        child: 
            FlatButton(
              onPressed: () {
                // trying to print the new value in this screen but it 
                //return the default value 'default'
                print(ani.holeCode);
      ),
    );
  }

Solution

Try this:

Have your InputForm like so:

class Inputform extends StatefulWidget {
  final ValueChanged<String> onHoleCodeChanged;

  const Inputform({
    Key? key,
    required this.onHoleCodeChanged,
  }) : super(key: key);
  @override
  State<Inputform> createState() => InputformState();
}

class InputformState extends State<Inputform> {
  List<String> code = ["", "", "", "", "", ""];
  String holeCode = "default";
  @override
  Widget build(BuildContext context) {
    return TextFormField(onChanged: (value) {
      setState(() {
        code[0] = value;
        holeCode = code[0] + "222205";
        widget.onHoleCodeChanged(holeCode);
      });
      if (value.length == 1) {
        FocusScope.of(context).nextFocus();
      }
    });
  }
}

And have your OTP class like so:

class OtpVerification extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => Otp();
}

class Otp extends State<OtpVerification> {
  late Inputform ani;

  @override
  void initState() {
    ani = Inputform(
      onHoleCodeChanged: (v) {
        setState(() {
          aniHoleCode = v;
        });
      },
    );
    super.initState();
  }

  String aniHoleCode = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      body: FlatButton(
        child: Text("Button"),
        onPressed: () {print(aniHoleCode);},
      ),
    );
  }
}

Answered By - Josteve