# 空の状態を作成する方法 {% embed url="" %} 空の状態とその作成方法についての2分間の紹介！ 空の状態は、表示するデータがない場合にアプリがどのように表示されるべきかを示します。たとえば、ユーザーのトリップのリストがホーム画面に表示される場合、しかしまだトリップを作成していない場合、空白の画面を表示する代わりに、トリップを作成する必要があることを説明するメッセージを表示することができます。 ![](/files/ltMxS6FnC9ZZhJNYthDV) 空の状態を作成する必要がある主なケースは、検索バーが入力に一致するデータがない場合や、ユーザーがまだデータのない画面に遭遇した場合です。 ### 検索バーの空の状態 検索語句に結果がない場合に空の状態を作成します 1. リストの下に画像を挿入します（これを行うには画面のサイズを拡張する必要があるかもしれません） 2. 画像の[表示](/ja/component-basics/changing-a-components-visibility.md)を調整して、時々表示されるようにします 3. 画像にリストに適用されているフィルターを適用します-- この場合はリストアイテム（等しい、含む、含まない） 4. 画像がアイテム数（が0と等しい）の場合に画像が表示されるように別の[カスタムフィルター](/ja/component-basics/connecting-lists-and-forms-to-a-database/applying-filters-to-lists.md)を適用します 5. 空の状態をテストするためにプレビューを表示します {% hint style="info" %} 検索バーを作成するのに役立つ場合は、[こちら](/ja/how-to/how-to-create-a-search-bar.md)をクリックしてください {% endhint %} ### 空のページの状態 表示するものがない場合に画面のための空の状態ページを作成します（以下の例を参照） 1. リストまたは他のコンポーネントの下に画像を挿入します（これを行うには画面のサイズを拡張する必要があるかもしれません） 2. 画像の[表示](/ja/component-basics/changing-a-components-visibility.md)を調整して、時々表示されるようにします 3. リストアイテムの数が0の場合に画像が表示されるように表示を設定します 4. 必要に応じて、空の状態のためのカスタムフィルターをコンポーネントに追加します 5. 空の状態をテストするためにプレビューを表示します ![](/files/SV1hBK7HGAGutzQHNITg) --- # 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/how-to/how-to-create-an-empty-state.md?ask= ``` 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.