AppSheetで爆速ノーコードアプリ開発 その９ - アプリの日本語化とデプロイ
カカト@ノーコード開発推しです。
「AppSheetで爆速ノーコードアプリ開発」と題して、ノーコードアプリ開発ツール 「AppSheet」の基本的な使い方の説明を連載形式で投稿しています。
今回が、爆速ノーコードアプリ開発としての最後の投稿になります。
アプリ起動時の初期画面設定や、アプリ内表示の日本語化など行い、デプロイまでしたいと思います。
アプリの初期画面の設定
７回目の投稿で、"ホーム"という名前でダッシュボードのViewを作りましたので、このViewが起動時に表示される画面になるよう設定したいと思います。
「UX」メニュー → 「Options」タブをクリックし、「Starting view」を "ホーム" に変更します。
SAVEボタンを押して、設定を保存します。
すると、シュミレーション画面（画面右）がリロードされますので、ホームのViewが表示されるようになります。
アプリのテーマ、背景色、ロゴを変える
続いては、アプリ自体の見た目を弄ってみたいと思います。
「Brand」タブをクリックすると、以下の項目が表示されます。
Theme
ライト（標準）か ダークモードから選択できます。
Primary color
アプリのメニューやボタン等の背景色を設定できます。
なお、メニューバーを指定した背景色で塗りつぶしたい場合、Header & Footerにある、「Style」を真ん中の "Colored" にしてください。
App logo
アプリのロゴを設定できます。自作のロゴも利用可能です。
Launch image
アプリの起動や同期処理時に表示する画像を設定できます。
Background image
アプリの背景（データやオブジェクトが表示されていない箇所）の画像を設定できます。以下赤枠で囲ったところです。
続けて、Header & Footer です。
Show view name in header
ON にすると、Viewの名前がアプリ上部に表示されます。
Show logo in header
ON にすると、アプリのロゴがアプリ上部に表示されます。
Hide menu and search buttons
ON にすると、検索機能（虫眼鏡マーク）とサイドメニューが非表示になります。
Style
これは先ほど説明したので割愛します。
アプリ内表示項目の日本語化
最後に、アプリ内で表示されている項目の日本語化をしてみましょう。
なお、ここで指す「項目」とは、Viewで表示されている列名ではなく、アプリ自体が持つ項目やボタン名のことです。
例として、Detail viewでデータを編集する際に表示される、"Cancel" や "Save" ですが、これは Columns や View で表示される値の変更はできません。
これらを変更するには、「UX」メニュー にある、「Localize」タブで一つずつ設定していく必要があります。
試しに、Save と Cancel をそれぞれ、"保存" と "取消" に変えてみましょう。
変更したSAVEボタンを押して保存すると、
画面の表示が設定した値に変わりました。
なお、この Localize タブからの表示値変更ですが、現時点で全ての項目に対応していない（例：サイドメニューに表示される App Gallery とか）ようで、一部は英語で残ってしまいます。
また、Excelに設定した値を読み込んだりすることはできないので、アプリ毎に手入力で設定する必要があります。
沢山アプリを作っていきたい！ という方は、Localize設定したアプリをひな形として保存しておき、それをコピーして作れば手間いらずかもですね。
アプリ名の変更
そういえば大事なことを説明するのを忘れていました。
最初にアプリ開発環境を作成した際、アプリ名には英数字以外入らないので、名称を "kennon app" として作りましたが、このままだと何のアプリかわからないので、アプリ名を変更します。
「Info」メニュー をクリックし、「Properties」タブをクリックします。
App Propertiesの、「Short Name」にアプリ名が設定できますので、"検温履歴管理アプリ" とでも入力します。
すると、エディタの左上の部分が変わり、アプリのサイドメニューのアプリ名にも反映されました。
なお、Properties タブでは他にも、アプリのバージョンや説明、利用規約などの設定ができます。
これで諸々の設定が終わりましたので、最後にアプリを（試しに）デプロイしたいと思います。
アプリのデプロイ
アプリ開発環境の左メニューにある、「Not Deployed」をクリックします。
すると、AppSheetがデプロイ可否のチェックを自動で行い、その結果が表示されます。
Passedは合格、Warningは警告なので（多分）ほっといても問題なしですが、下にスクロールすると "Account status" でエラーが表示されていますので展開して詳細を見てみます。
Invalid subscription plan: kennonapp-2059519: User signin not allowed with the FREE plan, kennonapp-2059519: Offline access not allowed with the FREE plan
「フリープランでは、ユーザーサインインは許可されていません と、オフラインアクセスは許可されていません」 ということらしいです。
無料プランの状態でデプロイするには、いくつか設定を変えないとデプロイチェックは通らないようです。
ユーザーサインイン
「Security」メニュー → 「Require Sign-in」タブにある、「Require user signin?」のトグルをオフにします。
ちなみにオンにした場合、Authetication providerで指定した認証プロバイダを使ったログイン機能を実装することができます。
たとえば"Google"を指定した場合、ユーザーはGoogleアカウントでアプリにログインすることができます。
アプリ内では、USEREMAIL()関数でログインID（GoogleだとGmailのアドレス、以外のプロバイダは未確認・・）を参照することができ、この値をテーブルに持つことでログインIDでフィルタをかけ、"自分しかデータの変更ができない" などの制御を実装することができます。
無料プランでデプロイするとこの機能は使えませんので、オフにしておきます。
オフにすると、画面が以下のように表示されますので、「Yes, the data in this app is public」と、「Yes, I am authorized to set up an insecure app」のトグルをオンにします。
ユーザーサインインが無い ということは、URLさえ知っていれば誰でもアクセス可能かつデータの改変が可能なので、「その辺わかっているよね？」てのの確認になります。
今回はテスト的にデプロイし、直ぐプロトタイプに戻しますのでオンにして進めましょう。
オフラインアクセス
「Behavior」メニュー → 「Offline/Sync」タブに行き、
Offline Use の、「The app can start when offline」をオフにします。
インターネットに接続できない環境でもアプリ利用を可能にするようですが、これも無料プランでは使えないようなのでオフにします。
設定変更できましたら、SAVEしてメニューにある「Not Deployed」をクリックしてください。
F5キーで画面をリフレッシュすると、以下の表示になりますので 「Run deployment check」をクリックします。
エラーが無ければ以下のように表示されますので、「Move app to deployed state」をクリックします。
メニューのステータスが、"Deployed" に更新されました。
なお、アプリをプロトタイプに戻すには、Deployment check画面の「Return to prototype state」をクリックすると戻ります。
ちなみに、AppSheet機能の評価やリリース前のテストであれば最大１０ユーザーまでプロトタイプとして利用可能なようです。
製品として使ったりホワイトラベルアプリを作る際にはデプロイが必要ですが、その際はプランによって利用できる機能が異なりますのでご注意ください。
以下のページが参考になると思います。
AppSheet公式
AppSheet使用ライセンスについて調べてみた
終わりに
全９回（どうせならキリよく１０回にすればよかった）に渡り、AppSheetを使ったノーコードでのアプリ開発方法をお伝えしてきましたが、いかがでしたでしょうか？
「AppSheetの基本的な使い方や、アプリ開発の流れがなんとなくわかった！」と感じて頂ければ幸いです。
今回は、データやユーザーインターフェース周りといった基本機能の説明まででしたが、AppSheetは他にもワークフローやレポーティング機能、外部サービスとの連携、App関数を使ったなんやかんや・・等をノーコードで実装することができますので、その辺は今後まとめて投稿していきたいと思います。
最後までお読みいただき、ありがとうございました。
この記事が気に入ったらサポートをしてみませんか？