Upgrade to Pro
— share decks privately, control downloads, hide ads and more …
Speaker Deck
Sign up for free
Menu
Search
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Features
All features
Private URLs
Password Protection
Custom URLS
Scheduled publishing
Remove Branding
Restrict embedding
Deck Collections
Notes
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Explore
Featured decks
Featured speakers
Programming
Technology
Storyboards
Pricing
Search
Sign in
Sign up for free
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
430
0
Share
Embed
Copy iframe code
Copy JS code
Copy link
Start on current slide
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
74
Updated Lessons from a KMP Developer's Toolkit
subhrajyotisen
0
88
Building Mobile Apps and Scaling them
subhrajyotisen
0
85
Compose Previews as a Power User
subhrajyotisen
1
250
Understanding WindowInsets
subhrajyotisen
0
280
Exploring a KMM Developer’s Toolkit
subhrajyotisen
1
290
Shipping Apps Confidently with Firebase
subhrajyotisen
0
160
Understanding WindowInsets
subhrajyotisen
1
260
Demystifying Styles and Themes
subhrajyotisen
0
310
Other Decks in Technology
See All in Technology
Flutter Webを「SDK」として配る — 50以上のゲームを支える埋め込みアーキテクチャ
masayukisuda
0
170
kintoneで在庫管理システムを作るときの要件定義・設計ポイント
kai0707
0
220
【Oracle AI SPOTLIGHT ウェビナー】事例から見る!なぜOCIが選ばれたのか ― AI時代のクラウド戦略を紐解く ―
oracle4engineer
PRO
1
150
SLOを阻む不安
sraku2159
0
210
AIで選択肢が広がった組織設計の理想と現実
konifar
16
7.5k
スマートロックを支えるFlutter × ネイティブ連携の実践 / Flutter and Native Integration in Practice: Powering Smart Locks
bitkey
PRO
0
140
LLMの知識とAIエージェント
happysamurai294
0
150
AIに任せられるFlutterコードベースを作る 〜仕様をコードで表し、ハーネスで守る〜
myohei
1
630
[General] 개발자로 해외 기업에서 일하기
skydoves
1
260
クラウドエージェントの先駆け Devin。今も最先端を走る、他との違い
kinopeee
2
560
[FECONF-2026] 신대륙을 향한 카카오페이증권 프론트엔드 항해기 (이주승)
l1ghthouse
0
370
Agent Loopを組み込んだ アンビエントなAI機能を実現する / Ambient AI fetures with Agent Loop
nekorush14
0
130
Featured
See All Featured
How to Grow Your eCommerce with AI & Automation
katarinadahlin
PRO
2
340
ラッコキーワード サービス紹介資料
rakko
5
5.6M
Are puppies a ranking factor?
jonoalderson
2
4.1k
Visualizing Your Data: Incorporating Mongo into Loggly Infrastructure
mongodb
50
10k
The World Runs on Bad Software
bkeepers
PRO
72
12k
Navigating Algorithm Shifts & AI Overviews - #SMXNext
aleyda
1
1.7k
Easily Structure & Communicate Ideas using Wireframe
afnizarnur
194
17k
Build The Right Thing And Hit Your Dates
maggiecrowley
39
3.5k
Ecommerce SEO: The Keys for Success Now & Beyond - #SERPConf2024
aleyda
1
2.2k
How STYLIGHT went responsive
nonsquared
100
6.3k
Why Mistakes Are the Best Teachers: Turning Failure into a Pathway for Growth
auna
0
340
Art, The Web, and Tiny UX
lynnandtonic
304
22k
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