GDG Kyoto IO Extended 2019 2019/05/18

1. Android Q対応
Gestural Navigation
Dark Theme
GDG Kyoto 2019/05/17 @furusin_oriver

2. Android Q で対応が必要なこと
● Gestural Navigation
● Dark Theme
● SYSTEM_ALERT_WINDOW deprecated
● android.preference deprecated
● バックグラウンドでロケーションが必要な場合、追加のPermissionが必要
● Share Sheet
● Bubbles
● etc...

3. Android Q で対応が必要なこと
● Gestural Navigation
● Dark Theme
● SYSTEM_ALERT_WINDOW deprecated
● android.preference deprecated
● バックグラウンドでロケーションが必要な場合、追加のPermissionが必要
● Share Sheet
● Bubble
● etc...
今日はここ

4. Gestural Navigation

5. Gestural Navigation？
画面遷移などのジェスチャーのこと。
Navigation Barの設定によって変わる

6. Navigation Barのタイプ
3-button Navigation
2-button Navigation
Full Gestural Navigation

7. Navigationの動き

8. なぜ生まれたか？
Navigation Barはメーカーによってデザインは異なるため、
アプリ開発は難しくなってきている
そのため、ベースを統一したかった

9. Gestural Navigation
● Gestureは2種類
○ 画面左右からスワイプで「戻る」挙動
○ 画面下部からスワイプでアプリ切り替え
● 将来的には２種類のNav Modeをサポート
○ 3-button Navigation
○ Full Nav Gesture Mode
● Gestureは奪うことも可能

10. Gestureの種類
● 画面左右からスワイプ
○ 「戻る」挙動（右も！）

11. Gestureの種類
● 画面下部からスワイプ：アプリ切り替え
○ 必須。殺せない
○ 指を離したらonPause→onStopが呼ばれる
○ 戻ってきたらonRestart→onResumeが呼ばれる

12. Gestural Navigation対応へのロードマップ
1. UIを “edge-to-edge” にする
2. 端にあるWidgetでGestureと競合するものをいい感じにする
例）DrawerLayoutやImageCropのポイント

13. UIを “edge-to-edge” にする
● Step1. Status Barの後ろにも描画する（推奨）

14. UIを “edge-to-edge” にする
● Step2. Navigation Barの後ろにも描画する（強く推奨）

15. UIを “edge-to-edge” にする
● Step2. Navigation Barの後ろにも描画する（強く推奨）
a. 古いOSバージョンの場合はNavigation Barを半透明にすること
b. ScrollViewとかは一番下に「Navigation Barの分の余白」を追加する必要
がある
c. Bottom SheetsはNavigation Barの領域も含めたサイズにする

16. UIを “edge-to-edge” にする
● 備考
Navigation Barの裏に色の濃いものが来た場合、システムボタンは色が自動で
変わる

17. UIを “edge-to-edge” にする
● Step3. Insets
a. System Window Inset（Navigation Barとか）
i. クリック可能なViewは避けて配置する（例：FAB）
ii. 3 Button Navigation Barの場合は、更に上に設置することになる

18. Gestureと競合するものをいい感じにする
● 画面の端に
ドラッグできるものを
置きたい

19. Gestureと競合するものをいい感じにする
View.setSystemGestureExclusionRects()
で競合を奪うことが可能

20. Gestureと競合するものをいい感じにする
override fun onDraw(canvas: Canvas?) {
//..
ViewCompat.setSystemGestureExclusionRects(this, rects)
}
● setSystemGestureExclusionRectsは
onLayout もしくは onDraw で呼ぶ（onDrawの方がいいかも？）

21. Gestureと競合するものをいい感じにする
override fun onDraw(canvas: Canvas?) {
//..
val isSupplyGestureExclusion = BuildCompat.isAtLeastQ()
if (isSupplyGestureExclusion) {
ViewCompat.setSystemGestureExclusionRects(this, rects)
}
}
● ちゃんとやるならこう？

22. Gestureと競合するものをいい感じにする
・DrawerLayoutとSeekBarは別途AndroidXで対応される
https://developer.android.com/jetpack/androidx/releases/drawerlayout#1.1.0-alpha01
ちゃんと中で
ViewCompat.setSystemGestureExclusionRects(this, rects);
が呼ばれてる
（けど…Javaなんやな…）

23. DrawerLayoutはまだ検討中なのかも

24. Dark Theme

25. なぜ生まれたか？
● アプリをより暗い環境でも使いやすくす
るするため
○ 暗い部屋や暗い環境でも使えるように。アプリ
を使えるシチュエーションを広げる
● バッテリーを守る
○ 最大60%は削減できる
● 目の保養

26. 適用方法
● Force Dark
○ アプリへ自動的にダークモードを適用する
（これだけでイケるかもしれない：Android Qだけで適用される）
● Custom Dark
○ 「ダークモードの時は何色にする」と独自に指定
○ こっちのほうがデザインとして圧倒的に良い（工数はかかる）

27. Force Dark
● 適用方法
○ <item name="android:forceDarkAllowed">true</item>
○ DayNight Themeを使う（Material Componentでもいいです）
<style name="AppTheme" parent="Theme.AppCompat.DayNight">
<style name="AppTheme" parent="Theme.MaterialComponents.DayNight">

28. Custom Dark
● Dark Modeのときに使う -nightリソースも作ることができる
○ 通常：values/themes.xml
○ Dark Mode：values-night/themes.xml

29. AppCompatへ「どのモード？」を伝える
● モードの種別：Int（AppCompatDelegete）
○ MODE_NIGHT_AUTO_BATTERY：バッテリーセーバーがONでナイトモード
○ MODE_NIGHT_NO：ナイトモードを使わない
○ MODE_NIGHT_YES：ナイトモードを常に使う
○ MODE_NIGHT_FOLLOW_SYSTEM：端末の設定に従う
○ MODE_NIGHT_AUTO_TIME：deprecated
AppCompatDelegate.setDefaultNightMode(mode:Int);
getDelegate().setLocalNightMode(mode:Int);

30. 画像もダークテーマ対応が必要
values-night/colors.xml values/colors.xml

31. アプリではテーマを選べるようにすべき

32. ちなみに
● アプリ起動中にDark ThemeのON/OFFを切り替えると、ア
プリが再起動されます
○ onPause
○ onStop
○ onDestroy
○ ↓
○ onCreate
○ onStart
○ onResume

33. まとめ
● Gestural Navigation
○ アプリは画面全体に表示
○ 左右はあける。ただしDrawerLayoutはAndroidXでいい感じにしてくれる
○ どうしても左右にモノを置きたい場合は
View.setSystemGestureExclusionRects(listOf(Rect(a,a,a,a))を使う
● Dark Theme
○ Force Darkで意外となんとかなる
けどなんとかならない所もあるのでThemeでちゃんとやろう
○ アプリでテーマを選べるようにすべき
○ 画像もダークテーマ対応が必要
○ 「対応しないという選択肢」はない

34. ご清聴ありがとうございました