Home > Back-end >  How can I take the title of the selected checkbox and pass it to another screen?
How can I take the title of the selected checkbox and pass it to another screen?

Time:04-29

In the application, the initial screen is ResultScreen. It displays the data that users enter on the second screen. It can be accessed by clicking on the Enter data button. I want the selected checkbox title to be displayed on another screen, similar to what I did with the text field. How can i do this? Text Screen:

import 'package:flutter/material.dart';
import 'package:flutter_application_1/screens/result_screen.dart';

class TextScreen extends StatefulWidget {
  const TextScreen({Key? key}) : super(key: key);

  @override
  State<TextScreen> createState() => _TextScreenState();
}

class _TextScreenState extends State<TextScreen> {
  bool privacy = false;
  bool terms_of_use = false;
  TextEditingController textController = TextEditingController();

  @override
  void dispose() {
    textController.dispose();
    super.dispose();
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Enter data'),
      ),
      body: Padding(
          padding: const EdgeInsets.symmetric(horizontal: 16.0),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.start,
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              TextField(
                controller: textController,
                decoration: InputDecoration(labelText: 'Message'),
              ),
              const SizedBox(
                height: 20,
              ),
              CheckboxListTile(
                title: const Text('Privacy'),
                controlAffinity: ListTileControlAffinity.leading,
                value: privacy,
                onChanged: (value) {
                  setState(() {
                    privacy = value!;
                  });
                },
                contentPadding: EdgeInsets.zero,
              ),
              CheckboxListTile(
                title: const Text('Terms of use'),
                controlAffinity: ListTileControlAffinity.leading,
                value: terms_of_use,
                onChanged: (value) {
                  setState(() {
                    terms_of_use = value!;
                  });
                },
                contentPadding: EdgeInsets.zero,
              ),
              ElevatedButton(
                  onPressed: () {
                    Navigator.push(
                        context,
                        MaterialPageRoute(
                            builder: (context) =>
                                ResultScreen(textController.text)));
                  },
                  child: Text('Display result'))
            ],
          )),
    );
  }
}

Result Screen:

import 'package:flutter/material.dart';
import 'package:flutter_application_1/screens/text_screen.dart';

class ResultScreen extends StatefulWidget {
  final String valueText;
  ResultScreen(this.valueText);

  @override
  State<ResultScreen> createState() => _ResultScreenState();
}

class _ResultScreenState extends State<ResultScreen> {
  // navigation to text_screen
  void _buttonNav() {
    Navigator.push(
        context, MaterialPageRoute(builder: (context) => const TextScreen()));
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Results'),
      ),
      body: Center(
          child: Column(
        mainAxisAlignment: MainAxisAlignment.center,
        children: [
          ElevatedButton(
              onPressed: _buttonNav, child: const Text('Enter data')),
          const SizedBox(
            height: 50,
          ),
          Text('Message: '   widget.valueText),
          const SizedBox(
            height: 20,
          ),
          Text('Checkboxes:')
        ],
      )),
    );
  }
}

Main Dart:

import 'package:flutter/material.dart';
import 'package:flutter_application_1/screens/result_screen.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({Key? key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: ResultScreen(''),
    );
  }
}

CodePudding user response:

I will use your same example. You can try this: Declare a variable String? saveTitle;

then:

 CheckboxListTile(
            title: const Text('Privacy'),
            controlAffinity: ListTileControlAffinity.leading,
            value: privacy,
            onChanged: (value) {
              setState(() {
                privacy = value!;
                saveTitle= 'Privacy';
              });
            },
            contentPadding: EdgeInsets.zero,
          ),
          CheckboxListTile(
            title: const Text('Terms of use'),
            controlAffinity: ListTileControlAffinity.leading,
            value: terms_of_use,
            onChanged: (value) {
              setState(() {
                terms_of_use = value!;
                 saveTitle= 'Terms of use';
              });
            },
            contentPadding: EdgeInsets.zero,
          ),

in the button:

ElevatedButton(
                  onPressed: () {
                    Navigator.push(
                        context,
                        MaterialPageRoute(
                            builder: (context) =>
                                ResultScreen(textController.text, saveTitle!)));
                  },
                  child: Text('Display result'))

And you do the same as you did in your example

-------------------UPDATE-------------------- If you want save one or two values, you can try this:

Declare a variable:

String? saveFirstValue;
  String? saveSecondValue;

then:

CheckboxListTile(
            title: const Text('Privacy'),
            controlAffinity: ListTileControlAffinity.leading,
            value: privacy,
            onChanged: (value) {
              setState(() {
                privacy = value!;
                saveFirstValue= 'Privacy';
              });
            },
            contentPadding: EdgeInsets.zero,
          ),
          CheckboxListTile(
            title: const Text('Terms of use'),
            controlAffinity: ListTileControlAffinity.leading,
            value: terms_of_use,
            onChanged: (value) {
              setState(() {
                terms_of_use = value!;
                 saveSecondValue= 'Terms of use';
              });
            },
            contentPadding: EdgeInsets.zero,
          ),

in the button:

    ElevatedButton(
       onPressed: () {
        if (saveFirstValue!.isNotEmpty && 
saveSecondValue!.isNotEmpty) {
          String bothValues = "$saveFirstValue $saveSecondValue";
          Navigator.push(
              context,
              MaterialPageRoute(
                  builder: (context) =>
                      ResultScreen(textController.text, 
                     bothValues,
                      ),
                    ),
                 );
        } else {
          if (saveFirstValue!.isNotEmpty) {
            Navigator.push(
                context,
                MaterialPageRoute(
                    builder: (context) =>
                        ResultScreen(textController.text, 
                        saveFirstValue!,
                    ),
                 ),
               );
          } else if(saveSecondValue!.isNotEmpty){
            Navigator.push(
                        context,
                        MaterialPageRoute(
                            builder: (context) =>
                                ResultScreen(textController.text, saveSecondValue!,
                       ),
                     ),
                    );
                  },
                }
               },
               child: Text('Display result'))
  • Related