Zenn
📝

TheAndroidShow Q&Aセッションメモ

2022/03/12に公開
Android
tech

2022年3月9日に配信された#TheAndroidShow: Tablets, Jetpack Compose, and Android 13のQ&Aセッションが大画面デバイス対応やComposeとの兼ね合いについて言及していて興味深かったので、抜粋してメモ的に書き起こしてみました。

(Q&Aセッションは21:50あたりから)

Q: 大画面のデバイスを使うユーザーにおすすめしたいAndroid 12Lの機能は？

それぞれのおすすめ機能を挙げていっていた

  • タスクバー
    • 分割画面モード、マルチウィンドウモードで複数のアプリを開いてるとき、画面レイアウトを調整するのに便利
  • ドラッグ＆ドロップ
    • （12L以前から入ってるが、分割画面で便利に使える）
  • 通知トレイ
  • 設定
    • 2ペインレイアウトになって見やすくなった

Q: 12Lが試せる端末は？

Q: なぜ「タブレットファースト」？モバイルファーストにはタブレットも含まれない？

  • ユーザーにどうやってアプリを使ってもらいたいかによってデザインのアプローチが変わりそう
  • たとえばドキュメント作成アプリ
    • タブレットなどの大画面デバイスは生産性の高いクリエイティブな作業向き
    • スマートフォンは作ったものを閲覧したりレビューするのに向いている
    • この場合はタブレットでのドキュメント作成のUXを先に考えて、そこでできたUIコンポーネントをスマートフォンの閲覧機能に応用できる
  • スマートフォンの制限に縛られていると、タブレットにデザインを拡大しづらかったりする
  • アプリを単にタブレットの大画面に「対応」させるのではなく、アプリの体験をタブレットで「拡大」させてほしい
  • いくつかのケーススタディでは、大画面デバイスではエンゲージメントが非常に高いという結果がでている
  • タブレットはクリエイティブな作業を長時間行いやすいので、ビジネスチャンスとして検討すべき

Q: 大画面対応は気になるけど大変そう。ツールやライブラリ面でのサポートはある？

  • 10年開発が続いてるようなコードベースでは、すぐに移行するのは難しいことは認識している
  • 12LではJetpack Window Managerの機能をつかってアクティビティを埋め込むことができる
    • 2つのアクティビティを並べて表示できる
    • バックスタックや他のアクティビティへの遷移の挙動を設定できる
    • ほとんど設定のみなのでそんなにコストを掛けずに導入できる
    • ベストではないがベター
  • Jetpack WindowManagerでは画面サイズも取得できる
  • ComposeではViewコードとの互換性がある
    • 既存のViewコードにCompose埋め込んだり逆もできるので徐々に対応させることができる
    • ComposeではUIの要素を簡単に使い回せるので、Viewよりもラージスクリーン対応の労力が少なく済みやすい
  • UIやビジネスロジック、ナビゲーションに関する設計のガイドとなるサンプルも用意している
  • developer.android.comにもドキュメントが載っている

(参考) Unbundling the stable WindowManager | by Pietro Maggi | Android Developers | Feb, 2022 | Medium

Q: XMLで可能な画面サイズ別レイアウトはJetpack Composeではどうやって実装する？

Q: 大画面デバイスに対応するにあたって使えるUIパターンやベストプラクティスは？

  • Canonical layoutsがまず思い浮かぶ

    • Canonical layouts with MDC-Android – Material Design 3
    • 間仕切りのない部屋の間取りみたいに考えることができて、家具（＝UI要素）を部屋に配置していくような感覚で設計できる
    • 大画面デバイスに対応したcanonical layoutを3つ用意した
      • スマートフォンのレイアウトを拡大してラージスクリーン対応させたいときに役立つ

  • 一歩引いて、大画面デバイスに対応したアプリにおける重要なユーザージャーニーは何なのかを考えること

    • スマートフォンはみんな毎日使っているので、UXについて考えることには慣れている
    • ユーザーが期待するユースケースはタブレットでは少し違うので改めて考えてみたほうがいい

  • 2ペインレイアウトなどはガイドも用意している

  • Canonical layoutsのガイダンスはView、Compose両方のサンプルを用意している

    • （📝 Composeのサンプルが見つけられず。どこだろう？）

  • 実装面ではJetNewsの実装も参考になりそう

  • View側はすでにいくつかJetpackライブラリに組み込まれている

    • SlidingPaneLayout
    • Navigation Component
    • ↑はJetpack WindowManagerをつかって実装されている
      • Navigation ComponentはSlidingPaneLayoutにも使われていて、画面サイズに応じて自動的に2ペインレイアウトに切り替えてくれる
      • Preferenceはこれらをもとに実装されている

  • この領域は今でも改良が続いているので、フィードバックがほしい

Q: ChromeOSなどのデバイスでなめらかに画面の大きさを変えたい場合、構成の変更はCompose側で扱ったほうがよい？

  • 基本的にyes
    • 動的にUIを生成しているので、Composeで構成の変更を扱うことでグリッドの列の数を変えたり、2ペインに切り替えたりが可能になる
    • マニフェストに記述するフラグなどについてはサンプルが参考になると思う
    • 「なめらか」という面でもComposeで扱ったほうが各UI要素やレイアウトの遷移をより細かくコントロールできるのでおすすめ
    • サンプルが足りないだと思うので、サンプルを作ることを検討する

Q: ARMタブレットでアプリを直接ビルドして動かせるようなAndroid Studioは提供される？

  • 一応今でもChrome OSでできなくはない
    • ただ端末が限られていて、セットアップも簡単ではない
  • エミュレーターも有用
    • 以前よりも格段にはやくなっているので使ってみてほしい
    • 大画面デバイスへの対応においては実機よりも便利な機能もある

Q: 既存アプリを大画面デバイスに対応させたい。どこから始めればいいか

Discussion