【Flutter×Firebase】検索機能の実装

開幕早々残念なお知らせです...

現時点でのCloud Firestoreでは、全文検索機能が使えません。皆さんがネットで検索するとき、例えば、「おしるこ」と検索したかったとしましょう。「おしる」と入力したら「おしるこ」と予測変換が出てきますね。
上記の様な機能を使うにはサードパーティの検索機能を使わないと機能が搭載できない模様。

そこで今回使うのは完全一致検索を使います。

.where（特定の条件で抽出する）

下記のGIFは私がポケモンに因んだアプリを作成した際のGIFになります。
Cloud Firestoreのクエリ機能、.whereを使うと特定の条件に当てハマったものだけ絞り込むと言う機能。

.whereクエリ 使い方

.whereクエリには他にも色々な種類がありまして、その中で今回上げるのは「isEqualTo」
意味としては 〜と等しい　
今回で言うcollection、pokemonの中のnameに書いてあるpokemonNameが、ユーザーが入力したポケモン名と 〜と等しい場合抽出

　　　final QuerySnapshot snapshot = await FirebaseFirestore.instance
        .collection('pokemon')
        .where('name', isEqualTo: pokemonName)
        .get();

コード解説 View側

画面の状態管理を行うため、providerと言うパッケージを使ってコード解説します。
onChangedの中にModel側で作成したsearchPokemonと言う関数を定義します。

TextField(
          onChanged: (text) {
          model.searchPokemon(text);
                 },
cursorColor: Colors.brown,
decoration: const InputDecoration(
          filled: true,
          fillColor: Colors.white,
          prefixIcon: Icon(Icons.search, color: Colors.brown),
         focusedBorder: OutlineInputBorder(
         borderSide: BorderSide(
         width: 1, color: Colors.brown),),
enabledBorder: OutlineInputBorder(
           borderSide: BorderSide(
              width: 1, color: Colors.brown),),
              hintText: '例/アブソル',
              ),
           );

Model側

onChangedの中に入力されたString型を抽出したいので、searchPokemonの引数に
String pokemonNameと入れてみました。
これでonChangedの中に入力されたString型を抽出できます。

class PokemonListModel extends ChangeNotifier {
Future<void> searchPokemon(String pokemonName) async {

    final QuerySnapshot snapshot = await FirebaseFirestore.instance
        .collection('pokemon')
        .where('name', isEqualTo: pokemonName)
        .get();

おわりに

今回初学者にはハードルが高そうな検索機能に挑戦してみました。
全文検索機能は外部から取り入れないといけない難易度の高さゆえ、諦めていた方もいたのではないでしょうか？

• Flutter大学
  https://kboyflutteruniv.com/