Flutter 谷歌放置自动完成选择后没有显示

Question

我们已经实现了 flutter_google_places: ^0.3.0，我们可以得到一个完美的地址列表。 然而，当我们选择一个地址时，什么也没有显示。 添加了一些控制器，但仍然无法显示选择。

预先感谢您的帮助。

当前使用最新的 flutter 版本。

class Adresses extends StatelessWidget {


Adresses({Key key, this.user}) : super(key: key);

  final UsersInformations user;
  final TextEditingController adresse = TextEditingController();



final _formKey = GlobalKey<FormState>();


 @override
  Widget build(BuildContext context) {
    final sessionToken = Uuid().v4();
    PlaceApiProvider places_provider = PlaceApiProvider(sessionToken);

return Container(
  child: Form(
    key: _formKey,
    child: TypeAheadFormField(
      suggestionsCallback: (pattern) async {
        return await places_provider.fetchSuggestions(pattern, 'fr');
      },
      itemBuilder: (context, suggestion) {
        return ListTile(
          title: Text(suggestion.description),
        );
      },
      onSuggestionSelected: (suggestion) async {
        Place places_details = await places_provider
            .getPlaceDetailFromId(suggestion['place_id']);

        this.adresse.text = suggestion['description'];

        user.setstreetNumber = places_details.streetNumber;
        user.setstreet = places_details.street;
        user.setcity = places_details.city;
        user.setzipCode = places_details.zipCode;
        user.setgeopoint = places_details.geopoint;

        print(this.adresse);
      },
      getImmediateSuggestions: true,
      hideSuggestionsOnKeyboardHide: false,
      hideOnEmpty: false,
      noItemsFoundBuilder: (context) => Padding(
        padding: EdgeInsets.all(8),
        child: Text('No Item Found'),
      ),
      textFieldConfiguration: TextFieldConfiguration(
        decoration: InputDecoration(
          enabledBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.grey.shade300)),
          focusedBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.deepPurple.shade900)),
          focusedErrorBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.red.shade900)),
          errorBorder: UnderlineInputBorder(
              borderSide: BorderSide(color: Colors.red.shade900)),
          hintText: "Adresses",
        ),
        controller: this.adresse,
      ),
    ),
  ),
);

} }

Answer 1

您的代码很难阅读。 我将在这里留下一个工作版本的片段。 确保将它放在StatefulWidget中。

Widget build(BuildContext context) {
  return ListTile(
    title: Text(_theAddress),
    trailing: IconButton(
      onPressed: () => openGooglePrediction(context).then(_updatePredictionResult), 
      icon: Icon(Icons.edit),
  );
}

Future<Prediction?> openGooglePrediction(BuildContext context) async {
  return await PlacesAutocomplete.show(
    context: context,
    apiKey: GOOGLE_API_KEY,
    mode: Mode.overlay,
    language: "en",
    strictbounds: false,
    components: [new Component(Component.country, "us")],
  );
}


void _updatePredictionResult(Prediction? prediction) async {
  if (prediction == null) return;

  PlacesDetailsResponse detail = await _places.getDetailsByPlaceId(
    prediction.placeId!,
  );

  setState(() {
    _theAddress = detail.result.name; // Or any other of the available formats
    _coord = Coordinates( // The coordinates if you need it
      lat: detail.result.geometry!.location.lat,
      lng: detail.result.geometry!.location.lng,
    );
  });
}