Becoming a master window fitter (Droidcon London 2017)

Window insets have long been a source of confusion to developers, and that’s because they are indeed very confusing! The system dispatches insets for many reasons, such as drawing behind navigation bars, full-screen immersive modes or handling round displays.

This session will deep-dive on the situations where you need to consider Window Insets, and how you can handle them without resorting to copying random code from StackOverflow. You will learn the answers to questions such as:

‘How do I handle these in my custom view?’, ‘How do I draw behind the status bar?’ and ‘What was the developer of AppBarLayout thinking?!’

Video: https://chris.banes.me/talks/2017/becoming-a-master-window-fitter-lon/

Transcript

1. BECOMING A MASTER WINDOW FITTER @chrisbanes
2. BECOMING A MASTER WINDOW FITTER chris.banes.me/windowfitter
3. What’s a window?
5. 12:00
6. 12:00
7. 12:00
8. Window Every view on screen is in a Window Key event handling Touch event handling Window decor Can think of it as a fancy ViewGroup
9. 12:00 Window
10. 12:00 Activity Window Activities have a Window Activity#getWindow()
11. 12:00 Window Activity Dialogs have a Window too Dialog#getWindow() Dialog
12. 12:00 Window Activity Dialogs have a Window too Dialog#getWindow() Dialog
13. 12:00 Activity
14. 12:00 Activity Activity
15. Why do I have to
 fit them?
