How can I take the title of the selected checkbox and pass it to another screen?

Viewed 76

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(''),
    );
  }
}

1 Answers

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