Android Q では新しいシステム ナビゲーション モードが追加され、前の画面に戻る、ホーム画面に移動する、デバイスでアシスタントを起動する、などの操作をジェスチャーで行えるようになりました。
 |
| Android Q での新しいジェスチャーのデモ |
システム ナビゲーション用ジェスチャー モデルに移行することにより、アプリが利用できる画面の領域が広がります。つまり、ユーザーの没入感がさらに高まるようなアプリを提供できるようになるとも言えます。
ただし、ユーザーは今後もほとんどのデバイスで、自分が使いたいナビゲーション モードを選択できます。3 つのボタン（戻る、ホーム、最近）による従来のナビゲーション モードがなくなることは当面ありません。このモードは、Android Q 以降を搭載するデバイスでも必須となります。
ジェスチャー ナビゲーションに関して行われた調査やジェスチャーを決定する過程については、Android システム UI 担当プロダクト マネージャーが投稿した以下のブログ記事に詳しく書かれています。
ジェスチャー ナビゲーションの裏話
今回の投稿は、デベロッパーがアプリでジェスチャー ナビゲーションに対応する方法を中心に紹介する短い連載の第 1 回です。この連載では以下のトピックについて取り上げます。
1.アプリのコンテンツを画面いっぱいに表示できるようになる、エッジ ツー エッジへの対応
2.システム UI と視覚的に重なった場合の対処方法
3.アプリのジェスチャーがシステム ジェスチャーと競合した場合の対処方法
4.よくあるシナリオと、それぞれの対応方法
それでは早速、アプリが「エッジ ツー エッジ」に対応する方法をご紹介します。
エッジ ツー エッジ
ここで使っている「エッジ ツー エッジ」という表現には、アプリのウィンドウを全画面に拡張することでユーザーの没入感を高められる、という意味が込められています。アプリがデフォルトで配置されるのは、上部はステータスバーより下、下部はナビゲーション バーより上の領域です（2 つのバーを合わせて「システムバー」と呼びます）。
エッジ ツー エッジに対応することで、アプリはシステムバーの背後に配置されるようになります。これは、アプリのコンテンツを引き立てて、さらに没入感の高いユーザー エクスペリエンスを提供できるようにするためです。
実際に「エッジ ツー エッジ」のアプリにするには、次の 2 点を考慮する必要があります。
ナビゲーション バー背後の描画
ジェスチャー ナビゲーションに対応するにあたり最初に考慮すべき最重要事項は、ナビゲーション バーの背後に描画することです。ナビゲーション バーは以前より小さく、そして目立たなくなっています。そのため、Android Q 以降で動作するアプリについては、より魅力的な最新の UX を実現できるよう、ナビゲーション バーの背後にもコンテンツを描画することを強くおすすめします。
Android Pie 以前を搭載したデバイスでアプリを実行する場合は、ナビゲーション バー背後の描画は必ずしも必要ではなく、どの方法が合理的かを判断したうえで対応していただいてかまいません。とは言え、必要なほぼすべての API は API 21 にさかのぼって機能する（つまり AndroidX が違いを処理する）ので、Android Pie 以前のデバイスに対応するために必要な追加作業の量は最小限で済みます。Pie 以前のデバイスでも、ナビゲーション バーの背後に描画すればユーザーの没入感を高められますが、必要な作業やテストの量を最小限に抑えるため、デベロッパーの裁量に委ねることにしています。
ステータスバー背後の描画
次は、画面上部にあるステータスバーについてです。アプリのコンテンツやレイアウトとの兼ね合いで、ステータスバーの背後に描画するほうが有意義である場合はそのようにすることをおすすめします。たとえば、幅いっぱいに表示される画像は、ステータスバーの背後に描画するのが適したレイアウトと言えます。この場合、デベロッパーは AppBarLayout などを使用して、画面上部に画像を固定します。
 |
