この記事はもともと私の中に掲載されました.Here はオリジナルへのリンクです.
検索は、データを扱うすべてのモバイルアプリケーションの最も重要な機能の一つです.最近、モバイルアプリケーションで信頼性の高い一貫した検索を持っていないことはほぼ不可避です.あなたのアプリがAPIまたはWebサービスから取得するデータを使用してアプリケーションを扱う場合は、バックエンド開発者にあなたのための検索メカニズムを開発することができますし、その後、APIを介して検索結果を消費することができますが、あなたのデータを格納するために雲FireStoreのようなものを使用している場合は、水たまりにあります.
あなたはいくつかの値といくつかのフィールドと一致する必要がありますし、一定の順序で結果を注文する必要が雲FireStoreで基本的な検索を実行することができます限り、テキストを扱っていません.基本的に、それは検索すらありません.あなたは、ドキュメントフィールドで正確な値マッチを探すことができるだけです.例えば、文書がフィールドと呼ばれるならname 値付きでJohn Doe , 検索クエリは正確なフィールドを含むべきですname このドキュメントを取得できる値.使ってもJohn or Doe あなたの検索文字列として、それはテキストのために動作しません、あなたは常にFirestoreの平等をチェックします.
最近、私は私が取り組んできたアプリに検索機能を追加しなければなりませんでした、そして、私はそれが雲Firestoreの上で文書の中で複数の分野を考慮するべきであるように検索ロジックを書かなければなりませんでした.例えば、私の中に次の書類があるならPosts コレクション.

post_id: 1234
post_title: Web Development for Beginners
post_text: This is a wonderful book for those who want to learn web development from scratch.

post_id: 1235
post_title: Software Development for Beginners
post_text: ...

post_id: 1236
post_title: Programming for Beginners
post_text: ...

上記のデータセットでは、検索クエリが正確にドキュメント内のフィールドに格納されているテキストであれば、Firestore内で検索を行うことができます.Firestoreは次のクエリの結果を返しません.

Firestore.collection("Posts").where("post_title", "==", "Software").get()

そして、それは明白です.検索語software 任意のドキュメントの中で正確に一致しませんpost_title フィールド.そして、あなたがフィールドを横切って探索することになっているとき、問題は最大になります.また、あなたのユーザーがデータベースのそれを正確に同じ方法で本のタイトルを入力できるように期待することはできません.
入力Algolia.

私はAlgoliaユーザーであり、それはあなたがパステルにいることを実現開発に3ヶ月とFireStoreを使用している場合は、ライフセーバーです.
私は2年ほど前にAlgoliaをプロジェクトのために初めて使用しました.これはJSONデータで何ができるかを考慮したAlgolia用ケーキです.だからあなたのアプリでAlgoliaを統合する最初のステップは、あなたの検索を実行するデータを決定することです.あなたができる限りそれを絞り込むし、Algoliaにそのデータを追加します.
Algoliaの両方のクライアントとサーバーの多くの人気のプログラミング言語ではなく、ダーツのSDKがあります!しかし、我々はそれを回避します.今のところ、私は投稿コレクションからすべてのドキュメントを読んで、Algoliaのインデックスにそれらを追加する小さなNodeJSスクリプトを書いています.Algoliaインデックスは関連データのコレクションのようです.インデックスには検索対象のJSONドキュメントがあります.
FireBaseのアドミンSDKを使ってFirestoreとAlgoliaを同期させます.私は、使用していますalgoliasearch Algolia SDKを使用するNODEJSパッケージ.私は、この詳細を飛ばしています.

const algolia = algoliasearch("APP_ID", "API_ADMIN_KEY");
const index = algolia.initIndex("Posts"); // You can choose any name
let records = [];
let querySnapshot = await admin.firestore().collection("Posts").get();

for (let i in querySnapshot.docs) {
    let obj = querySnapshot.docs[i].data();
    obj.objectID = querySnapshot.docs[i].id;
    records.push(obj);
}

await index.saveObjects(records);
console.log("Pushed everything to Algolia"); 

あなたはどのように私はAlgoliaインデックスにFirestoreコレクションからデータをアップロードする方法を参照してくださいにビデオを見てみることができます.
上記のコードスニペットは、Posts 結果配列で1つずつコレクションを挿入して挿入します.配列の各オブジェクトにはobjectID そのAlgoliaはあなたのデータをインデックスする必要があります.スクリプトが終了すると、AlgoliaPosts .

設定セクションに移動し、左側の検索属性を選択し、post_title and post_text 検索可能属性のリストの両方.これはAlgoliaがこれらのフィールドの両方を検索できるようになります.

我々がAlgoliaに関するデータを持っていて、我々がどのように我々の検索を実行したいかについて設定した今、我々はFlutterアプリで検索をどのように実装することができるか見ましょう.
残念なことに、Algoliaのダーツ/フラッターの公式SDKはありませんが、驚くべきパッケージを使用することができますdart_algolia これは、残りのAPIのラッパーですか、または野生の感じている場合は、残りのAPIを自分で行くことができます.あなたのオプションは開いています.

