我正在开发一个Flutter应用程序,其中有搜索功能。我想显示一个关闭图标,点击搜索图标后,当结果被发现,表明用户可以清除搜索文本。并且在清除searchtext之后,searchIcon必须再次出现以便进一步搜索。
我现在的代码:
class _OverViewState extends State<OverView> {
OverViewController overViewController = OverViewController();
List<House> houses = []; // Store all houses
String searchText = '';
bool isLoading = true; // Add a new isLoading flag
@override
void initState() {
super.initState();
getHouses();
checkLocationPermission();
}
// Fetch houses and filter them based on the searchText
void getHouses() async {
await overViewController.fetchSortedHouses();
houses = overViewController.filterHouses(searchText);
isLoading = false; // Set isLoading to false when houses are fetched
setState(() {}); //this will trigger the call to rebuild UI
}
void filterHouses() {
List<House> filteredHouses = overViewController.filterHouses(searchText);
setState(() {
houses = filteredHouses;
});
}
void checkLocationPermission() async {
final bool locationAccessGranted =
await overViewController.authorizeLocationAccess();
if (locationAccessGranted) {
await overViewController.getCurrentLocation();
getHouses(); // Refresh the list of houses based on the updated location
}
setState(() {});
}
@override
Widget build(BuildContext context) {
body: Container(
color: const Color(0xFFEBEBEB),
child: Column(
children: [
Container(
child: Padding(
padding: const EdgeInsets.all(10.0),
child: Container(
decoration: BoxDecoration(
color: const Color(0x33000000),
borderRadius: BorderRadius.circular(10.0),
),
child: Padding(
padding: const EdgeInsets.symmetric(horizontal: 10.0),
child: Row(
children: [
Expanded(
child: TextField(
onChanged: (value) {
setState(() {
searchText = value;
});
},
decoration: const InputDecoration(
hintText: 'Search for something',
hintStyle: TextStyle(
color: Color(0x66000000),
),
border: InputBorder.none,
),
),
),
GestureDetector(
onTap: () => filterHouses(),
child: SvgPicture.asset(
'assets/icons/ic_search.svg',
width: 25,
height: 25,
color: Color(0x66000000),
),
),
],
),
),
),
),
),
我真的想点击它来搜索和清除searchText,而不是Onchange。我将感谢任何关于如何实现所需行为的指导或一些示例代码。
1条答案
按热度按时间gz5pxeao1#
这个代码会帮助你