Flutter: SetState () обновляет значения, но не отображает их на экране. Это происходит только при использовании обновленных значений внутри панели Flushbar. - PullRequest
0 голосов
/ 11 июля 2020

У меня есть текстовое поле внутри панели Flushbar, и текстовое поле использует API Google Places для поиска мест на основе предоставленных входных данных. Я вызываю функцию для параметра «onChanged» текстового поля, как можно увидеть в коде, но это не отображается на экране, поскольку что-то вводится в текстовое поле. Хотя печать значений показывает, что значения были обновлены. Кроме того, при появлении и открытии панели Flushbar отображается ожидаемый результат.

Кроме того, это происходит только при использовании обновленных значений внутри Flushbar. На эшафоте он отображается так, как ожидалось.

Я знаю, что это похоже на другие вопросы, которые задавались ранее, но мне пока нет ответов. Я даже обнаружил, что это может происходить, поскольку сам Flushbar не имеет «состояния», и поэтому «setState ()» не влияет на его «содержимое». Но я не знаю, как go обойти эту проблему. Мы будем очень благодарны за любую помощь в этом вопросе.

Обновление: я пробовал использовать виджет StatefulBuilder внутри панели Flushbar, но он дает аналогичные результаты. Я вызвал StaefulBuilder в операторе return после ListView.builder внутри панели Flushbar.

Пример кода:

@override
 Widget build (BuildContext context){
  return Scaffold(
    body : FlatButton(
      child : Text('Search Location'),
      onPressed : Flushbar(
        flushbarPosition: FlushbarPosition.BOTTOM,
        userInputForm : Form(
          child : Container(
           child : Column(
            children : <Widget>[ 
             getSearchFieldFlushBar(),
             _displaySearchedPlaces.length != 0 
               ? ListView.builder(
                   shrinkWrap : true,
                   itemCount : _displaySearchedPlaces.length
                   itemBuilder : (BuildContext context, index){

                     return ListTile(
                       title : Text(_displaySearchedPlaces[index])
                     );
                    }) 
                : Container(height : 0, width : 0),
              ])
             )
           )
          )..show(context);
         ));
        }

Вот функция, которая вызывает текстовое поле:

TextFormField getSearchFieldFlushbar(){
 return TextFormField(
  style: TextStyle(color: Colors.black),        
  onChanged: (text) {
    getLocationResults(text);
  },
);
    

И это функция, которая вызывается, когда что-то вводится в текстовое поле:

  void getLocationResults(String input) async {

    String baseURL = 'https://maps.googleapis.com/maps/api/place/autocomplete/json';
    String type = 'geocode';

    String request = '$baseURL?input=$input&key=$places_Api_Key&type=$type';
    Response response = await Dio().get(request);

        final predictions = response.data['predictions'];

        _displayResults = [];

        for (int i = 0; i < predictions.length; i++) {
          String name = predictions[i]['structured_formatting']['main_text'];
          _displayResults.add(name);
        }

        setState(() {
          _displaySearchedPlaces = _displayResults;
        });
        
         print(_searchedPlacesResults);
       }
     }

Снимок экрана1 ScreenShot2

1 Ответ

0 голосов
/ 20 июля 2020

Мне, наконец, удалось исправить это, используя несколько ответов, которые были даны ранее на аналогичные вопросы о Stackoverflow, такие как здесь и здесь .

В основном, мы используйте виджет StatefulBuilder и поместите все дочерние виджеты, которые потенциально могут быть обновлены, внутри этого виджета. Как уже упоминалось в вопросе, использование этого не помогло мне изначально, однако через некоторое время оно начало работать.

Для справки, я добавил виджет StatfulBuilder в параметр 'child' виджета Form .

...