AppSheet のパソコン向けのデザインはパソコンのブラウザ用に最適化されており、一貫性のある体系と構造でより完全な情報の表示を可能にします。パソコン向けのデザインにより、アプリ内の移動がより簡単になり、コンテキストに沿って情報にアクセスできます。また、コンテキストを失うことなく既存のレコードを編集する効率的な方法が提供されます。
パソコン向けのデザインは、モバイル デバイスで表示されるアプリには使用できません。この場合、アプリはモバイル デバイス用に最適化されます。
パソコン向けのデザインの例を次に示します。
上の画像でハイライト表示されているように、パソコン向けのデザインでは次のことを行えます。
- 左側のナビゲーション バーには、プライマリ ビューとメニュー ビューへのリンクがあります。ナビゲーション バーは開閉できます。図のように、閉じた状態では、アイコンとツールチップで簡単にビューを識別できます。
- コレクション（カード、デッキ、ギャラリー、テーブル）と詳細ビューは、同じページの別々のパネルに表示されます。フォーカスを調整するには、タブ付きビューに展開するか、ビューパネルのサイズを変更します。詳細ビュー用にパソコン用レイアウトをカスタマイズするには、詳細ビューのオプションを設定します。詳細ビューに Show 型の列が含まれるように設定すると、詳細の各カードのタイトルとしてページのヘッダーが表示されます。（モバイル デバイスでは、ページのヘッダーは表示されず、セカンダリ ヘッダーのみが表示されます。）
- アイテムをグループ化することでコレクション ビューをフィルタできます（[グループ化] を使用して設定）。
- ビューで行う主な操作は、パネル上部のナビゲーション バーに表示されます。
- 行のコンテンツを編集する場合、その場でコンテンツを編集したり、別のフォームでコンテンツを編集したりできるように、編集エクスペリエンスをカスタマイズできます。詳しくは、[Desktop behavior] オプションをご覧ください。
- 詳細情報は詳細ビュー内のカードブロックとして表示できます（テーブル内の Show 型列を使用して設定）。詳しくは、詳細ビューでカードブロックを構成してパソコン向けのデザインを最適化するをご覧ください。
- 書式ルールを使用してアイコンの色を個別にカスタマイズできます。
以下の各セクションでは、パソコン向けに最適化されたデザインについて詳しく説明します。
制限事項と報告されている問題
次の機能は現在、パソコン向けのデザインでサポートされていません。
- スマート アシスタント
- 共有ボタンは使用できません。ビューを共有するには、URL をコピーして貼り付けてください。共有相手はアプリにアクセスできる必要があります。
新しいパソコン向けのデザインに関する既知の問題は次のとおりです。
- テキストサイズのスタイル設定は、現時点ではサポートされていません。
- グループ化アクションの場合:
- 複数のナビゲーション アクションを指定しても、実行されるのは 1 つだけです。また、グループ化アクションの実行も終了します。
- 検証ルールは、グループ化アクションの各ステップで適用されます。
- アクション タイプが Data: add a new row to another table by using values from this row actions（データ: この行アクションの値を使って別のテーブルに新しい行を追加する）の場合、ID が指定され、行を追加するテーブルに存在する場合、そのアクションはブロックされます。
- ビューでヘッダーによってグループ化する場合、最後のヘッダーによるグループにはインラインまたは
REFビューのアクションは含まれません。 - カスタムアプリ ランチャーを使用している場合や、異なるデスクトップ モードを使用するアプリ間を移動する場合、ナビゲーション パターンで予期せぬ結果が発生する可能性があります。
- 背景画像は現在サポートされていません
既存のアプリをパソコン向けのデザインに最適化する
既存のアプリをパソコン向けのデザインに最適化するために、以下を検討してください。
- ダッシュボード ビューの使用方法を再検討する
たとえば、ダッシュボード ビューを使用して、1 ページの中により多くの情報を表示したことがあるかもしれません。パソコン向けに最適化されたデザインでは、ダッシュボード ビューを使用しなくても、このレベルの情報がデフォルトで提供されます。 - 以前のパソコン用エクスペリエンスを改善するために実装されたデザイン要素を見直す
以前のパソコン用のレイアウトを改善するために、デザイン要素を独自に構成しているかもしれません。これらの要素は不要になる場合があります。 - アプリのインタラクションを徹底的にテストする
アプリ内で軽微な変更を加えたい箇所が見つかるかもしれません。
以前のパソコン向けのデザインを使用する
以前のパソコン向けのデザインでは、モバイルやタブレット デバイスに似かよったエクスペリエンスを提供しています。以前のパソコン向けのデザインの詳細ビューの例を次に示します。前の図でハイライト表示したように、
- 詳細ビューは、コレクション ビューとは別のページに表示されます。コレクション ビューを表示するには、前に戻る必要があります。
- プライマリ ビューのナビゲーション バーは画面下部に表示されます。メニュー ビューのナビゲーションはプルダウンで表示されます（コレクション ビューからのみアクセス可能）。
- 主要機能は、オーバーレイ（フローティング）アイコンとして表示されます。
新しいアプリを作成すると、パソコン向けに最適化されたデザインが有効になります。パソコン向けに最適化されたデザインを無効にすることで、以前のパソコン向けのデザインを引き続き使用できます。ビューの一般設定を構成する場合は、[General] セクションの [Desktop mode] の設定をオフにします。