# クラスリストスクリーン

<figure><img src="/files/EvSKgLwusI1yxigoVMm6" alt=""><figcaption></figcaption></figure>

クラスリスト画面は特定のカテゴリ内のすべてのクラスを表示するために使用されます。この画面は、ユーザーがカテゴリリスト画面でカテゴリアイテムをクリックしたときに見つかります。クラスリスト画面には、サイドナビゲーションコンポーネント、シェイプコンポーネント、パンくずリストグループ、テキストコンポーネント、リストコンポーネントなど、いくつかのコンポーネントが含まれています。

## コンポーネント

### **サイドナビゲーション**

サイドナビゲーションは、ユーザーがナビゲートする画面ごとに表示されるべきです。ユーザーが探している情報を見つけるのに役立ちます。この機能テンプレートでは、この画面では（「カテゴリリスト」画面のサイドナビゲーションコンポーネントと比較して）何もハイライトされていないことに気づくでしょう。ユーザーがこの画面に着陸すると、サイドナビゲーションを介してナビゲートすることはありません。

<figure><img src="/files/vOw9EFoWR9HivrTNyiLt" alt="" width="196"><figcaption></figcaption></figure>

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

### **シェイプコンポーネント — 戻るボタン**

このコンポーネントは、ユーザーが前のページに戻るのを助けるボタンとして機能します。

<figure><img src="/files/YB0K0gA8rS6NRg7vcreY" alt="" width="126"><figcaption></figcaption></figure>

⚡ **シェイプアクション**

このシェイプには、「戻る」に移動するリンクアクションが含まれています。

### グループ — パンくずリスト

グループは複数のコンポーネントからなり、1つのユニットとして機能します。このグループには、いくつかのアイコンコンポーネントとテキストコンポーネントが含まれています。Magic Textを介してデータベースに接続されているものは何もないため、データベースで行われた変更はこのグループに影響しません。

<figure><img src="/files/WhQb1oBPeVOIxN05iEi5" alt=""><figcaption></figcaption></figure>

ハイライトされた緑の領域は、ユーザーがいる画面を示し、薄い灰色のテキストはユーザーにさらに行動をとることができることを示しています。

⚡ **パンくずリストアクション**

テキスト「すべてのクリニック」には、「カテゴリリスト」画面に移動するリンクアクションが含まれています。

### テキストコンポーネント — 2つのコンポーネント

<figure><img src="/files/qgioYKO4id2D5USBTcwq" alt="" width="335"><figcaption></figcaption></figure>

各コンポーネントは、データベースに接続されており、「現在のカテゴリ」から「名前」を表示し、「現在のカテゴリ」から「長い説明」を表示します。これはMagic Textとして知られています。

ユーザーが「カテゴリリスト」画面からカテゴリを選択すると、Adaloはこれを「現在のカテゴリ」と定義し、その後、選択したカテゴリに関連する情報を表示するためにMagic Textを介して選択できます。

<figure><img src="/files/fZazb6LOTbidTCSBnYyU" alt="" width="353"><figcaption></figcaption></figure>

\### \*\*リストコンポーネント — デスクトップ＆タブレットリストおよびモバイルリスト\*\*

リストコンポーネントはデータベースに接続され、Classes Collection からの情報を表示します。

<figure><img src="/files/gFZx1ebColyF8TalzXmn" alt="" width="375"><figcaption></figcaption></figure>

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

<figure><img src="/files/6fn9XKU8HAdgwQ0Lb4cg" alt="" width="354"><figcaption></figcaption></figure>

このフィルターがないと、コレクション内のすべてのクラスが、その利用可能性やカテゴリに関係なく表示されます。

{% hint style="info" %}
モバイルビューに切り替えると、レイアウトが2列から1列に変更される「Mobile List」という追加のリストコンポーネントがあります。その他の機能は変わりません。

リストの1つのバージョンに変更を加え、他のビューにもその変更が反映されるようにしたい場合は、両方のバージョンを変更する必要があります。
{% endhint %}

⚡ **リストアクション**

リストカード内の「詳細を見る」ボタンには、'Class Details'画面へのリンクアクションがあります。


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.adalo.com/ja/feature-templates/browse-purchase-and-manage-classes/classes-list-screen.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.