Home > Software design >  textfield value should be remain while toogling one screen to another in flutter
textfield value should be remain while toogling one screen to another in flutter

Time:11-16

I have created a two screen ,expense screen and incomescreen with toogle button to switching expense screen to income screen and visa versa..

here I have a textfield for amount..and it's value should be not changed while shifting to another screen...

(I mean if change expense screen to income screen, amount should be not changed in textfield...

here is my main file


class _MyAppState extends State<MyApp> {
  bool isexpense=true;

  void toogleit()
  {

    setState(() {
      isexpense=!isexpense;
    });
  }

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: isexpense==true? ExpenseScreen(ontap: toogleit,txtvalue: '',):IncomeScreen(ontap: toogleit,txtvalue: '',)
    );

  }
}


and here is expense screen file..not including income screen as both almost same...

(I could make a CustomScreenWidget but don't want to make it....I am given task to solve without customewidget)

here is expense screen code

class ExpenseScreen extends StatefulWidget {
  final VoidCallback ontap;
  String txtvalue;
  ExpenseScreen({Key? key, required this.ontap,required this.txtvalue}) : super(key: key);

  @override
  State<ExpenseScreen> createState() => _ExpenseScreenState();
}

class _ExpenseScreenState extends State<ExpenseScreen> {
  TextEditingController txtcontroller = TextEditingController();

  @override
  void initState() {
    // TODO: implement initState
    super.initState();
    txtcontroller.text=widget.txtvalue;
  }

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

  @override
  Widget build(BuildContext context) {

    return Scaffold(
      backgroundColor: Colors.grey,
      body: Center(
        child: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 20.0),
          child: Container(
            height: 300,
            decoration: kboxdecoration1,
            child: Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  IntrinsicWidth(
                    child: Padding(
                      padding: const EdgeInsets.symmetric(horizontal: 40.0),
                      child: TextField(
                        onChanged: (x) {
                          setState(() {


                          });
                        },
                        controller: txtcontroller,
                        keyboardType: TextInputType.number,
                        textAlign: TextAlign.center,
                        style: TextStyle(
                          fontSize: 30,
                        ),
                        decoration: kinputdecoration1.copyWith(
                            hintText:
                            txtcontroller.text == '' ? 'Amount' : null),
                      ),
                    ),
                  ),
                  SizedBox(
                    height: 10,
                  ),
                  ElevatedButton(
                      style: kelevetedbutton1,
                      onPressed: () {},
                      child: Text('Save Expense')),
                  SizedBox(
                    height: 10,
                  ),
                  TextButton(
                      onPressed: widget.ontap, child: Text('Jump To Income')),
                ],
              ),
            ),
          ),
        ),
      ),
    );
  }
}

CodePudding user response:

You need to update your callback to update txtvalue like this:

class ExpenseScreen extends StatefulWidget {
  final Function(String) ontap;
  String txtvalue;
  ExpenseScreen({Key? key, required this.ontap,required this.txtvalue}) : super(key: key);

  @override
  State<ExpenseScreen> createState() => _ExpenseScreenState();
}

then on your onPressed do this:

TextButton(
     onPressed: (){
       widget.ontap(txtcontroller.text);
     }, child: Text('Jump To Income'),
),

then in your MainScreen first define a variable and do this:

String txtvalue = '';

void toogleit(String value)
  {

    setState(() {
      txtvalue = value;
      isexpense=!isexpense;
      
    });
  }

and also change this in your mainscreen :

home: isexpense==true? ExpenseScreen(ontap: toogleit,txtvalue: txtvalue,):IncomeScreen(ontap: toogleit,txtvalue: txtvalue,)

CodePudding user response:

Two ways to do it,

  1. Use constructor, as pointed by @eamirho3ein & pass it along when accessing second screen

  2. Create another Dart file and save the value as static there, for example, create a file ApplicationData and store the value as static for amount. Ensure whenever screen change is happening then store the current amount value in static field for ApplicationData.amount.

Access it anywhere.

  • Related