Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Features
Speaker Deck
PRO
Sign in
Sign up for free
Search
Search
Understanding WindowInsets - Android Worldwide
Search
Sponsored
·
Ship Features Fearlessly
Turn features on and off without deploys. Used by thousands of Ruby developers.
→
Subhrajyoti Sen
July 26, 2021
Technology
380
0
Share
Understanding WindowInsets - Android Worldwide
Subhrajyoti Sen
July 26, 2021
More Decks by Subhrajyoti Sen
See All by Subhrajyoti Sen
Understanding Incremental Processing in the JVM World
subhrajyotisen
0
30
Updated Lessons from a KMP Developer's Toolkit
subhrajyotisen
0
57
Building Mobile Apps and Scaling them
subhrajyotisen
0
61
Compose Previews as a Power User
subhrajyotisen
1
210
Understanding WindowInsets
subhrajyotisen
0
250
Exploring a KMM Developer’s Toolkit
subhrajyotisen
1
260
Shipping Apps Confidently with Firebase
subhrajyotisen
0
120
Understanding WindowInsets
subhrajyotisen
1
230
Demystifying Styles and Themes
subhrajyotisen
0
270
Other Decks in Technology
See All in Technology
Swift Sequence の便利 API 再発見
treastrain
1
170
freeeで運用しているAIQAについて
qatonchan
0
380
(きっとたぶん)人材育成や教育のような何かの話
sejima
0
660
生成AIはソフトウェア開発の革命か、ソフトウェア工学の宿題再提出なのか -ソフトウェア品質特性の追加提案-
kyonmm
PRO
2
860
変化の激しい時代をゴキゲンに生き抜くために 〜ストレスマネジメントのススメ〜
kakehashi
PRO
4
1.2k
色を視る
yuzneri
0
320
古今東西SRE
okaru
1
150
要件定義の精度を高めるための型と生成AIの活用 / Using Types and Generative AI to Improve the Accuracy of Requirements Definition
haru860
0
310
Tachikawa.any 運営挨拶
daitasu
0
110
Oracle Base Database Service 技術詳細
oracle4engineer
PRO
15
100k
The 7 pitfalls of AI
ufried
0
200
AI時代に、 データアナリストがデータエンジニアに異動して
jackojacko_
0
360
Featured
See All Featured
RailsConf 2023
tenderlove
30
1.4k
Leading Effective Engineering Teams in the AI Era
addyosmani
9
1.9k
How To Speak Unicorn (iThemes Webinar)
marktimemedia
1
450
A Modern Web Designer's Workflow
chriscoyier
698
190k
Measuring & Analyzing Core Web Vitals
bluesmoon
9
820
What’s in a name? Adding method to the madness
productmarketing
PRO
24
4k
The State of eCommerce SEO: How to Win in Today's Products SERPs - #SEOweek
aleyda
2
10k
Bridging the Design Gap: How Collaborative Modelling removes blockers to flow between stakeholders and teams @FastFlow conf
baasie
0
540
Balancing Empowerment & Direction
lara
6
1.1k
Sam Torres - BigQuery for SEOs
techseoconnect
PRO
0
260
The agentic SEO stack - context over prompts
schlessera
0
770
How to Create Impact in a Changing Tech Landscape [PerfNow 2023]
tammyeverts
55
3.3k
Transcript
Understanding WindowInsets KeepTruckin Subhrajyoti Sen Android Worldwide July 2021
What are Insets?
Insets - Types
Insets - Types • Status Bars
Insets - Types • • Status Bars Navigation Bars
Insets - Types • • • Status Bars Navigation Bars
Caption Bar
Insets - Types • • • • Status Bars Navigation
Bars Caption Bar IME
Insets - Types • • • • • Status Bars
Navigation Bars Caption Bar IME System Gestures
Insets - Types • • • • • • Status
Bars Navigation Bars Caption Bar IME System Gestures Display Cutouts
Insets Status Bar Navigation Bar
Improving the UI
None
Going Full Screen view.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN
Going Full Screen view.systemUiVisibility = View.SYSTEM_UI_FLAG_LAYOUT_STABLE or View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN On API
30+
Going Full Screen window.setDecorFitsSystemWindows(false) On API 30+
Going Full Screen WindowCompat.setDecorFitsSystemWindows(window, false) On API 30+ (backward compatible
till API 21)
Now we have full screen...but
Before After
Fetching WindowInsets
Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> }
Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =
insets.getInsets() }
Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =
insets.getInsets( WindowInsets.Type.navigationBars() ) }
Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =
insets.getInsets( WindowInsets.Type.navigationBars() ).bottom }
Fetching WindowInsets binding.root.setOnApplyWindowInsetsListener { _, insets -> val navigationBarHeight =
insets.getInsets( WindowInsets.Type.navigationBars() ).bottom (binding.root.layoutParams as? ViewGroup.MarginLayoutParams)?. bottomMargin = navigationBarHeight }
Fetching WindowInsets insets.getInsets(WindowInsets.Type.navigationBars()).bottom On API 29+
Fetching WindowInsets On API 21+
Fetching WindowInsets WindowInsetsCompat .toWindowInsetsCompat(insets) .getInsets( WindowInsetsCompat.Type.navigationBars() ).bottom On API 21+
Insetter to the rescue
Insetter to the rescue Insetter.builder() .marginBottom(windowInsetTypesOf(navigationBars = true)) .applyToView(rootView)
Done
Not yet...
None
Introduce a notch
None
Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->
notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top }
Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->
notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top }
Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->
notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top }
Padding for Notch (Display Cutout) binding.root.setOnApplyWindowInsetsListener { _, insets ->
notchHeight = WindowInsetsCompat.toWindowInsetsCompat(insets) .getInsets(WindowInsetsCompat.Type.displayCutout()) .top binding.toolbar.updatePadding(top= notchHeight) insets }
Doing more with WindowInsets API
Status Bar Appearance (Earlier) val decor = window.decorView decor.systemUiVisibility =
decor.systemUiVisibility or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR Light status bar
Status Bar Appearance (Earlier) val decor = window.decorView decor.systemUiVisibility =
decor.systemUiVisibility or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR.inv() Dark status bar
Status Bar Appearance (Earlier) val decor = window.decorView decor.systemUiVisibility =
decor.systemUiVisibility or View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR.inv() On API 30+
Status Bar Appearance WindowCompat.getInsetsController( window, window.decorView )?.isAppearanceLightStatusBars = false On
API 21+
Show/Hide keyboard
Show keyboard val controller = WindowCompat.getInsetsController( window, window.decorView ) controller?.show(WindowInsetsCompat.Type.ime())
Hide keyboard val controller = WindowCompat.getInsetsController( window, window.decorView ) controller?.hide(WindowInsetsCompat.Type.ime())
Hide status bar val controller = WindowCompat.getInsetsController( window, window.decorView )
controller?.hide(WindowInsetsCompat.Type.statusBars())
Check keyboard visibility binding.root.setOnApplyWindowInsetsListener { _, insets -> val visible
= WindowInsetsCompat.toWindowInsetsCompat(insets) .isVisible(WindowInsetsCompat.Type.ime()) }
New APIs in Android 12
Rounded Corners
Rounded Corners android.view.RoundedCorner
Rounded Corners android.view.RoundedCorner WindowInsets.getRoundedCorner(int position)
Privacy Indicators
Privacy Indicators WindowInsets.getPrivacyIndicatorBounds() : Rect
@iamsubhrajyoti