ノックスポ / ダルツォクアルゴリア

[非公式] Algoliaはあなたのフラッタやダーツのプロジェクトのための簡単な実装のためのAlgolia REST APIを包んだ純粋なダートSDKです。

私はフラッターで真新しいアプリを作成し、迅速にインストールするdart_algolia パッケージの依存関係として追加することによってpubspec.yaml ファイル.ファイルを保存して実行するflutter packages get パッケージをインストールするコマンド.

次はmain.dart ファイルは、テキストフィールドとボタンを使用して検索を実行するには、最小限のUIを作成します.ここが完全build() メソッド.

Widget build(BuildContext context) {
  return Scaffold(
    appBar: AppBar(
      title: Text("Algolia Search"),
    ),
    body: Container(
      padding: const EdgeInsets.all(16.0),
      child: Column(
        crossAxisAlignment: CrossAxisAlignment.start,
        children: <Widget>[
          Text("Search"),
          TextField(
            decoration: InputDecoration(hintText: "Search query here..."),
          ),
          Row(
            mainAxisAlignment: MainAxisAlignment.end,
            children: <Widget>[
              FlatButton(
                color: Colors.blue,
                child: Text(
                  "Search",
                  style: TextStyle(color: Colors.white),
                ),
                onPressed: () {},
              ),
            ],
          )
        ],
      ),
    ), // This trailing comma makes auto-formatting nicer for build methods.
  );
}

そして、それがどのように見えるかは、ここにあります.

次に、すぐにAを加えましょうTextEditingController このようにして、TextField .

TextEditingController _searchText = TextEditingController(text: "");

そして、_searchText のコントローラプロパティにTextField .

TextField(
  controller: _searchText,
  decoration: InputDecoration(hintText: "Search query here..."),
),

最後に、コードを書く時間ですonPressed イベントオンザFlatButton . メソッドを作成しましょうsearch の中からすべての検索ロジックを書き込みます.

FlatButton(
  color: Colors.blue,
  child: Text(
    "Search",
    style: TextStyle(color: Colors.white),
  ),
  onPressed: _search,
),

クラス内の先頭にいくつかの変数を追加します.

List<AlgoliaObjectSnapshot> _results = [];
bool _searching = false;

The _results arrayはalgoliaが返すデータを保持し、ListView . The _searching booleanは、検索が完了したかどうかを示すためだけに使用されます.

_search() async {
  setState(() {
    _searching = true;
  });

  Algolia algolia = Algolia.init(
    applicationId: 'APP_ID',
    apiKey: 'SEARCH_API_KEY',
  );

  AlgoliaQuery query = algolia.instance.index('Posts');
  query = query.search(_searchText.text);

  _results = (await query.getObjects()).hits;

  setState(() {
    _searching = false;
  });
}

最後に、作成しましょうListView 使用ListView.builder ウィジェットのコンストラクタ.最後の要素としてColumn そして、それを内側に包むExpanded ウィジェットは、すべての利用可能な垂直空間を占有するように.

Expanded(
  child: _searching == true
      ? Center(
          child: Text("Searching, please wait..."),
        )
      : _results.length == 0
          ? Center(
              child: Text("No results found."),
            )
          : ListView.builder(
              itemCount: _results.length,
              itemBuilder: (BuildContext ctx, int index) {
                AlgoliaObjectSnapshot snap = _results[index];

                return ListTile(
                  leading: CircleAvatar(
                    child: Text(
                      (index + 1).toString(),
                    ),
                  ),
                  title: Text(snap.data["post_title"]),
                  subtitle: Text(snap.data["post_text"]),
                );
              },
            ),
),

完了です.コードは少しクリーナーことができますが、今のところ無視しましょう.テストしましょう.

それはほんの始まりです.Algoliaは途方もない力を提供し、facetted検索を実行することができます、地理ベースの検索、ランキング、並べ替え、および大いに多く.私はまだ実験しているし、それをショットを与える必要があります.また、あなたの経験を共有してください.
上のデモのコードはGithubにあります.

サムアーマラール / アオノリ

アオノリ

新しいフラッターアプリケーション.

始める

このプロジェクトはフラッターアプリケーションの出発点です.
あなたが最初のフラッタープロジェクトであるならば、あなたを得るいくつかの資源は、始まりました:

Lab: Write your first Flutter app

Cookbook: Useful Flutter samples

Flutterで始まるヘルプのために
online documentation , チュートリアルを提供します.
サンプル、モバイル開発のガイダンス、および完全なAPI参照.
View on GitHub
ここで私は完全なテキスト検索を実行している完全なビデオYouTubeでは、フラッターアプリでAlgoliaを使用しています.
また、より楽しいコンテンツの私のYouTubeチャンネルを購読することができます.
コーディング、歓声を保つ.