List is not showing in Listview Flutter - flutter

Question

i have implement a List from api and it gives me actual response which is working fine. but when i implemented a list search on it. Then the list doesn't show up when i open that screen. but when i start searching it gives me the correct search results.
here is my code:
import 'dart:convert';
import 'package:fb_installer_phase1/api/controller/user_auth_controller.dart';
import 'package:fb_installer_phase1/api/model/technician.dart';
import 'package:fb_installer_phase1/views/user_management/add_user_screen.dart';
import 'package:flutter/material.dart';
import 'package:flutter/services.dart';
import 'package:flutter_screenutil/flutter_screenutil.dart';
import 'package:get/get.dart';
import 'package:http/http.dart' as http;
import 'package:shared_preferences/shared_preferences.dart';
import '../../api/network_calls/api_configration.dart';
import '../../utils/app_constants.dart';
import '../../utils/color_resourse.dart';
class UserListScreen extends StatefulWidget {
const UserListScreen({Key? key}) : super(key: key);
#override
State<UserListScreen> createState() => _UserListScreenState();
}
class _UserListScreenState extends State<UserListScreen> {
final TextEditingController searchController = TextEditingController();
String keyword = '';
bool isDataLoading = false;
List<TechData> _technicians = <TechData>[];
List<TechData> _techniciansList = <TechData>[];
Future getData() async {
SharedPreferences preferences = await SharedPreferences.getInstance();
bearerToken = preferences.getString(AppConstants.appToken)!;
String url = AppConstants.baseUrl + AppConstants.allTechnicianListApi;
try {
final response = await http.get(Uri.parse(url), headers: {
'Content-Type': 'application/json',
'Accept': 'application/json',
'Authorization': 'Bearer $bearerToken',
});
debugPrint("Token: $bearerToken");
debugPrint("Response::: ${response.body}");
TechnicianModel model = TechnicianModel.fromJson(
jsonDecode(response.body));
_technicians = model.data!;
setState(() {
isDataLoading = false;
isDataLoading = !isDataLoading;
});
print("hello...: ${_technicians.length}");
} catch (exception) {
print(exception);
}
}
#override
void initState() {
getAllTechniciansData();
getData();
super.initState();
}
#override
Widget build(BuildContext context) {
return Scaffold(
floatingActionButton: FloatingActionButton(
backgroundColor: ColorResources.primaryColor,
child: Center(
child: Icon(
Icons.add,
size: 25.h,
),
),
onPressed: () {
Get.to(() => const AddUserScreen());
},
),
appBar: AppBar(
flexibleSpace: Container(
decoration: const BoxDecoration(
gradient: LinearGradient(
begin: Alignment.centerLeft,
end: Alignment.centerRight,
stops: [
0.2,
0.7,
1,
],
colors: [
Color(0XFF3DDA76),
Color(0XFF6DD2D1),
Color(0XFF41B1A1),
],
)),
),
centerTitle: true,
backgroundColor: ColorResources.primaryColor,
title: const Text("User List"),
systemOverlayStyle: SystemUiOverlayStyle.light,
),
body: Column(
children: [
SizedBox(
height: 20.h,
),
_createSearchbar(),
SizedBox(
height: 15.h,
),
Container(
width: double.infinity,
margin: EdgeInsets.symmetric(horizontal: 15.w),
height: 35.h,
color: const Color(0xffF2F2F2),
child: Row(
children: [
Container(
width: 80.w,
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
"Name",
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w600,
fontSize: 12.sp),
),
),
Container(
width: 170.w,
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
"Email",
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w600,
fontSize: 12.sp),
),
),
Container(
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
"App Status",
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w600,
fontSize: 12.sp),
),
)
],
),
),
_userListView(),
],
),
);
}
#override
void dispose() {
super.dispose();
FocusScope.of(context).unfocus();
}
Container _createSearchbar() {
return Container(
height: 50.h,
margin: EdgeInsets.symmetric(horizontal: 15.w),
decoration: BoxDecoration(
borderRadius: BorderRadius.circular(10),
color: Colors.white,
border: Border.all(color: ColorResources.grey300)),
child: Row(
children: [
SizedBox(
height: 50.h,
width: 40.h,
child: const Center(
child: Icon(
Icons.search,
color: ColorResources.primaryColor,
),
),
),
Expanded(
child: TextField(
decoration: InputDecoration(
border: InputBorder.none,
focusedBorder: InputBorder.none,
enabledBorder: InputBorder.none,
errorBorder: InputBorder.none,
disabledBorder: InputBorder.none,
contentPadding:
EdgeInsets.only(left: 15.w, bottom: 11.h, top: 11, right: 15),
hintText: "Search here",
),
onChanged: searchTechnicians,
)),
],
),
);
}
TextEditingController controller = TextEditingController();
Widget _userListView() {
return isDataLoading || _techniciansList.isNotEmpty || controller.text.isNotEmpty
? Expanded(child: ListView.builder(
itemCount: _techniciansList.length ,
itemBuilder: (context, index) {
if (_techniciansList.isNotEmpty) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 15.w),
height: 32.h,
//color: const Color(0xffF2F2F2),
child: Row(
children: [
Container(
width: 80.w,
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
_techniciansList[index].name!,
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w400,
overflow: TextOverflow.ellipsis,
fontSize: 11.sp),
),
),
Container(
width: 170.w,
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
_techniciansList[index].email!,
overflow: TextOverflow.ellipsis,
maxLines: 2,
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w400,
fontSize: 11.sp),
),
),
Expanded(
child: Container(
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 5.w),
child: Text(
_techniciansList[index].phone! ?? '',
style: TextStyle(
color: Colors.black,
overflow: TextOverflow.ellipsis,
fontWeight: FontWeight.w400,
fontSize: 11.sp),
),
),
)
],
),
);
} else {
return const SizedBox();
}
}
))
: const Expanded(
child: Center(child: CircularProgressIndicator(
color: ColorResources.primaryColor,)),
);
}
searchTechnicians(String text) {
_techniciansList.clear();
if (text.isEmpty) {
setState(() {
});
return;
}
_technicians.forEach((element) {
if (element.name!.contains(text)
|| element.email!.contains(text)
|| element.phone!.contains(text)) {
_techniciansList.add(element);
}
});
print("searchresults: ${_techniciansList.length}");
setState(() {
});
}
}

