Search code examples
flutterlistviewfilter

unable to filter when i open the screen it will always empty flutter but when type some thing in textfield it shows data in listview


i am having some issues tried but unable to resolve it. i am working on filter so have textfield and listview on screen. when i open the screen the listview is always empty. but when i type some thing in textfield it will search and show the data. but on load listview shows no data.

here is my code.

import 'package:emis/colorschemes.dart';
import 'package:emis/single_healthfacility_screen.dart';
import 'package:flutter/material.dart';
import 'package:flutter_easyloading/flutter_easyloading.dart';
import 'database_helper.dart';
import 'models/healthfacilities.dart';

class HealthFacilitiesListScreen extends StatefulWidget {
  const HealthFacilitiesListScreen({super.key});
  @override
 _HealthFacilitiesListScreenState createState() =>
    _HealthFacilitiesListScreenState();
 }

  class _HealthFacilitiesListScreenState
  extends State<HealthFacilitiesListScreen> {
bool isLoading = false;
List<Healthfacilities> _allealthfacilities = [];
List<Healthfacilities> _filteredHealthfacilities = [];

Future<void> _fetchHealthFacilities() async {
final db = await DatabaseHelper.instance.database;
EasyLoading.show(status: 'Loading...');
final List<Map<String, dynamic>> results = await db.rawQuery(
    "SELECT * FROM ${DatabaseHelper.dbTableHealthfacilities} ORDER BY officename ASC");
print(results);
setState(() {
  _allealthfacilities =
      results.map((map) => Healthfacilities.fromJson(map)).toList();
});
EasyLoading.dismiss();
 }

 void _runFilter(String enteredKeyword) {
   List<Healthfacilities> results = [];
  if (enteredKeyword.isEmpty || enteredKeyword == "") {
  results = _allealthfacilities;
  } else {
  results = _allealthfacilities
      .where((hf) => hf.officename
          .toLowerCase()
          .contains(enteredKeyword.toLowerCase()))
      .toList();
}

  setState(() {
    _filteredHealthfacilities = results;
  });
}

@override
void initState() {
  super.initState();
  _fetchHealthFacilities();
//_filteredHealthfacilities = _allealthfacilities;
}

 @override
 Widget build(BuildContext context) {
return Scaffold(
    backgroundColor: headerAppBar,
    appBar: AppBar(
      backgroundColor: Colors.transparent,
      elevation: 0,
      centerTitle: true,
      title: const Text(
        "Health Facilities",
        style: TextStyle(
          color: Colors.white,
          fontWeight: FontWeight.w700,
        ),
      ),
      actions: [
        IconButton(
            onPressed: () {
              Navigator.pushNamed(context, '/home');
            },
            icon: Container(
                decoration: BoxDecoration(
                    borderRadius: BorderRadius.circular(20),
                    color: Colors.grey.withOpacity(0.7)),
                child: const Padding(
                  padding: EdgeInsets.all(5.0),
                  child: Icon(Icons.home),
                ))),
      ],
    ),
    body: Container(
      width: MediaQuery.of(context).size.width,
      padding: const EdgeInsets.all(20),
      decoration: const BoxDecoration(
        color: Colors.white,
        borderRadius: BorderRadius.only(
          topLeft: Radius.circular(40),
          topRight: Radius.circular(40),
        ),
      ),
      child: Padding(
        padding: const EdgeInsets.only(top: 8.0, bottom: 8.0),
        child: isLoading
            ? const Center(
                child: CircularProgressIndicator(
                backgroundColor: Colors.green,
              ))
            : Column(
                children: [
                  TextField(
                    onChanged: (value) => _runFilter(value),
                    decoration: InputDecoration(
                      hintText: 'Search',
                      filled: true,
                      border: OutlineInputBorder(
                        borderRadius: BorderRadius.circular(15.0),
                        borderSide: const BorderSide(
                          width: 0,
                          style: BorderStyle.none,
                        ),
                      ),
                      suffixIcon: Container(
                        decoration: BoxDecoration(
                            color: buttonRed,
                            borderRadius: BorderRadius.circular(15)),
                        child: IconButton(
                          icon: const Icon(
                            Icons.search,
                            size: 28,
                            color: Colors.white,
                          ),
                          onPressed: () {},
                        ),
                      ),
                    ),
                  ),
                  Expanded(
                    child: ListView.builder(
                      itemCount: _filteredHealthfacilities.length,
                      itemBuilder: (context, index) {
                        final healthfacility =
                            _filteredHealthfacilities[index];
                        print(healthfacility.officename);
                        return Padding(
                          padding: const EdgeInsets.all(2.0),
                          child: Container(
                            decoration: BoxDecoration(
                                //border: Border.all(),
                                color: Colors.grey.withOpacity(0.1),
                                borderRadius: BorderRadius.circular(10)),
                            child: ListTile(
                                onTap: () {
                                  Navigator.push(
                                    context,
                                    MaterialPageRoute(
                                      builder: (context) =>
                                          HealthFacilityScreen(
                                              healthfacility:
                                                  healthfacility),
                                    ),
                                  );
                                },
                                leading: const Icon(
                                  Icons.health_and_safety,
                                  size: 35,
                                  color: Colors.green,
                                ),
                                title: Text(
                                  healthfacility.officename,
                                  style: const TextStyle(
                                      fontSize: 15,
                                      fontWeight: FontWeight.bold),
                                ),
                                subtitle: Text("DO Mirpurkhas"),
                                trailing: const Icon(
                                    Icons.arrow_forward_ios_outlined)),
                          ),
                        );
                      },
                    ),
                  ),
                ],
              ),
      ),
    ),
    bottomNavigationBar: bottomFooter());
 }

}

solution and help please


Solution

  • In your listview.builder you mentioned the _filteredHealthfacilities which is already empty when it loads first time try to assign all the data to it when you fetch the data and as you type your data will filtered out and shown to user.