【adalo】リストの一度選択したものを選択済みにする方法

◆結論

現在検証中。情報収集中の情報は以下「情報収集・検証中」よりご確認ください。

◆モバイルアプリの紹介┃予想型SNSアプリ「predictor」ダウンロードはこちら☟

●Googleグループに入る→「予想型SNS」と検索→グループに入る→URLをクリック

予想型SNS「predictor」の限定先行ユーザーのグループ - Google Groups

●Googleplay┃入れない場合は上記を試してみてください。

https://play.google.com/store/apps/details?id=com.bankofbusiness.predictor

●web版┃入れない場合は上記を試してみてください。
https://play.google.com/apps/testing/com.bankofbusiness.predictor

◆情報収集・検証

❒Google

●以下の記事が参考になりそう

【ノーコードAdalo】チェックしたリスト項目の背景色を変える（グレイアウト）する方法 ｜ Citrus App

❒youtube

※以下のyoutubeが参考になりそう

❒perplexity

●リストの色を変更をするバージョン
はい、もちろんリストの色を変更するバージョンでも実装可能です。以下に、その方法を説明します：

リストの色を変更するバージョン

1. データベース構造

   1. ユーザーコレクション

      • 標準的なユーザー情報（ID、名前、メールアドレスなど）

   2. お題コレクション（予想履歴コレクションなど）

      • ID

      • お題内容

      • 作成日時

      • その他の関連情報

   3. ユーザー回答コレクション

      • ID

      • ユーザー（ユーザーコレクションへの関係）

      • お題（お題コレクションへの関係）

      • 回答内容

      • 回答日時

      • ※※回答済みフラグ（ブール型）

2. 済┃Custom Listの設定

   • お題コレクションを元にCustom Listを作成します。

   • 各リストアイテムにはお題内容を表示します。

3. 済┃条件付きスタイル

   • リストアイテム全体に条件付きスタイルを適用します。

   • 条件：ユーザー回答済みコレクションに、現在のユーザーIDとお題IDに一致するレコードが存在する場合

   • スタイル：背景色を変更（例：灰色や薄い青など）

4. ※タップアクション

   • リストアイテムをタップした際のアクションを設定します。

   • 条件分岐を使用：

     • 未回答の場合：回答入力画面に遷移

     • 回答済みの場合：何もしない、または回答詳細画面に遷移

5. 回答処理

   • 回答入力画面で回答を保存する際、ユーザー回答コレクションに新しいレコードを作成します。

   • 回答後、リスト画面に戻り、リストを更新します。

実装手順

1. △Custom Listの各アイテムに条件付きスタイルを適用します。
   ※カスタムリストを使うことが重要。

   • 条件：Current User's Responses（反応） コレクションに、現在のお題IDに一致するレコードが存在する

   • True の場合：背景色を変更（例：#E0E0E0）

   • False の場合：デフォルトの背景
     
     ※なかなか設定ができない状況

1. リストアイテムのタップアクションを設定：

   • 条件分岐：Current User's Responses（反応） にレコードが存在するか

   • 存在しない場合：回答入力画面に遷移

   • 存在する場合：アクションなし、または回答詳細画面に遷移

2. 回答入力画面で回答を保存後、リスト画面に戻る際にリストを更新します。

この方法により、ユーザーが回答済みのお題は色が変わって表示され、視覚的に区別できるようになります。また、タップしても新たな回答ができないようになります。注意点として、大量のデータを扱う場合、Adaloのパフォーマンスに影響が出る可能性があります。その場合は、ページネーションや無限スクロールなどの実装を検討するか、外部データベースとの連携を考慮する必要があるかもしれません。

●ボタンを配置するパターン

この状況に対応するためには、以下のようなデータベース構造を構築することをお勧めします:

データベース構造

1. ユーザーコレクション

   • 標準的なユーザー情報（ID、名前、メールアドレスなど）

2. お題コレクション（予想履歴コレクションなど）

   • ID

   • お題内容

   • 作成日時

   • その他の関連情報

3. ユーザー回答コレクション

   • ID

   • ユーザー（ユーザーコレクションへの関係）

   • お題（お題コレクションへの関係）

   • 回答内容

   • 回答日時

   • 予想済みフラグ（ブール型）

実装方法

1. お題の表示

   • Custom Listを使用してお題を表示します。

   • リストアイテムには、お題内容と「予想する」ボタンを配置します。

2. 予想済み判定

   • リストの各お題について、ログインユーザーの回答が存在するかをチェックします。

   • これは、ユーザー回答コレクションをフィルタリングすることで実現できます。

3. 条件付きスタイル

   • 「予想する」ボタンに条件付きスタイルを適用します。

   • ユーザー回答が存在する場合（予想済みの場合）、ボタンを灰色にし、タップできないようにします。

4. 予想アクション

   • 「予想する」ボタンをタップした際、新しいユーザー回答レコードを作成します。

   • 予想済みフラグをTrueに設定します。

5. リストの更新

   • 予想後、リストをリフレッシュして変更を反映させます。

この構造により、各ユーザーの回答状況を個別に管理でき、ユーザーごとに異なるお題の表示状態を実現できます。また、Adalo上で比較的簡潔に実装することが可能です
量のデータや複雑な条件分岐が必要な場合は、Adaloの制限に注意が必要です。その場合、外部のデータベースやAPIとの連携を検討することも一案です

❒CHATGPT

❒Genspark

❒felo

❒X・youtube質問

◆youtubeチャンネル┃AI副業・起業・投資について発信中

AI収益化 研究所┃by 金ときどき幸福