16. 12:00
18. S
26. Inset
27. Inset How the system tells you where the system ui currently is, or may later be displayed
28. BECOMING A MASTER WINDOW FITTER History
29. Pre-KitKat
30. Pre-KitKat
31. Pre-KitKat Window is placed in between system bars
32. Pre-KitKat setSystemUiVisibility() Window is placed in between system bars
33. setSystemUiVisibility()
34. SYSTEM_UI_FLAG_VISIBLE SYSTEM_UI_FLAG_LOW_PROFILE SYSTEM_UI_FLAG_HIDE_NAVIGATION SYSTEM_UI_FLAG_FULLSCREEN SYSTEM_UI_FLAG_IMMERSIVE_STICKY SYSTEM_UI_FLAG_IMMERSIVE SYSTEM_UI_FLAG_LIGHT_STATUS_BAR SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR SYSTEM_UI_FLAG_LAYOUT_STABLE SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
35. SYSTEM_UI_FLAG_VISIBLE SYSTEM_UI_FLAG_LOW_PROFILE SYSTEM_UI_FLAG_HIDE_NAVIGATION SYSTEM_UI_FLAG_FULLSCREEN SYSTEM_UI_FLAG_IMMERSIVE_STICKY SYSTEM_UI_FLAG_IMMERSIVE SYSTEM_UI_FLAG_LIGHT_STATUS_BAR SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR SYSTEM_UI_FLAG_LAYOUT_STABLE SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
36. SYSTEM_UI_FLAG_VISIBLE SYSTEM_UI_FLAG_LOW_PROFILE SYSTEM_UI_FLAG_HIDE_NAVIGATION SYSTEM_UI_FLAG_FULLSCREEN SYSTEM_UI_FLAG_IMMERSIVE_STICKY SYSTEM_UI_FLAG_IMMERSIVE SYSTEM_UI_FLAG_LIGHT_STATUS_BAR SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR SYSTEM_UI_FLAG_LAYOUT_STABLE SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
37. SYSTEM_UI_FLAG_VISIBLE SYSTEM_UI_FLAG_LOW_PROFILE SYSTEM_UI_FLAG_HIDE_NAVIGATION SYSTEM_UI_FLAG_FULLSCREEN SYSTEM_UI_FLAG_IMMERSIVE_STICKY SYSTEM_UI_FLAG_IMMERSIVE SYSTEM_UI_FLAG_LIGHT_STATUS_BAR SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR SYSTEM_UI_FLAG_LAYOUT_STABLE SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN chris.banes.me/systemuihelper
38. SYSTEM_UI_FLAG_VISIBLE SYSTEM_UI_FLAG_LOW_PROFILE SYSTEM_UI_FLAG_HIDE_NAVIGATION SYSTEM_UI_FLAG_FULLSCREEN SYSTEM_UI_FLAG_IMMERSIVE_STICKY SYSTEM_UI_FLAG_IMMERSIVE SYSTEM_UI_FLAG_LIGHT_STATUS_BAR SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR SYSTEM_UI_FLAG_LAYOUT_STABLE SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
39. SYSTEM_UI_FLAG_VISIBLE SYSTEM_UI_FLAG_LOW_PROFILE SYSTEM_UI_FLAG_HIDE_NAVIGATION SYSTEM_UI_FLAG_FULLSCREEN SYSTEM_UI_FLAG_IMMERSIVE_STICKY SYSTEM_UI_FLAG_IMMERSIVE SYSTEM_UI_FLAG_LIGHT_STATUS_BAR SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR SYSTEM_UI_FLAG_LAYOUT_STABLE SYSTEM_UI_FLAG_LAYOUT_HIDE_NAVIGATION SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
40. indow lag W F ransform T s View.SYSTEM_UI_FLAG_LAYOUT_STABLE View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN or
41. W F T s View.SYSTEM_UI_FLAG_LAYOUT_STABLE View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN or
42. myView.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
43. myView.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
44. KitKat
45. KitKat
46. KitKat Translucent system bars
47. KitKat Translucent system bars
48. KitKat Translucent system bars android:windowTranslucentStatus android:windowTranslucentNavigation
49. Translucent system bars WTFs are implied KitKat
50. Translucent system bars WTFs are implied System bar backgrounds are drawn by WindowManager KitKat
51. Lollipop
52. Lollipop
53. Lollipop android:windowDrawsSystemBarBackgrounds System bar backgrounds are placed in Window
55. android:statusBarColor getWindow().setStatusBarColor()
56. android:navigationBarColor getWindow().setNavigationBarColor()
57. Lollipop WTFs are not implied
58. Lollipop They take precedence over custom colors Translucent system bars They disable windowDrawsSystemBarBackgrounds
59. BECOMING A MASTER WINDOW FITTER How can you handle this?
60. android:fitSystemWindows="true"
61. android:fitSystemWindows="true" Default View.java behavior: Uses padding to move content within insets
62. 12:00
63. 12:00 android:fitSystemWindows="true"
64. 12:00 android:fitSystemWindows="true" systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
65. 12:00 android:fitSystemWindows="true" systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
66. 12:00 android:fitSystemWindows="true" systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
67. 12:00 android:fitSystemWindows="true" systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN Padding Padding
68. Rule of thumb You probably want to avoid the default behavior of android:fitSystemWindows
69. But the docs say to use it?!
70. But the docs say to use it?! DrawerLayout CoordinatorLayout AppBarLayout CollapsingToolbarLayout
71. DrawerLayout Sets the WTFs for you on API 21+ 12:00
72. 12:00 <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" /> <LinearLayout layout_height="match_parent" layout_width="match_parent">
 <!— toolbar and other content —> </LinearLayout> </DrawerLayout> >
73. 12:00 > fitSystemWindows="true" <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" /> <LinearLayout layout_height="match_parent" layout_width="match_parent">
 <!— toolbar and other content —> </LinearLayout> </DrawerLayout>
