この記事は Oscar Wahltinez による Android Developers Blog の記事 "What's new in foldables, tablets, and large screens" を元に翻訳・加筆したものです。詳しくは元記事をご覧ください。
ユーザーは より大きな画面で、かつ、1 台のデバイスのみを活用し、より多くのことができることに価値を見出しています。大画面デバイスに対応したアプリは、その価値をさらに高めることができます。
折りたたみ式デバイスは、大きな画面を持つデバイスの使い勝手を向上させました。タブレットのような画面サイズのデバイスをポケットに入れて持ち運べる様になり、従来型のスマートフォンでは実現の難しかった使い方ができるようになります。アプリのエコシステムへの影響について考えると、とてもワクワクします。このハードウェアの大きな変化は、スマートフォンで新しくできるようになることがあるに違いない、という期待をもたらしているからです。私たちは、この大画面化の流れは、タブレットにも及ぶと考えています。同じようなアプリ エクスペリエンスでも、画面の大きいデバイスで操作した場合は、段違いに評判が良くなります。
このブログ記事では、大画面向けにアプリを準備するときに何をすべきか、アプリの開発を効率化する最近のアップデートについてご説明します。まずはじめに、大画面についての私たちの考えと、アプリを最適化するべき理由についてお話しします。
この 1 年で、各社が新しい折りたたみ式デバイスやタブレットを発表しています。また、ユーザーが自宅で新型デバイスを使ってより多くのことをしようとしているため、需要も増加しています。つまりデベロッパーの皆さんは現在、Android の大画面デバイス向けにアプリを開発すると、2 億 5,000 万台以上のアクティブな折りたたみ式デバイス、タブレット、Chromebook にリーチすることができます。タブレット の売上は 2020 年に16% 増加し、アナリストは 2023 年までに 4 億台以上の Android タブレットが登場すると予想しています。また、Android アプリは、現在 2 番目に人気のあるデスクトップ OS である ChromeOS でも動作します。
大画面化によって、ユーザーのデバイスとの付き合い方が変わりつつあります。このようなデバイスでは、メモを見ながらスライドデッキを編集したり、夜の外出に備えておすすめのレストランを調べたり、友達とチャットしながらビデオを見たりすることができます。ここでは、アプリを大画面に対応するためにサポートしなければならない機能である、基礎レベルのサポートについて説明します。大画面に対応するためには、主に 大きく分けて 3 つのカテゴリに注目します。
これらについて以下にまとめますが、詳しくは大画面アプリの品質ガイドラインを必ずご覧ください。
最初のステップは、アプリを確実に大画面向けに設計することです。これを簡単にするために、特定のウィンドウサイズのブレイクポイントとデバイスクラスを定義して、デベロッパーが最適化できるようにしました。最短のサイズが 600dp 以上のディスプレイにはタブレットレイアウトを追加し、アプリが端から端まで表示されるようにします。また、大画面は横向きで使用されることが多いため、デベロッパーはアプリが縦向きと横向きの両方で使用されるように考慮する必要があります。画面のスペースをより有効に活用できるように、マテリアル アダプティブ コンポーネントをご用意しました。詳しくは後ほどご説明します。
分割画面(またはマルチウィンドウモード)への移行や、ドラッグ&ドロップのようなジェスチャーによる操作は、ユーザーが大画面デバイスでシームレスに動作することを期待する、自然なインタラクションになりつつあります。
アプリのサイズを変更可能にすることで、アプリをシームレスにマルチタスク対応にできます。また、画面の折りたたみ/ 展開イベントを適切に処理し、アプリをマルチウィンドウモードに対応させることで、アプリがレターボックス表示になることを防げます。
多くの人は生産性を高めるためにより大きな画面を使います。そのため、タブレットは基本のキーボード、マウス、スタイラスの使用をサポートする必要があります。
Jetpack と Material Design ライブラリの UI コンポーネントをアップデートし、スマートフォンの UI を大画面に拡大しても柔軟なユーザー エクスペリエンスを開発できるようになりました。
アプリを大画面に最適化するときに最もよく使われるアダプティブ レイアウトの 1 つが、一覧・詳細UI です。例えば、メッセージングアプリでは、片側にメッセージを一覧表示し、もう片側にメッセージの詳細を表示します。
SlidingPaneLayout ライブラリのアップデート版を使うと、小さな画面では上下に重なってしまう UI も、簡単に横に並べることができます。2 ペインスタイルのレイアウトをサポートするためにアップデートされた SlidingPaneLayout は、2 ペインの幅を使って UI のレイアウトを決定します。これは、コンテンツの幅と利用可能なスペースに基づいて、横に並べることができるかどうかを自動的に判断して実行します。例えば、リストペインの 最小幅が 200dp、詳細ペインが 400dp 必要と測定された場合、SlidingPaneLayout は、少なくとも 600dp の幅が利用可能であれば、自動的に2つのペインを横に並べて表示します。
折り目やヒンジなどのディスプレイの特徴を認識する機能も追加しました。例えば、ヒンジ付きのデバイスで画面の一部が遮られている場合、自動的にコンテンツをどちらかの画面に配置します。
ロックモードも導入しました。ロックモードでは、ペインが重なったときのスワイプ動作をコントロールできます(プログラムによる切替もサポートされます)。例えば、ユーザーがスワイプで空のペインに移動するのを防ぐために、リストのアイテムをクリックしてそのペインの情報を読み込ませ、スワイプでリストに戻れるようにすることができます。2 つのビューを横並びで表示する大きさがある折りたたみ式デバイスやタブレットでは、ロックモードは無視されます。
垂直ナビゲーション レールは、機能的にはボトム ナビゲーションと同等で、より大きな画面のナビゲーションの使用感を改善し、UI のサイズを調整する時に、NavRail が指が届く範囲内に配置することをサポートします。スマートフォンは下向きに持つユーザーが多いですが、タブレットなどより大きいサイズのデバイスは横向きに持つことが多いからです。
例えば、縦スクロールが重要なアプリの場合に、NavRai lが役立ちます。このような場合、ナビゲーション バーが下部にあると表示できるコンテンツの量が減ってしまいます。特に、タブレット デバイスを横向きに使っている場合に、より顕著になります。
他にも、複数のコンポーネントをアップデートしました。アプリを大画面対応するときの最大の落とし穴の 1 つは、UI要素が画面全体に引き伸ばされることです。これを防ぐために、この問題が最も多く発生する要素、例えば下のような要素にデフォルトのmax-width を追加しました。
今後、他の要素にも同じ対応を行う予定です。これらの変更により、独特のデフォルトが提供され、アプリを大画面デバイス対応にし、アプリのレイアウトが崩れないようにサポートします。追加設定は必要ありません。コンポーネントのサイズ制限に関する詳細は、マテリアル デザイン ガイドラインをご覧ください。
UI のサイズ調整をサポートするコンポーネントのアップデートだけではなく、これらのデバイスでより良いエクスペリエンスを開発するための WindowManager Jetpack ライブラリを提供しています。このライブラリは、現在アルファ版が公開されており、折りたたみ式デバイスやタブレットをはじめとするさまざまなデバイスタイプに対応する一般的な API サーフェスを提供しています。
WindowManagerを使用すると、折り目やヒンジなどのディスプレイの特徴を検出することができます。また、そのディスプレイ機能がアプリにどのような影響を与えるかについての情報も提供されるので、最適なエクスペリエンスを生み出すことができます。例えば、ユーザーが動画を見ているときにデバイスがテーブルトップ モードに折り畳まれた場合、折りたたみ式デバイスの状態変化に反応します。
WindowManager では、API レベル 14 以降の下位互換性のある方法で、現在および最大の WindowMetrics 情報を取得する便利なメソッドもいくつか提供します。
アプリは、各デバイスに適切にコンテンツを表示するために、画面またはディスプレイのサイズを決定する必要があります。WindowMetrics API を導入したため、ディスプレイ サイズに関連する多くのメソッドが非推奨となりました。下位互換性のある代替手段として、Window Manager Jetpack ライブラリを使用する必要があります。
Android 10 では、「トップの再開アプリ」が 1 つになり、複数の再開アプリを同時に実行することが可能になりました。ほとんどのアプリケーションは、アップデートの必要なくこの変更の恩恵を受けます。ただし、マイクやカメラなどの排他的なリソースを使用しているアプリケーションは例外です。詳細については、以前のブログ記事(英語)をご覧ください。
アプリを大画面に最適化することで、ユーザー エクスペリエンスが改善され、ビジネスの成果につなげることができます。Google Play では、大画面での利用機会を活用するアプリが増えています。例えば、Google Duo は、タブレットと折りたたみ式デバイスのサポートを実装してユーザー エクスペリエンスを向上させ、アプリの評価とユーザー エンゲージメントの向上に繋がりました。
Google Duo の折りたたみ式デバイス対応最適化エクスペリエンス(Samsung Galaxy Z Fold2 など)
Google Duo のユーザー エクスペリエンスの向上に加えて、多くのアプリでアダプティブ レイアウトを採用し、大画面や折りたたみ式デバイスでの利用が可能になりました。
折りたたみ式デバイスおよび大画面デバイスの詳細については、以下の関連情報も併せてご覧ください。