Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Understanding WindowInsets - Android Worldwide

Understanding WindowInsets - Android Worldwide

53b72671be580e70c9795c7eaf35ac12?s=128

Subhrajyoti Sen

July 26, 2021
Tweet

More Decks by Subhrajyoti Sen

Other Decks in Technology

Transcript

  1. Understanding WindowInsets KeepTruckin Subhrajyoti Sen Android Worldwide July 2021

  2. What are Insets?

  3. Insets - Types

  4. Insets - Types • Status Bars

  5. Insets - Types • • Status Bars Navigation Bars

  6. Insets - Types • • • Status Bars Navigation Bars

    Caption Bar
  7. Insets - Types • • • • Status Bars Navigation

    Bars Caption Bar IME
  8. Insets - Types • • • • • Status Bars

    Navigation Bars Caption Bar IME System Gestures
  9. Insets - Types • • • • • • Status

    Bars Navigation Bars Caption Bar IME System Gestures Display Cutouts
  10. Insets Status Bar Navigation Bar

  11. Improving the UI

  12. None
  13. Going Full Screen view.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN

  14. Going Full Screen view.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN On API

    30+
  15. Going Full Screen window.setDecorFitsSystemWindows(false) On API 30+

  16. Going Full Screen WindowCompat.setDecorFitsSystemWindows(window, false) On API 30+ (backward compatible

    till API 21)
  17. Now we have full screen...but

  18. Before After

  19. Fetching WindowInsets

  20. Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> }

  21. Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =

    insets.getInsets() }
  22. Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =

    insets.getInsets( WindowInsets.Type.navigationBars() ) }
  23. Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =

    insets.getInsets( WindowInsets.Type.navigationBars() ).bottom }
  24. Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =

    insets.getInsets( WindowInsets.Type.navigationBars() ).bottom (binding.root.layoutParams as? ViewGroup.MarginLayoutParams)?. bottomMargin = navigationBarHeight }
  25. Fetching WindowInsets insets.getInsets(WindowInsets.Type.navigationBars()).bottom On API 29+

  26. Fetching WindowInsets On API 21+

  27. Fetching WindowInsets WindowInsetsCompat .toWindowInsetsCompat(insets) .getInsets( WindowInsetsCompat.Type.navigationBars() ).bottom On API 21+

  28. Insetter to the rescue

  29. Insetter to the rescue Insetter.builder() .marginBottom(windowInsetTypesOf(navigationBars = true)) .applyToView(rootView)

  30. Done

  31. Not yet...

  32. None
  33. Introduce a notch

  34. None
  35. Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->

    notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top }
  36. Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->

    notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top }
  37. Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->

    notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top }
  38. Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->

    notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top binding.toolbar.updatePadding(top= notchHeight) insets }
  39. Doing more with WindowInsets API

  40. Status Bar Appearance (Earlier) val decor = window.decorView decor.systemUiVisibility =

    decor.systemUiVisibility or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR Light status bar
  41. Status Bar Appearance (Earlier) val decor = window.decorView decor.systemUiVisibility =

    decor.systemUiVisibility or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR.inv() Dark status bar
  42. Status Bar Appearance (Earlier) val decor = window.decorView decor.systemUiVisibility =

    decor.systemUiVisibility or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR.inv() On API 30+
  43. Status Bar Appearance WindowCompat.getInsetsController( window, window.decorView )?.isAppearanceLightStatusBars = false On

    API 21+
  44. Show/Hide keyboard

  45. Show keyboard val controller = WindowCompat.getInsetsController( window, window.decorView ) controller?.show(WindowInsetsCompat.Type.ime())

  46. Hide keyboard val controller = WindowCompat.getInsetsController( window, window.decorView ) controller?.hide(WindowInsetsCompat.Type.ime())

  47. Hide status bar val controller = WindowCompat.getInsetsController( window, window.decorView )

    controller?.hide(WindowInsetsCompat.Type.statusBars())
  48. Check keyboard visibility binding.root.setOnApplyWindowInsetsListener { _, insets -> val visible

    = WindowInsetsCompat.toWindowInsetsCompat(insets) .isVisible(WindowInsetsCompat.Type.ime()) }
  49. New APIs in Android 12

  50. Rounded Corners

  51. Rounded Corners android.view.RoundedCorner

  52. Rounded Corners android.view.RoundedCorner WindowInsets.getRoundedCorner(int position)

  53. Privacy Indicators

  54. Privacy Indicators WindowInsets.getPrivacyIndicatorBounds() : Rect

  55. @iamsubhrajyoti