userの選択に応じて表示内容や関数を変更する

まだまだ発展途上だけれど

いったんまとめる。
あいからわずstatefulwidgetです。
今後、関数を独立させるか、Provider使ってmodelと分けるか、とか、考え中。
Reverpodという選択肢は、残念ながらまだ射程に入らない。

第一段階　userが「何で絞るか」を決める。

ここはdropdownButtonで。

                                      child: DropdownButton<String>(
                                        value: isSelectedOption,
                                        alignment: Alignment.center,
                                        dropdownColor: const Color(0x99e6e6fa),
                                        borderRadius: BorderRadius.circular(15.0),
                                          onChanged: (String? value){
                                            setState(() {
                                              isSelectedOption = value!;
                                            });
                                          },
                                          items: options.map<DropdownMenuItem<String>>((String value) {
                                          return DropdownMenuItem<String>(
                                            value: value,
                                              child: Text(
                                                style: AcornTheme.textTheme.headlineMedium,
                                                value),
                                          );
                                        }).toList()
                                      ),

選択された項目を全件取得して、表示用Listに渡して、Chipに表示。

                          Expanded(
                            flex: 5,
                            child: SingleChildScrollView(
                              child: Column(
                                children: [
                                    Padding(
                                      padding: const EdgeInsets.all(20.0),
                                    child: OutlinedButton(
                                      onPressed: () {
                                        switch (isSelectedOption){
                                          case 'Current Country where it happened':
                                            fetchPaysLookingFor();
                                            currentDisplayList = listPays;
                                            break;
                                          case 'Current Place-name where it happened':
                                            fetchVillesLookingFor();
                                            currentDisplayList = listVilles;
                                            break;
                                          case 'Category':
                                            fetchCategoriesLookingFor();
                                            currentDisplayList = listCategories;
                                            break;
                                          case 'People involved':
                                            fetchPeopleLookingFor();
                                            currentDisplayList = listPeople;
                                            break;
                                        }
                                      },
                                      child: const Text('Show and Select your options'),
                                    ),
                                  ),
                                  Padding(
                                    padding: const EdgeInsets.all(8.0),
                                    child: Wrap(
                                      spacing: 5.0, // Gap between FilterChips
                                      children: currentDisplayList.map<Widget>((item) {
                                        if (item is Pays) {
                                          return FilterFormat(
                                              filteredKeys: filtersPays,
                                              filteredValues: filtersPaysId,
                                              filterKey: item.pays,
                                              filterValue: item.id);
                                        } else if(item is Places) {
                                          return FilterFormat(
                                              filteredKeys: filtersVilles,
                                              filteredValues: filtersVillesId,
                                              filterKey: item.place,
                                              filterValue: item.id);
                                        } else if (item is People) {
                                          return FilterFormat(
                                              filteredKeys: filtersPeople,
                                              filteredValues: filtersPeopleId,
                                              filterKey: item.person,
                                              filterValue: item.id);
                                        } else if (item is Categories) {
                                          return FilterFormat(
                                              filteredKeys: filtersCategories,
                                              filteredValues: filtersCategoriesId,
                                              filterKey: item.category,
                                              filterValue: item.id);
                                        }
                                        return const SizedBox.shrink();
                                      }).toList(),
                                    ),
                                  ),
                                ],
                              ),
                            ),
                          ),

同じ分岐が二度出てくるのが腹立たしいが

とりあえず、ユーザーの選択に応じて検索ワードの詳細を表示して選んでもらう、にはなった。

次のステップは、選ばれたChipで絞り込むこと。
国名での絞り込みはもうできているが、
他の項目はendpointの関係でもう一手間必要。
そこが当面の最難関。