必要なもの
- Googleアカウント
- 画像のURL(Driveに格納している画像も可 ⇦ 今回はこれで)
- スプレッドシート(今回はスプレッドシートベースでアプリ作成)
スプレッドシート内容
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-16.56.51-1024x334.png)
目次
完成イメージ
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-17.12.15.png)
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-17.12.23-758x1024.png)
AppSheetから
+ Create > App > Start with existing data を選択
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-16.51.37-1024x513.png)
アプリの名前をつける
適当に名前をつけて「Choose your data」をクリック!
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-16.53.35-1024x459.png)
データを選ぶ
スプレッドシートを選んで
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-16.55.11-1024x540.png)
使いたいシートを選択
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-16.59.10-1024x620.png)
アプリをカスタマイズ!
「Customize your app」を選択
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-17.00.07-1024x522.png)
Imageのデータ型を確認
おそらくデフォルトでは「Url」になっていると思います。
これを「Image」に変更!!
画面左端のDataアイコンを選択し、Imageに変更し、「Save」
今回はGoogle Driveに保存してある画像を使用しており、そのままのURLを使用しても表示できません。
各画像のIDをメモし、()
以下のような形に書き換えましょう!
元のURL(マーカー部分がID)
https://drive.google.com/file/d/xxxxxxxxxxxxxxxxxxxxxxxxxx/view?usp=drive_link
表示させるためのURL
https://drive.google.com/xxxxxxxxxxxxxxxxxxxxxxxxxx
![](https://xn--2qq737bemhv8wgjh.site/wp-content/uploads/2023/09/スクリーンショット-2023-09-08-17.08.14-1024x448.png)
完成!!