テーマを変更中で、表示が崩れているところがあります…!

【bubble】3日でアプリ開発した話④プレイヤー検索

.bubble
.bubble

だいぶ時間がかかってしまいました…。作成したのは3日なのに、本業しながら他のことをやるのは苦手です。

さて、それでは登録したプロフィールを検索し、表示するページを作っていきます。

検索ページを作成

検索についてですが、まずは何も考えず一覧を作成しました。

検索ページの要素

検索条件を入力する検索欄と、検索結果を表示する一覧を配置しています。

検索条件はプロフィールの項目だけ存在するので、とりあえずポップアップにしました。この辺りはUI変更したいなあと思っている部分です。

検索項目(ポップアップ)

この入力欄はプロフィールと同じように作成しています。

検索結果の表示

検索結果の表示ですが、さて困った。

プロフィール=ユーザー情報は各項目に対してリストでデータを持っています。例えば試合の対象年齢は、オープンだと何歳でもどのレベルでも参加できます。また、ベテラン大会などは35歳以上、合計100歳以上など様々です。なので複数登録できるようになっています。

さて、Search for UsersでAgeの条件を入力…しようとしたら。

プレイヤー検索条件…?

んっ?

例えば年齢が「35歳以上、40歳以上」が入っている場合、Age in [35歳以上, 40歳以上] などと設定できるつもりでいました。が、できません。多:多の検索ができないんですね。

さてどうする?

ということであまりパフォーマンスの良い形ではありませんが、以下のようにしました。

  • ユーザーのプロフィール情報をテキストのリストとして1カラムに登録する
  • ポップアップでチェックされた検索条件をテキストのリストに保持する(Custom State)
  • [検索条件リスト] intersect with [プロフィール情報のリスト] :count is not 0として、検索条件とプロフィール情報が1つでも同じものが選択されていたら表示する
  • 年齢と性別に関しては試合の形式に関わるので、個別に一致するものがあるかチェックする
検索条件1
検索条件2

Group Sex’s SelectedSex には、ポップアップで入力した検索条件の性別が入っています。

Popup’s search には、ポップアップで入力した検索条件が入っています。

Group Area’s SelectedArea には、ポップアップで入力した検索条件のエリアが入っています。

こんな感じで、多:多の検索をひとまず実現しました。

検索については見直したいところですが、とりあえずこれで動きます。

また、個別の条件をガチガチに検索して全然ヒットしないより、ある程度緩めに検索して「少し調整すれば一緒に試合したい」人がヒットする方が良いという意図もあります。

また、検索条件がかなり多いので、入力内容を保存しておかないと利用者側は面倒だと思ったのでユーザーテーブルに検索実行時に自分の検索条件をテキストリストで登録しています。

相性度の表示

もともとアプリ構築時に「相性度がわかると面白い」だったので、相性については悩みましたが、検索条件に対してどれだけ一致しているのかを表示することにしました。

相性度=マッチング割合の表示

エディタ上は非表示になっていますが、Popup’s search=入力した検索条件のリストが0でない場合表示する条件にしています。

表示内容は、[ユーザーのプロフィールリスト] interest with [検索条件リスト] / [検索条件リスト] を%表示です。

つまり (検索条件と一致するプロフィール情報の個数)÷(検索条件の個数)としています。

そんな感じで作った検索一覧

結果がこんな感じになりました。

検索結果
検索条件の入力・保存

UIの整理は必要ですが、無駄にテキスト入力などせず、タップ(クリック)だけで検索できるようにしました。

スマホ利用を想定しているため…。

行をクリックしたら、ユーザーの詳細を表示するため、プロフィールページをコピーして外部向けのユーザー詳細ページを作成しました。

プレイヤー詳細

④おわりに

本来は情報の持ち方などをあらためて検討すべきだったとは思いますが、3日で作ったとおり、とにかくまずは「ユーザー登録して、検索結果を表示」したいという事であまりDB構成については時間をかけていません。

ユーザーが増える前に再考が必要だとは思っています。

こうしたらいいよなんてのがあれば知りたいです…(切実)。

タイトルとURLをコピーしました