# クラスリストスクリーンクラスリスト画面は特定のカテゴリ内のすべてのクラスを表示するために使用されます。この画面は、ユーザーがカテゴリリスト画面でカテゴリアイテムをクリックしたときに見つかります。クラスリスト画面には、サイドナビゲーションコンポーネント、シェイプコンポーネント、パンくずリストグループ、テキストコンポーネント、リストコンポーネントなどが含まれています。 ## コンポーネント ### **サイドナビゲーション** サイドナビゲーションは、ユーザーがナビゲートする画面ごとに表示されるべきです。ユーザーが探している情報を見つけるのに役立つ重要な要素です。この機能テンプレートでは、この画面では何もハイライトされていないことに気づくでしょう（「カテゴリリスト」画面のサイドナビゲーションコンポーネントと比較して）。ユーザーがこの画面にアクセスすると、サイドナビゲーションを介してのナビゲーションは行われなくなります。

{% hint style="info" %} サイドナビゲーションコンポーネントの1つの画面で何かを変更した場合、他の画面のサイドナビゲーションのすべてのインスタンスを変更する必要があります。これは、Mac上でCMD + C（コピー）およびCMD + V（貼り付け）を使用して行うことができます。 {% endhint %} ### **シェイプコンポーネント — 戻るボタン** このコンポーネントは、ユーザーが前のページに戻るのを助けるボタンとして機能します。

⚡ **シェイプアクション** このシェイプには、「戻る」に移動するリンクアクションが含まれています。 ### **グループ — パンくずリスト** グループは複数のコンポーネントからなり、1つのユニットとして機能します。このグループには、いくつかのアイコンコンポーネントとテキストコンポーネントが含まれています。Magic Textを介してデータベースに接続されているものは何もないため、データベースで行われた変更はこのグループに影響を与えません。

ハイライトされた緑の領域はユーザーがいる画面を示し、薄い灰色のテキストはユーザーにさらに行動をとることができることを示しています。 ⚡ **パンくずリストアクション** テキスト「すべてのクリニック」には、「カテゴリリスト」画面に移動するリンクアクションが含まれています。 ### テキストコンポーネント — 2つのコンポーネント

各コンポーネントはデータベースに接続されており、「現在のカテゴリ」から「名前」を表示し、「現在のカテゴリ」から「長い説明」を表示します。これはMagic Textとして知られています。ユーザーが「カテゴリリスト」画面からカテゴリを選択すると、Adaloはこれを「現在のカテゴリ」と定義し、その後、選択したカテゴリに関連する情報を表示するためにMagic Textを介して選択できます。

### リストコンポーネント — デスクトップ＆タブレットリストおよびモバイルリストリストコンポーネントはデータベースに接続されており、Classes Collectionから情報を表示します。

このリストはフィルターを含んでいるため、選択したカテゴリのClassesのみが表示され、各Classが利用可能であることが保証されます。

このフィルターがないと、コレクション内のすべてのクラスが、利用可能性やカテゴリに関係なく表示されます。 ⚡ **リストアクション** リストカード内の「詳細を見る」ボタンには、「Class Details」画面へのリンクアクションがあります。 {% hint style="warning" %} モバイルビューに切り替えると、2列から1列にレイアウトが変更される「Mobile List」という追加のリストコンポーネントがあります。その他の機能は変わりません。リストの1つのバージョンに変更を加え、他のビューにもその変更が反映されるようにしたい場合は、両方のバージョンを変更する必要があります。 {% endhint %}