74. <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" /> <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> 12:00 fitSystemWindows="true">
75. DrawerLayout 12:00 Uses fitSystemWindows as a signal from children Sets the WTFs for you on API 21+
76. 12:00 <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> fitSystemWindows="true"> />
77. 12:00 <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> fitSystemWindows="true"> />
78. <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> fitSystemWindows="true"> /> fitSystemWindows="true" 12:00
79. <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> fitSystemWindows="true"> /> fitSystemWindows="true" 12:00
80. <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> fitSystemWindows="true"> /> fitSystemWindows="true" 12:00
81. fitSystemWindows="true"> /> fitSystemWindows="true" <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> 12:00
82. fitSystemWindows="true"> /> fitSystemWindows="true" <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent"> <!— toolbar and other content —> </LinearLayout> </DrawerLayout> 12:00
83. fitSystemWindows="true"> /> fitSystemWindows="true" <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent" <!— toolbar and other content —> </LinearLayout> </DrawerLayout> > 12:00
84. fitSystemWindows="true"> /> fitSystemWindows="true" <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent" <!— toolbar and other content —> </LinearLayout> </DrawerLayout> fitSystemWindows="true"> 12:00
85. fitSystemWindows="true"> /> fitSystemWindows="true" <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent" <!— toolbar and other content —> </LinearLayout> </DrawerLayout> 12:00 fitSystemWindows="true">
86. <DrawerLayout layout_height="match_parent" layout_width="match_parent" <NavigationView layout_height="match_parent" layout_width="match_parent"
 layout_gravity="end" <LinearLayout layout_height="match_parent" layout_width="match_parent" <!— toolbar and other content —> </LinearLayout> </DrawerLayout> 12:00 fitSystemWindows="true"> fitSystemWindows="true"> /> fitSystemWindows="true"
87. CoordinatorLayout + AppBarLayout + CollapsingToolbarLayout
88. 12:00 CoordinatorLayout + AppBarLayout + CollapsingToolbarLayout Uses fitSystemWindows as a signal from children Sets the WTFs for you on API 21+
89. <CoordinatorLayout layout_height="match_parent" layout_width="match_parent"> <AppBarLayout layout_height="match_parent" layout_width="wrap_content" /> <CollapsingToolbarLayout> <ImageView id="@+id/poster" /> </CollapsingToolbarLayout> </AppBarLayout> </CoordinatorLayout>
90. <CoordinatorLayout layout_height="match_parent" layout_width="match_parent" fitSystemWindows="true"> <AppBarLayout layout_height="match_parent" layout_width="wrap_content" fitSystemWindows="true" /> <CollapsingToolbarLayout fitSystemWindows="true"> <ImageView id="@+id/poster" fitSystemWindows="true" /> </CollapsingToolbarLayout> </AppBarLayout> </CoordinatorLayout>
91. BECOMING A MASTER WINDOW FITTER Manual handling
92. BECOMING A MASTER WINDOW FITTER What not to do…
93. Fixed dimension for status bar What not to do…
94. <dimen name="status_bar_size"> 24dp </dimen>
95. <dimen name="status_bar_size"> 24dp </dimen> res/values-v23 <dimen name="status_bar_size"> 25dp </dimen> res/values
96. What if the status bar size changes?
97. <Toolbar android:layout_marginTop="24dp" />
99. What happens if devices have different status bar sizes?
100. 53dp 24dp
101. Retrieve internal system resources What not to do…
102. <resources> <!-- The width that is used when creating thumbnails of applications. --> <dimen name="thumbnail_width">192dp</dimen> <!-- The height that is used when creating thumbnails of applications. --> <dimen name="thumbnail_height">192dp</dimen> <!-- The amount to scale a fullscreen screenshot thumbnail. --> <item name="thumbnail_fullscreen_scale" type="fraction">60%</item> <!-- The width used to calculate scale for full screen thumbnail on TV --> <integer name="thumbnail_width_tv">240</integer> <!-- The standard size (both width and height) of an application icon that will be displayed in the app launcher and elsewhere. --> <dimen name="app_icon_size">48dip</dimen> <dimen name="toast_y_offset">64dip</dimen> <!-- Height of the status bar --> <dimen name="status_bar_height">24dp</dimen> <!-- Height of the bottom navigation / system bar. --> <dimen name="navigation_bar_height">48dp</dimen> <!-- Height of the bottom navigation bar in portrait; often the same as
 @dimen/navigation_bar_height --> <dimen name="navigation_bar_height_landscape">48dp</dimen> <!-- Width of the navigation bar when it is placed vertically on the screen --> <dimen name="navigation_bar_width">48dp</dimen> <!-- Height of the bottom navigation / system bar in car mode. --> frameworks/base/core/res/values/dimens.xml