Answer 1

Because initially your _techniciansList.length will be zero and your list view is depend on _techniciansList.length.
If you want to show the list you have to manage conditions like
if controller.text.isEmpty than show ListView with all product list

Answer 2

You need check if search field is empty pass _technicians, like this:
Widget _userListView() {
return isDataLoading ||
_techniciansList.isNotEmpty ||
controller.text.isNotEmpty ||
_technicians.isNotEmpty
? Expanded(
child: ListView.builder(
itemCount: controller.text.isEmpty
? _technicians.length
: _techniciansList.length,
itemBuilder: (context, index) {
if (_techniciansList.isNotEmpty || _technicians.isNotEmpty) {
return Container(
margin: EdgeInsets.symmetric(horizontal: 15.w),
height: 32.h,
//color: const Color(0xffF2F2F2),
child: Row(
children: [
Container(
width: 80.w,
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
controller.text.isEmpty
? _technicians[index].name!
: _techniciansList[index].name!,
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w400,
overflow: TextOverflow.ellipsis,
fontSize: 11.sp),
),
),
Container(
width: 170.w,
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 10.w),
child: Text(
controller.text.isEmpty
? _technicians[index].email!
: _techniciansList[index].email!,
overflow: TextOverflow.ellipsis,
maxLines: 2,
style: TextStyle(
color: Colors.black,
fontWeight: FontWeight.w400,
fontSize: 11.sp),
),
),
Expanded(
child: Container(
height: double.infinity,
color: Colors.transparent,
alignment: Alignment.centerLeft,
padding: EdgeInsets.only(left: 5.w),
child: Text(
controller.text.isEmpty
? _technicians[index].phone! ?? ''
: _techniciansList[index].phone! ?? '',
style: TextStyle(
color: Colors.black,
overflow: TextOverflow.ellipsis,
fontWeight: FontWeight.w400,
fontSize: 11.sp),
),
),
)
],
),
);
} else {
return const SizedBox();
}
}))
: const Expanded(
child: Center(
child: CircularProgressIndicator(
color: ColorResources.primaryColor,
)),
);
}