Flutter - How to get this GPA Calculator working?

Question

I'm trying to create a GPA Calculator app. The problem I'm facing is that I don't know how can I do some calculation (all courses points/number of courses) and then print the value in a text widget. I'm using a text controller for each field, but I need help to display the values. I created a future void but i dont know how to display the value in a text widget. Please check the picture of the app below:

class GPA_Calc extends StatefulWidget {
  const GPA_Calc({super.key});

  @override
  State<GPA_Calc> createState() => _GPA_CalcState();
}

class _GPA_CalcState extends State<GPA_Calc> {
  
  final c1 = TextEditingController();
  final c2 = TextEditingController();
  final c3 = TextEditingController();
  final c4 = TextEditingController();
  final c5 = TextEditingController();
  final c6 = TextEditingController();

  Future<double> calgpa() async {
    late int cv1 = int.parse(c1.text);
    late int cv2 = int.parse(c2.text);
    late int cv3 = int.parse(c3.text);
    late int cv4 = int.parse(c4.text);
    late int cv5 = int.parse(c5.text);
    late int cv6 = int.parse(c6.text);
    var gpa = (cv1+cv2+cv3+cv4+cv5+cv6)/(6) ;
    return gpa;
 }


  @override
  Widget build(BuildContext context) {
    return Column(
      children: [
        Padding(
          padding: EdgeInsets.all(10),
          child: TextField(
            onChanged:(value) => 0,
            keyboardType: TextInputType.number,
            controller: c1,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(15)),
              hintText: "Enter Course 1 Credit Points"
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.all(10),
          child: TextField(
            keyboardType: TextInputType.number,
            controller: c2,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(15)),
              hintText: "Enter Course 2 Credit Points"
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.all(10),
          child: TextField(
            keyboardType: TextInputType.number,
            controller: c3,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(15)),
              hintText: "Enter Course 3 Credit Points"
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.all(10),
          child: TextField(
            keyboardType: TextInputType.number,
            controller: c4,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(15)),
              hintText: "Enter Course 4 Credit Points"
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.all(10),
          child: TextField(
            keyboardType: TextInputType.number,
            controller: c5,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(15)),
              hintText: "Enter Course 5 Credit Points"
            ),
          ),
        ),
        Padding(
          padding: EdgeInsets.all(10),
          child: TextField(
            keyboardType: TextInputType.number,
            controller: c6,
            decoration: InputDecoration(
              border: OutlineInputBorder(borderRadius: BorderRadius.circular(15)),
              hintText: "Enter Course 6 Credit Points"
            ),
          ),
        ),
       Text('How can I display the calculated value here??')
      ],
    );
  }
}

enter image description here

Answer 1

1. I had modified your code little bit, once user enters every textfield value , we want to call calgpa() function to get gpa, so for that I had add a Submit button, so on pressing that calgpa() would be called.
   

2. Also i am storing gpa in a stateful variable answer , so whenever user gives different value and press Submit, value of answer would change.
   

3. to display answer in text ... do Text('$answer')
   

   class GPA_Calc extends StatefulWidget { const GPA_Calc({Key? key});

     @override
     State<GPA_Calc> createState() => _GPA_CalcState();
   }
   
   class _GPA_CalcState extends State<GPA_Calc> {
     final c1 = TextEditingController();
     final c2 = TextEditingController();
     final c3 = TextEditingController();
     final c4 = TextEditingController();
     final c5 = TextEditingController();
     final c6 = TextEditingController();
     double? answer;
   
     double calgpa() {
       late int cv1 = int.parse(c1.text);
       late int cv2 = int.parse(c2.text);
       late int cv3 = int.parse(c3.text);
       late int cv4 = int.parse(c4.text);
       late int cv5 = int.parse(c5.text);
       late int cv6 = int.parse(c6.text);
       var gpa = (cv1 + cv2 + cv3 + cv4 + cv5 + cv6) / (6);
       return gpa;
     }
   
     @override
     Widget build(BuildContext context) {
       return Scaffold(
         body: Column(
           children: [
             Padding(
               padding: EdgeInsets.all(10),
               child: TextField(
                 onChanged: (value) => 0,
                 keyboardType: TextInputType.number,
                 controller: c1,
                 decoration: InputDecoration(
                     border: OutlineInputBorder(
                         borderRadius: BorderRadius.circular(15)),
                     hintText: "Enter Course 1 Credit Points"),
               ),
             ),
             Padding(
               padding: EdgeInsets.all(10),
               child: TextField(
                 keyboardType: TextInputType.number,
                 controller: c2,
                 decoration: InputDecoration(
                     border: OutlineInputBorder(
                         borderRadius: BorderRadius.circular(15)),
                     hintText: "Enter Course 2 Credit Points"),
               ),
             ),
             Padding(
               padding: EdgeInsets.all(10),
               child: TextField(
                 keyboardType: TextInputType.number,
                 controller: c3,
                 decoration: InputDecoration(
                     border: OutlineInputBorder(
                         borderRadius: BorderRadius.circular(15)),
                     hintText: "Enter Course 3 Credit Points"),
               ),
             ),
             Padding(
               padding: EdgeInsets.all(10),
               child: TextField(
                 keyboardType: TextInputType.number,
                 controller: c4,
                 decoration: InputDecoration(
                     border: OutlineInputBorder(
                         borderRadius: BorderRadius.circular(15)),
                     hintText: "Enter Course 4 Credit Points"),
               ),
             ),
             Padding(
               padding: EdgeInsets.all(10),
               child: TextField(
                 keyboardType: TextInputType.number,
                 controller: c5,
                 decoration: InputDecoration(
                     border: OutlineInputBorder(
                         borderRadius: BorderRadius.circular(15)),
                     hintText: "Enter Course 5 Credit Points"),
               ),
             ),
             Padding(
               padding: EdgeInsets.all(10),
               child: TextField(
                 keyboardType: TextInputType.number,
                 controller: c6,
                 decoration: InputDecoration(
                     border: OutlineInputBorder(
                         borderRadius: BorderRadius.circular(15)),
                     hintText: "Enter Course 6 Credit Points"),
               ),
             ),
             ElevatedButton(
               onPressed: () {
                 setState(() {
                   answer = calgpa();
                   print(answer);
                 });
               },
               child: Text("Submit"),
             ),
             answer != null
                 ? Text('$answer')
                 : Text("Answer will be displayed here"),
           ],
         ),
       );
     }
   }