Ad
ListView Is Not Getting Updated While Typing In TextField In Flutter
Populating data in ListView while typing in TextField but Data is being populated on Done button of keyboard. The Data is coming from Google Autocomplete Api.
I tried to update list while typing but nothing working.
TextField Code
TextField(
textInputAction: TextInputAction.done,
controller: searchAddressController,
focusNode: searchFocus,
decoration: InputDecoration(
prefixIcon: Icon(
Icons.search_rounded,
color: Colors.black,
),
filled: true,
fillColor: MyColors.locationfieldback,
hintText: "Add Location",
focusedBorder: border,
disabledBorder: border,
enabledBorder: border,
border: border,
hintStyle: TextStyle(
fontSize: 16.0,
fontFamily: 'regular',
color: Colors.grey[500],
letterSpacing: 1.5),
errorBorder: border,
focusedErrorBorder: border,
labelStyle: TextStyle(
fontSize: 16.0,
fontFamily: 'regular',
color: Colors.grey[500],
letterSpacing: 1.5),
contentPadding:
EdgeInsets.fromLTRB(10, 12, 20, 12))),
ListView Code
ListView.builder(
padding: EdgeInsets.all(8),
shrinkWrap: true,
physics: NeverScrollableScrollPhysics(),
itemCount: _placeList.length,
itemBuilder: (BuildContext context, int index) {
return ListTile(
onTap: () {
onLoading(context);
getLatLong(
_placeList[index].placeId, index);
},
title: Text(
'${_placeList[index].description}',
textAlign: TextAlign.justify,
maxLines: 3,
overflow: TextOverflow.ellipsis,
style: TextStyle(fontFamily: 'semibold'),
),
);
})
Search method and Listener
searchAddressController.addListener(() {
_onChanged();
});
_onChanged() {
if (_sessionToken == null) {
setState(() {
_sessionToken = uuid.v4();
});
}
searchLocation(searchAddressController.text);
}
Future<GooglePlaceAutocompleteResponse> searchLocation(String input) async {
String baseURL = 'https://maps.googleapis.com/maps/api/place/autocomplete/json';
String request = '$baseURL?input=$input&key=$kPLACES_API_KEY&sessiontoken=$_sessionToken';
Dio dio = Dio();
var response = await dio.get(request);
try {
if (response.statusCode == 200) {
Log.e("ADDRESS RESPONSE", response.data);
var responseObj = GooglePlaceAutocompleteResponse.fromJson(response.data);
setState(() {
_placeList = responseObj.predictions;
});
return responseObj;
} else {
throw Exception('Failed to load predictions');
}
} catch (e) {
Log.e("EXCEPTION AUTOCOMPLETE", e);
}
}
Getting response while typing
Ad
Answer
searchLocation(searchAddressController.text);
place this under setState. As well as, you can use async
and await
.
_onChanged() {
if (_sessionToken == null) {
setState(() {
_sessionToken = uuid.v4();
searchLocation(searchAddressController.text);
});
}
}
Edited
If you use bottomSheet
, please use stateBuilder
with StateSetter
Ad
source: stackoverflow.com
Related Questions
- → should I choose reactjs+f7 or f7+vue.js?
- → Phonegap Android write to sd card
- → Local reference jquery script in nanohttpd (Android)
- → Click to navigate on mobile devices
- → How to allow api access to android or ios app only(laravel)?
- → Access the Camera and CameraRoll on Android using React Native?
- → React native change listening port
- → What is the default unit of style in React Native?
- → Google play market autocomplete icon
- → Warning: Each child in an array or iterator should have a unique "key" prop. Check the render method of `ListView`
- → Using Laravel with Genymotion
- → react native using like web-based ajax function
- → react native pdf View
Ad