Udemyで講座を受講しよう!
AppSheet

AppSheetで制作するアプリのトップページを構築する方法

Yujiro Sakaki

こんにちは! Excel講師の榊裕次郎です。

AppSheetでの制作アプリは、トップページを構築することができないため、その代わりにトップページ用のGoogleスプレッドシートを1枚用意し、トップページらしく1枚のページを作成する、といったテクニックを考えてみました。

まず、用意するもの! 正方形サイズのトップページ用画像です。長方形になると、画像が途切れてしまいますので、正方形でご用意ください。

表紙画像が完成したら、最初にGoogleスプレッドシートを作成します。ポイントは、ユニークなIDがないとエラーが出力されるため、No列を作成しておきましょう。

スプレッドシートの名前は「AppSheetTopPage」とつけてみました。

これで準備完了。

AppSheetの管理画面より、[Data]メニューから[Tables]を開いて、[Add New Table]をクリックします。

Googleを選んで、Googleドライブに保存した「AppSheetTopPage」を探しましょう。

ExcelでもOffice365のOneDriveから持ってくることができるので、Excelで上記のことを行っても構いません。ただまあGoogleのほうが相性はよさそうです。

選択が終わったら、[Data]メニュー→[Columns]タブより、各データのTYPEを設定していきます。

最初、表紙画像の項目は[Text]になっているので[image]に変更してください。これで、表紙画像の列のデータ型は画像になりました。

【修正:2020/07/30追記】↑のキャプチャで、Noの項目「SHOW?」がOnになっているので、Offにしてください。これで画面上には表示されません。

次に、[UX]メニューより設定をしていきます。

View Nameは「Home」としました。ここは任意で構いません。For this data はTopPage(←これはGoogleスプレッドシートのシート名が代入されます。Googleスプレッドシートにあらかじめ「シート1」→「TopPage」と名前を入力していました)。

View typeをgalleryに設定し、アプリ上のフッター一番左にアイコンを位置したいので[left most]を設定します。

続いて、その直下の項目です。

Image sizeは Large を選択しました。アイコンはHomeと検索すると、家のアイコンが出てきます。

あとは、右側のプレビュー画面より、画像をアップしていきます。

TypeをImageにすると、ここがこのような項目になるのですね。

画像を選びます。正方形サイズがしっかりと収まります。

これでアップロードできました。

この状態だと、画像をいくつもアップロードできる状態になってしまうのと、表紙に「+」ボタンは不要なので、ここでまた[Data]メニューに戻ります。

TopPageの詳細項目より、更新をRead-Onlyにしておきましょう。これで更新ができなくなり、アップロードした1枚の画像が表紙になる、といった具合です。

最後に、[UX]メニューの[Options]タブより、アプリを起動した初期画面を「Home」に設定しておきます。

これで完了です。

定められたシステムの中での強引なテクニックですが、いつかはアップデートがされ、トップページも管理画面から作れるようになれるといいのですけどね。

2020年7月29日現在、考えに考え抜いたトップページテクニックでした!

Advertisement

メールアドレスが公開されることはありません。 が付いている欄は必須項目です

このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください

  1. kazukichi

    ぐぐって、普通に記事下まで読んでいたら榊さんの記事でした。
    AppsSheetって公開人数によって課金の有無が決まってくるので、どこが課金非課金のボーダーか知りたいです。

    • Yujiro Sakaki

      まだ流行る前に夢中になっていたんだよね。いまは1人月額10ドルで、1人5デバイスまでだったかな? 需要があると本気で開発したいんだけどね。

  2. kazukichi

    ぐぐって、記事読んでいたら榊さんの記事でした。

  3. AppSheetトライアル中

    はじめまして。
    “AppSheet 初期画面”で検索したらこちらのサイトがヒットしたので拝見しました。
    トップページ用に専用シートをつくる、自分ではなかなか思いつかなかったと思います。
    有益な情報のアップ、ありがとうございました。

    • Yujiro Sakaki

      こんにちは。ご連絡ありがとうございます。

      しばらくAppSheetは使っていないので、あれからまた1年更新されたかと思いますが、
      Googleスプレッドシートをデータベースとして使えるのでとても利便性は高いですよね。
      お役にたてて幸いです。ありがとうございました。

ABOUT ME
榊 裕次郎
榊 裕次郎
Excel講師
1981年10月生まれのてんびん座、東京都出身。趣味は、旅行と料理とワイン。2024年は、佐賀県に行って「呼子のイカ」を思いっきり食べたいです。

引き続き、青森・秋田・岩手でのお仕事ご依頼、お待ちしております!
記事URLをコピーしました