lundi 31 mai 2021

Flutter Multiple Checkbox From API

I have been able to display Json data from API in FutureBuilder Widget. However, the widget has checkbox for each list. Whenever I check on one list, the whole list get checked. I want a help on how to check each list individually and be able to use the data of the selected list.

import 'dart:convert';
import 'package:http/http.dart' as http;
import 'package:bottom_navy_bar/bottom_navy_bar.dart';
import 'package:flutter/cupertino.dart';
import 'package:flutter/material.dart';
import 'package:mar/Components/mydrawer.dart';
import 'package:mar/Services/auth.dart';
import 'package:mar/sccreens/readRequirements.dart';
import 'package:mar/sccreens/scanAnalysis.dart';
import 'package:shared_preferences/shared_preferences.dart';
import '../constants.dart';
import 'infoAnalysis.dart';
import 'login_screen.dart';

class Know extends StatefulWidget {
  static String id = 'Know';
  @override
  _KnowState createState() => _KnowState();
}

class _KnowState extends State<Know> {
  List sympotms = [];
  int currentIndex = 2;
  bool valuefirst = false;
  int _bottomBarIndex = 0;
  Auth _auth;

  showdialogall(context, String mytitle, String mycontent) {
    return showDialog(
        context: context,
        builder: (context) {
          return AlertDialog(
            shape: RoundedRectangleBorder(
              borderRadius: BorderRadius.circular(30),
            ),
            title: Text(
              mytitle,
              style: TextStyle(color: Colors.deepOrange),
            ),
            content: Text(mycontent),
            actions: [
              Center(
                child: RaisedButton(
                    shape: RoundedRectangleBorder(
                      borderRadius: BorderRadius.circular(15),
                    ),
                    color: kMainColor,
                    onPressed: () {
                      Navigator.push(
                        context,
                        MaterialPageRoute(builder: (context) => ReadReq()),
                      );
                    },
                    child: Text(
                      "Requirements",
                      style: TextStyle(color: Colors.black),
                    )),
              ),
            ],
          );
        });
  }

  Future fetchdata() async {
    var res = await http.get("http://10.0.2.2/medical/symptoms.php");
    if (res.statusCode == 200) {
      var obj = json.decode(res.body);
      return obj;
    }
  }

  bool isSearching = false;

  @override
  void initState() {
    fetchdata().then((data) {
      setState(() {
        sympotms = data;
      });
    });
    super.initState();
  }

  void _filterSymptoms(value) {
    setState(() {
      filteredsympotms = sympotms
          .where(
              (sym) => sym['name'].toLowerCase().contains(value.toLowerCase()))
          .toList();
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        backgroundColor: kMainColor,
        title: Text(
          "Know Your Analysis",
          style: TextStyle(
            fontFamily: 'Pacifico',
          ),
        ),
        actions: <Widget>[
          FlatButton(
            child: CircleAvatar(
              child: Image(
                image: AssetImage('images/icons/medical.png'),
              ),
              backgroundColor: Colors.black,
            ),
            onPressed: () {
              Navigator.pushNamed(context, Scan.id);
            },
          ),
        ],
        centerTitle: true,
      ),
      drawer: MyDrawer(),
      body: Column(
        children: [
          Expanded(
            child: sympotms.length > 0
                ? ListView.builder(
                    itemBuilder: (_, index) {
                      return Container(
                        child: Row(
                          children: [
                            SizedBox(width: 10),
                            Checkbox(
                              value: this.valuefirst,
                              onChanged: (bool value) {
                                setState(() {
                                  valuefirst = value;
                                });
                              },
                              checkColor: Colors.greenAccent,
                              activeColor: Colors.black,
                            ),
                            Text(
                              "${sympotms[index]['SymptomsName']}",
                              style: TextStyle(fontSize: 17.0),
                            ),
                          ],
                        ),
                      );
                    },
                    itemCount: sympotms.length,
                  )
                : Container(child: Center(child: Text("Loading..."))),
          ),
          RaisedButton(
            child: Text(
              " Submit ",
              style: TextStyle(fontSize: 20),
            ),
            onPressed: () {
              showdialogall(context, "Result !", "CBC Test");
            },
            // onPressed: showdialogall(context, "Result !", "CBC Test"),
            color: Colors.green,
            textColor: Colors.white,
            splashColor: Colors.grey,
            padding: EdgeInsets.fromLTRB(10, 10, 10, 10),
          ),
        ],
      ),
      //Navigation
      bottomNavigationBar: BottomNavyBar(
        animationDuration: Duration(milliseconds: 800),
        curve: Curves.easeInOut,
        selectedIndex: currentIndex,
        onItemSelected: (index) async {
          if (index == 0) {
            Navigator.pushNamed(context, Scan.id);
          }
          if (index == 1) {
            Navigator.pushNamed(context, Information.id);
          }
          if (index == 2) {
            Navigator.pushNamed(context, Know.id);
          }
          if (index == 3) {
            SharedPreferences pref = await SharedPreferences.getInstance();
            pref.clear();
            await _auth.signOut();
            Navigator.popAndPushNamed(context, LoginScreen.id);
          }
          setState(() {
            currentIndex = index;
          });
        },
        items: <BottomNavyBarItem>[
          BottomNavyBarItem(
            icon: Icon(
              Icons.camera_alt,
            ),
            title: Text('Scan'),
            activeColor: Colors.black,
            inactiveColor: Colors.black,
          ),
          BottomNavyBarItem(
            icon: Icon(
              Icons.perm_device_information,
            ),
            title: Text('Information'),
            activeColor: Colors.black,
            inactiveColor: Colors.black,
          ),
          BottomNavyBarItem(
            icon: Icon(
              Icons.open_in_new_outlined,
            ),
            title: Text('Know analysis'),
            activeColor: Colors.black,
            inactiveColor: Colors.black,
          ),
        ],
      ),
    );
  }
}

I want a help on how to check each list individually and be able to use the data of the selected list.

this image display my problem




Aucun commentaire:

Enregistrer un commentaire