如何在颤振中的数据表中执行搜索功能?

时间:2021-02-03 07:24:15

标签: flutter dart search datatable

我是 Flutter 新手,无法在我的 Flutter 项目中搜索数据表中的数据。 请任何人帮助我如何在数据表中实现此功能。这样当我按名称点击搜索框时,我就能在我的表格中找到该数据。

提前致谢。

下面是我的代码。

patient.dart

class PatientInfo{
  String profile_pic;
  String name;
  int age;
  String assigned_slots;
  String completed_slots;

  PatientInfo({this.profile_pic, this.name, this.age, this.assigned_slots, this.completed_slots});
}
var details = <PatientInfo>[
  PatientInfo(
    profile_pic: 'https://s3.amazonaws.com/empoweringparents-uploads/young-children-back-to-school-fb.jpg',
    name: 'A',
    age: 9,
    assigned_slots: 'yes',
    completed_slots: 'yes'
  ),
  PatientInfo(
    profile_pic: 'https://www.freeiconspng.com/thumbs/school-children-png/school-children-png-5.png',
    name: 'Lucy',
    age: 10,
    assigned_slots: 'yes',
    completed_slots: 'No'
  ),
  PatientInfo(
    profile_pic: 'https://images.unsplash.com/photo-1552457309-e45be97707ce?ixid=MXwxMjA3fDB8MHxzZWFyY2h8NHx8aW5kaWFuJTIwY2hpbGR8ZW58MHx8MHw%3D&ixlib=rb-1.2.1&w=1000&q=80',
    name: 'Susan',
    age: 12,
    assigned_slots: 'yes',
    completed_slots: 'yes'
  ),
  PatientInfo(
    profile_pic: 'https://assets.theindusparent.com/wp-content/uploads/sites/9/gallery/top-9-things-you-should-never-do-to-you-babies/137448603.jpg',
    name: 'Peter',
    age: 14,
    assigned_slots: 'No',
    completed_slots: 'yes'
  ),
  PatientInfo(
    profile_pic: 'https://s3.amazonaws.com/empoweringparents-uploads/young-children-back-to-school-fb.jpg',
    name: 'Edmund',
    age: 15,
    assigned_slots: 'yes',
    completed_slots: 'No'
  ),
];

homescreen.dart

class PatientDetails extends StatefulWidget {
  @override
  _PatientDetailsState createState() => _PatientDetailsState();
}

class _PatientDetailsState extends State<PatientDetails> {
TextEditingController nameController = TextEditingController();
 Widget bodyData(){
    return SingleChildScrollView(
      scrollDirection: Axis.horizontal,
      child: DataTable(
        onSelectAll: (b) {},
        sortColumnIndex: 1,
          sortAscending: true,
        columns: <DataColumn>[
          DataColumn(
              label: Text('Profile'),
              numeric: false,
              onSort: (i, b){
                // setState(() {
                // ......
                // });
                print('$i $b');
              },
          ),
          DataColumn(
            label: Text('Name'),
            numeric: false,
            onSort: (i, b){
              setState(() {
               details.sort((a, b) => a.name.compareTo(b.name));
              });
              print('$i $b');
            },
          ),
          DataColumn(
              label: Text('Age'),
              numeric: false,
              onSort: (i, b){
                // setState(() {
                //.....
                // });
                print('$i $b');
              },
          ),
          DataColumn(
              label: Text('Assigned Slots'),
              numeric: false,
              onSort: (i, b){
                // setState(() {
                //......
                // });
                print('$i $b');
              },
          ),
          DataColumn(
              label: Text('Completed Slots'),
              numeric: false,
              onSort: (i, b){
                // setState(() {
                //........
                // });
                print('$i $b');
              },
          )
        ],
        rows: details.map((detail)=> DataRow(
          cells: [
            DataCell(CircleAvatar(radius: 25, backgroundImage: NetworkImage(detail.profile_pic),)),
            DataCell(Text(detail.name), showEditIcon: false),
            DataCell(Text(detail.age.toString()), showEditIcon: false),
            DataCell(Text(detail.assigned_slots), showEditIcon: false),
            DataCell(Text(detail.completed_slots), showEditIcon: false)
          ],
         ),
        ).toList()
      ),
    );
  }
  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: appBarSection('Patient Details'),
      body: Container(
        child: bodyData(),
      ),
    );
  }


Widget appBarSection(String title){
   return AppBar(
     title: Text(title),
     actions: [
       Padding(
         padding: const EdgeInsets.all(8.0),
         child: SizedBox(
           width: 150,
           child: TextFormField(
             controller: nameController,
             decoration: InputDecoration(
               hintText: "Search",
               hintStyle: TextStyle(fontSize: 16, color: Colors.white),
               isDense: true,
               suffixIcon: Icon(Icons.search, color: Colors.white),
               focusedBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(16),
                 borderSide: BorderSide(
                   color: Colors.white,
                   width: 2.0,
                 ),
               ),
               enabledBorder: OutlineInputBorder(
                 borderRadius: BorderRadius.circular(16),
                 borderSide: BorderSide(style: BorderStyle.none),
               ),
               filled: true,
               fillColor: Colors.lightBlue.shade200,
             ),
           ),
         ),
       ),
     ],
   );
  }
}

请帮帮我!

0 个答案:

没有答案