103. frameworks/base/core/res/values/dimens.xml <resources> <!-- The width that is used when creating thumbnails of applications. --> <dimen name="thumbnail_width">192dp</dimen> <!-- The height that is used when creating thumbnails of applications. --> <dimen name="thumbnail_height">192dp</dimen> <!-- The amount to scale a fullscreen screenshot thumbnail. --> <item name="thumbnail_fullscreen_scale" type="fraction">60%</item> <!-- The width used to calculate scale for full screen thumbnail on TV --> <integer name="thumbnail_width_tv">240</integer> <!-- The standard size (both width and height) of an application icon that will be displayed in the app launcher and elsewhere. --> <dimen name="app_icon_size">48dip</dimen> <dimen name="toast_y_offset">64dip</dimen> <!-- Height of the status bar --> <dimen name="status_bar_height">24dp</dimen> <!-- Height of the bottom navigation / system bar. --> <dimen name="navigation_bar_height">48dp</dimen> <!-- Height of the bottom navigation bar in portrait; often the same as
 @dimen/navigation_bar_height --> <dimen name="navigation_bar_height_landscape">48dp</dimen> <!-- Width of the navigation bar when it is placed vertically on the screen --> <dimen name="navigation_bar_width">48dp</dimen> <!-- Height of the bottom navigation / system bar in car mode. -->
104. var resourceId = resources.getIdentifier(
 "status_bar_height", "dimen", "android")
 return resources.getDimensionPixelSize(resourceId)
