はじめに
【2019年4月版】Google SpreadSheetから音速でPWAが吐きだせるってホントに?!
を拝見して面白そうだったので、自分が欲しいと思っていたアプリ(というよりデータ集)を作ってみました。
本当にあっという間に作れてしまって最高ですね!!!
作成時に疑問に思った点は 公式サンプルアプリ を眺めて解決したのですが、それについて書いてみます。
作成アプリとソーススプレッドシート
まずは参考用に以下リンクです。以降の文章で言葉不足で不明点がありましたら参考にしてください。
- 【アプリ】非公式 BLEACH キャラクターまとめ
- 【ソース】スプレッドシート
【疑問】メニューで項目をタップした後、更に別項目へ展開する機能の実装方法は?
単純にスプレッドシート作っただけだと、この「画面展開→画面展開……」と続ける方法がわからなかったんですよね。
別メニューの画面へリンクが飛ぶわけでもないし……。
【解】List Referenceコンポーネントを使用する
List Referenceコンポーネント、もしくはInline listコンポーネント(後述します)を使用することで、画面展開機能が使えました。
一定の条件を満たさないとコンポーネントの候補にも挙がってこないようなので、以下に手順を記載します。
Step1:展開したい先のデータを用意する
この例では所属組織の説明を表示したかったので、そんなシートを作りました。
Step2:項目名を「項目名=参照先シート名:参照先項目名:Multiple」にする
サンプルアプリのスプレッドシートを見ると 項目名=参照先シート名:参照先項目名:Multiple
としているようなので、それを真似しました。
(……仕様ドキュメントを見ましたという解決方法でなくて申し訳ない。。。
これが何仕様に基づいての記法なのか、ご存知の方いらっしゃったらコメントください)
Step3:参照元項目内容を、参照先項目内容と同一にする
Step4:List Referenceコンポーネントが表示されるようになるので、それを使う
List Referenceコンポーネントを追加してからは、他の項目と同様に編集します。
疑問だった機能を実装することができました!
(余談)Inline listコンポーネントというのもある
「単行本」メニューには、次の動画のように「登場キャラクター」という項目があります。
この項目はInline listコンポーネントを使っています。
これも別シート・別項目を参照して拾ってきてくれる機能です。
項目名に項目名=参照先シート名:参照先項目名:Multiple
を指定するのは同じです。
「『出番』シートにあるn巻のキャラクターを拾ってきてね~」で勝手に参照してくれるの最高ですね……。
現時点のサンプルがキャラクター偏りすぎでその効果が全然現れていませんが!!
おわりに
プログラミングよりデータ準備するほうが時間かかるぅ~~!!(アプリいじる時間が30分ならデータ作成で2時間かかってる)
こういう作品のファンアプリなら、Allow Editingをtrueにしたりスプレッドシート公開して、色んな人で協力してデータ入力するのが良いのでしょうね……。