| ステータスバーの背後に全幅の画像を配置したアプリの例 |
一方、上部にツールバーを固定していくつかの項目を並べる UI を作成している場合は、ステータスバーの背後に描画してもあまり意味はないかもしれません。また、Android Pie 以前を搭載するデバイスで実行するアプリについては、ナビゲーション バーの場合と同様に、ステータスバー背後の描画に対応するかどうかは完全に任意です。
実装
「エッジ ツー エッジ」の描画は、以下の 3 つのステップで実装します。
1. 全画面配置をリクエストする
最初のステップは、アプリを（Y 軸上で）システムバーの背後に配置するようシステムに伝えることです。そのためには、ビューの API setSystemUiVisibility() を使用し、いくつかフラグを設定します。該当するフラグは次のとおりです。（ソースは
こちら）
この設定により、ビューはナビゲーション バー背後の全画面に配置されるようになります。
 |
| アプリがナビゲーション バーの背後で全画面に配置された状態 |
2. システムバーの色を変更する
アプリが全画面に配置されるようになったら、システムバーの背後にあるコンテンツが見えるように、システムバーの色を変更する必要があります。
Android Q
Android Q で動作するアプリの場合、システムバーの色を完全な透明に設定するだけです。（ソースは
こちら）
Android Q では、どのナビゲーション モードでも、システムバーの要素（時間、アイコン、ドラッグ ハンドルなど）の視覚的保護はすべてシステムが処理するようになりました。つまり、デベロッパー側で対応する必要はありません。システムで行われる処理は、次の 2 種類のいずれかとなります。
動的な色調整
システムバーの要素は、システムバーの背後にあるコンテンツに応じて色が変化します。たとえば、ハンドルの背後に明るい色のコンテンツがあるときは、ハンドルは暗めの色に変わります。反対に、背後に暗い色のコンテンツがあるときは、明るい色に変わります。この処理は、「動的な色調整」と呼ばれています。
 |
| Android Q の動的な色調整 |
半透明スクリム
システムバーの背後に半透明のスクリムを適用する場合もあります。ただしこの処理は、アプリが targetSdkVersion を 29 と宣言した場合にのみ適用されます。アプリのターゲット バージョンが SDK 28 以前の場合は、この自動スクリムは表示されず、ナビゲーション バーは透明になります。
 |
| Android Q のボタン ナビゲーション モードでスクリムが適用された状態 |
この 2 種類の処理はいずれも、システムバーの要素が常に見えるようにするために適用されるものです。システムがどちらの方法を採用するかは、いくつかの要因によって決まります。スクリムが適用されるのは次の場合です。
- いずれかのボタンモード（2 ボタンまたは 3 ボタン）が有効になっている。
- ジェスチャー ナビゲーション モードが有効な状態に対し、デバイスのメーカーが動的な色調整を無効にしている。この理由としては、そのデバイスで色調整処理を行うとパフォーマンスが低下する可能性があることが挙げられます。
 |
| ジェスチャー ナビゲーション モードでスクリムが使用されている例 |
それ以外の場合は、動的な色調整が採用されます。上記の理由は現時点で当てはまるものであり、今後変わる可能性があります。
Android Q でシステムバーの保護を無効にする
システムバーの要素を自動的に保護する処理を必要としない場合、アプリのテーマで android:enforceNavigationBarContrast または android:enforceStatusBarContrast、あるいはその両方を false に設定することで、この機能を無効にできます。
Android Pie 以前
Android Pie 以前のデバイスでもエッジ ツー エッジ対応にする場合は、システムバーの要素を保護するために、システムバーの色を半透明に設定する必要があります。システムバーが暗い色のテーマの場合、不透明度 70% の黒のスクリムから試してみることをおすすめします。（ソースは
こちら）
この不透明度は、背後に表示されるコンテンツに応じて調整してください。明るい色のテーマであれば、明るい半透明の色（例: #B3FFFFFF）に設定してもよいでしょう。
 |
| 暗い色のテーマと明るい色のテーマで、それぞれに適したスクリムを使用した例 |
3. 視覚的な重なり
以上の対応が済んだ後に、アプリの重要なビューがシステムバーの背後に隠れてしまっていることに気付く場合があるかもしれません。3 番目の（つまり最後の）ステップでは視覚的な重なりを処理しますが、これについては
こちらのブログ投稿で解説します。
Posted by
Yuichi Araki - Developer Relations Team
