Talk given at Google I/O Connect Bengaluru 2023
UnderstandingWindowInsetsSubhrajyoti SenSoftware Engineer, Android GDE
View Slide
What areWindowInsets?WindowInsets inViewsWindowInsets inComposeAgendaSection 02Section 01 Section 03
What areWindowInsets?Section 01
Section 01Common types of Window Insets:1. Navigation bar2. Status bar3. IME4. System Gestures5. Mandatory System Gestures6. Caption Bar
Section 01Status barNavigation bar
Section 01IME
WindowInsets inViewsSection 02
Section 02
(Palmer penguins; Horst et al.)class MainActivity: Activity {override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)WindowCompat.setDecorFitsSystemWindows(window, false)}}Section 02
(Palmer penguins; Horst et al.)class MainActivity: Activity {override fun onCreate(savedInstanceState: Bundle?) {super.onCreate(savedInstanceState)window.statusBarColor = Color.TRANSPARENTwindow.navigationBarColor = Color.TRANSPARENT}}Section 02
(Palmer penguins; Horst et al.)binding.root.setOnApplyWindowInsetsListener { _, insets ->val windowInsetsCompat = WindowInsetsCompat.toWindowInsetsCompat(insets)val navBarInsets =windowInsetsCompat.getInsets(WindowInsetsCompat.Type.navigationBars())(binding.root.layoutParams as? ViewGroup.MarginLayoutParams)?.bottomMargin= navBarInsets.bottominsets}Section 02
(Palmer penguins; Horst et al.)WindowCompat.getInsetsController(window, window.decorView).show(WindowInsetsCompat.Type.ime())Section 02Show soft keyboard (IME)
(Palmer penguins; Horst et al.)WindowCompat.getInsetsController(window, window.decorView).hide(WindowInsetsCompat.Type.ime())Section 02Hide soft keyboard (IME)
(Palmer penguins; Horst et al.)binding.root.setOnApplyWindowInsetsListener { _, insets ->val visible = WindowInsetsCompat.toWindowInsetsCompat(insets).isVisible(WindowInsetsCompat.Type.ime())}Section 02Check IME Visibility
WindowInsets inComposeSection 03
26Section 03Box(modifier = Modifier.windowInsetsPadding()) {Toolbar("Android")}
27Section 03Box(modifier = Modifier.windowInsetsPadding(WindowInsets.statusBars)) {Toolbar("Android")}
28Section 03Box(modifier = Modifier.statusBarPadding()) {Toolbar("Android")}
29Section 03Box(modifier = Modifier.fillMaxSize().background(Color.Black)) {Box(modifier = Modifier.fillMaxSize().statusBarsPadding().background(Color.Gray)) {Box(modifier = Modifier.statusBarsPadding().background(Color.Red).size(50.dp))}}
30Section 03Box(modifier = Modifier.fillMaxSize().background(Color.Black)) {Box(modifier = Modifier.fillMaxSize().statusBarsPadding().background(Color.Gray)) {Box(modifier = Modifier.statusBarsPadding().background(Color.Red).size(50.dp))}}
31Section 03
32Section 03Scaffold(modifier = Modifier.fillMaxSize().background(Color.Black)) { contentPadding ->Box(modifier = Modifier.fillMaxSize().padding(contentPadding).background(Color.Gray)) {Box(modifier = Modifier.background(Color.Red).size(50.dp))}}
33Section 03Scaffold(modifier = Modifier.fillMaxSize().background(Color.Black)) { contentPadding ->Box(modifier = Modifier.fillMaxSize().padding(contentPadding).background(Color.Gray)) {Box(modifier = Modifier.background(Color.Red).size(50.dp))}}
34Section 03Scaffold(modifier = Modifier.fillMaxSize().background(Color.Black)) { contentPadding ->Box(modifier = Modifier.fillMaxSize().padding(contentPadding).background(Color.Gray)) {Box(modifier = Modifier.statusBarsPadding().background(Color.Red).size(50.dp))}}
35Section 03Scaffold(modifier = Modifier.fillMaxSize().background(Color.Black)) { contentPadding ->Box(modifier = Modifier.fillMaxSize().padding(contentPadding).background(Color.Gray)) {Box(modifier = Modifier.statusBarsPadding().background(Color.Red).size(50.dp))}}
36Section 03TextField(value = textFieldValue,onValueChange = {textFieldValue = it},modifier = Modifier.align(Alignment.BottomCenter).size(50.dp),)
37Section 03TextField(value = textFieldValue,onValueChange = {textFieldValue = it},modifier = Modifier.align(Alignment.BottomCenter).imePadding().size(50.dp),)
Section 03Multiplatform WindowInsetsSource: insetsx GitHubhttps://github.com/mori-atsushi/insetsx
Thank YouSubhrajyoti SenSoftware Engineer, Android GDE