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
Search
Subhrajyoti Sen
June 27, 2021
Programming
1
150
Understanding WindowInsets
Subhrajyoti Sen
June 27, 2021
Tweet
Share
More Decks by Subhrajyoti Sen
See All by Subhrajyoti Sen
Compose Previews as a Power User
subhrajyotisen
1
80
Understanding WindowInsets
subhrajyotisen
0
120
Exploring a KMM Developer’s Toolkit
subhrajyotisen
0
120
Shipping Apps Confidently with Firebase
subhrajyotisen
0
33
Understanding WindowInsets - Android Worldwide
subhrajyotisen
0
240
Demystifying Styles and Themes
subhrajyotisen
0
180
Journey Of Time
subhrajyotisen
0
170
Where Did My State Go? - WWC Mobile
subhrajyotisen
0
160
Building a Better Codebase with Lint - Droidcon APAC
subhrajyotisen
1
170
Other Decks in Programming
See All in Programming
みんなでプロポーザルを書いてみた
yuriko1211
0
280
Laravel や Symfony で手っ取り早く OpenAPI のドキュメントを作成する
azuki
2
120
Arm移行タイムアタック
qnighy
0
340
CSC509 Lecture 09
javiergs
PRO
0
140
React への依存を最小にするフロントエンド設計
takonda
6
1.4k
What’s New in Compose Multiplatform - A Live Tour (droidcon London 2024)
zsmb
1
480
型付き API リクエストを実現するいくつかの手法とその選択 / Typed API Request
euxn23
8
2.3k
C++でシェーダを書く
fadis
6
4.1k
Modular Monolith Monorepo ~シンプルさを保ちながらmonorepoのメリットを最大化する~
yuisakamoto
2
130
Snowflake x dbtで作るセキュアでアジャイルなデータ基盤
tsoshiro
2
520
受け取る人から提供する人になるということ
little_rubyist
0
250
2024/11/8 関西Kaggler会 2024 #3 / Kaggle Kernel で Gemma 2 × vLLM を動かす。
kohecchi
5
940
Featured
See All Featured
Large-scale JavaScript Application Architecture
addyosmani
510
110k
Optimizing for Happiness
mojombo
376
70k
The MySQL Ecosystem @ GitHub 2015
samlambert
250
12k
Bash Introduction
62gerente
608
210k
Thoughts on Productivity
jonyablonski
67
4.3k
The Myth of the Modular Monolith - Day 2 Keynote - Rails World 2024
eileencodes
16
2.1k
個人開発の失敗を避けるイケてる考え方 / tips for indie hackers
panda_program
93
16k
Adopting Sorbet at Scale
ufuk
73
9.1k
The Language of Interfaces
destraynor
154
24k
A better future with KSS
kneath
238
17k
Designing the Hi-DPI Web
ddemaree
280
34k
The Psychology of Web Performance [Beyond Tellerrand 2023]
tammyeverts
44
2.2k
Transcript
Understanding WindowInsets KeepTruckin Subhrajyoti Sen CodeAid
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()) }
@iamsubhrajyoti