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(() {
});
}
}
CodePudding user response：
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
CodePudding user response：
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,
)),
);
}