105. What happens if the internal resource name changes?
107. What if the device does not let you draw behind the status bar?
111. BECOMING A MASTER WINDOW FITTER The supported way: WindowInsets
112. BECOMING A MASTER WINDOW FITTER WindowInsets getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom()
113. BECOMING A MASTER WINDOW FITTER WindowInsetsCompat getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom()
114. 12:00 getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom()
115. 12:00 getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom() 0
116. 12:00 getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom() 72 0
117. 12:00 getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom() 72 0 0
118. 12:00 getSystemWindowInsetLeft() getSystemWindowInsetTop() getSystemWindowInsetRight() getSystemWindowInsetBottom() 144 72 0 0
119. BECOMING A MASTER WINDOW FITTER myView.setOnApplyWindowInsetsListener { view, insets -> // TODO handle insets return insets.consumeSystemWindowInsets() }
120. BECOMING A MASTER WINDOW FITTER ViewCompat.setOnApplyWindowInsetsListener(view) { view, insets -> // TODO handle insets return insets.consumeSystemWindowInsets() }
121. BECOMING A MASTER WINDOW FITTER class CustomLayout : LinearLayout { // yadda yadda override fun onApplyWindowInsets( insets: WindowInsets): WindowInsets { // TODO handle the insets return insets.consumeSystemWindowInsets() } }
122. BECOMING A MASTER WINDOW FITTER class CustomLayout : LinearLayout { // yadda yadda override fun onApplyWindowInsets( insets: WindowInsets): WindowInsets { // TODO handle the insets return insets.consumeSystemWindowInsets() } }
123. BECOMING A MASTER WINDOW FITTER WindowInsets will be passed down until it has been consumed
124. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child dispatchApplyWindowInsets()
125. BECOMING A MASTER WINDOW FITTER Window Decor dispatchApplyWindowInsets() LinearLayout Child Child
126. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 72 0 144 dispatchApplyWindowInsets()
127. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 72 0 144 onApplyWindowInsets()
128. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 0 0 144 onApplyWindowInsets() Consumes top
129. BECOMING A MASTER WINDOW FITTER Window Decor Child Child LinearLayout WindowInsets.isConsumed() Left: Top: Right: Bottom: 0 0 0 144 false
130. BECOMING A MASTER WINDOW FITTER Child Window Decor Child LinearLayout dispatchApplyWindowInsets() Left: Top: Right: Bottom: 0 0 0 144
131. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 0 0 144 onApplyWindowInsets()
132. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 0 0 144 WindowInsets.isConsumed() false
133. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child dispatchApplyWindowInsets() Left: Top: Right: Bottom: 0 0 0 144
134. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 0 0 144 onApplyWindowInsets()
135. BECOMING A MASTER WINDOW FITTER Window Decor LinearLayout Child Child Left: Top: Right: Bottom: 0 0 0 0 WindowInsets.isConsumed() true
136. BECOMING A MASTER WINDOW FITTER Scenarios
137. BECOMING A MASTER WINDOW FITTER I just want to ing draw behind the status bar!
138. DrawerLayout setStatusBackground() Default to ?android:colorPrimaryDark When fitSystemWindows=true
139. CoordinatorLayout setStatusBackground() Default to ?android:colorPrimaryDark When fitSystemWindows=true app:statusBarBackground
140. CollapsingToolbarLayout contentScrim statusBarScrim
141. CollapsingToolbarLayout When fitSystemWindows=true Defaults to @null app:contentScrim Defaults to ?android:colorPrimaryDark app:statusBarScrim
146. <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true" app:statusBarBackground="@color/statusbar_scrim">e 
 <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:adjustViewBounds="true" android:fitsSystemWindows="true" android:src="@drawable/header" />
 <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" android:elevation="@dimen/elevation_toolbar" android:theme="@style/ThemeOverlay.AppCompat.Dark" app:popupTheme="@style/ThemeOverlay.AppCompat.Light" /> </android.support.design.widget.CoordinatorLayout>
147. <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true">e <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" android:src="@drawable/header" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" /> </android.support.design.widget.CoordinatorLayout>
148. <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true">e <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" android:src="@drawable/header" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" /> </android.support.design.widget.CoordinatorLayout>
149. <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true">e <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" android:src="@drawable/header" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" /> </android.support.design.widget.CoordinatorLayout>
150. <android.support.design.widget.CoordinatorLayout android:layout_width="match_parent" android:layout_height="match_parent" android:fitsSystemWindows="true">e <ImageView android:layout_width="match_parent" android:layout_height="wrap_content" android:fitsSystemWindows="true" android:src="@drawable/header" /> <android.support.v7.widget.Toolbar android:id="@+id/toolbar" android:layout_width="match_parent" android:layout_height="wrap_content" /> </android.support.design.widget.CoordinatorLayout>
155. android:fitSystemWindows="true" Uses padding to move content within insets Default View.java behavior:
156. Need to tell CoodinatorLayout to lay out within the insets android:fitSystemWindows="true"
157. Need to tell CoodinatorLayout to lay out within the insets but we also want to stop the default padding android:fitSystemWindows="true" Erm… "
158. val header = findViewById(R.id.header_image) header.setOnApplyWindowInsetsListener { v, insets -> insets }
159. If an OnApplyWindowInsetsListener is set, its onApplyWindowInsets method will be called instead of the View's own onApplyWindowInsets method. “
161. val header = findViewById(R.id.header_image) header.setOnApplyWindowInsetsListener { v, insets -> }A insets
162. val header = findViewById(R.id.header_image) header.setOnApplyWindowInsetsListener { v, insets -> }A v.onApplyWindowInsets( ) insets
164. BECOMING A MASTER WINDOW FITTER TL;DW
165. BECOMING A MASTER WINDOW FITTER If you’re using DrawerLayout or CoordinatorLayout Use android:fitSystemWindows="true" on direct children which you want to be displayed behind the system bars
166. BECOMING A MASTER WINDOW FITTER Avoid translucent system bars <item name="android:statusBarColor">#80000000 </item> <item name="android:navigationBarColor">#80000000 </item>
167. BECOMING A MASTER WINDOW FITTER If you need to get access to the status bar size myView.setOnApplyWindowInsetsListener { view, insets -> val statusBarSize = insets.systemWindowInsetTop return insets }
168. BECOMING A MASTER WINDOW FITTER Repeat once per week I will never store or retrieve the status bar size from resources ever again
169. Over and out… @chrisbanes