{"id":338424,"date":"2022-09-15T21:00:30","date_gmt":"2022-09-15T21:00:30","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=338424"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=338424","title":{"rendered":"<span>\u0413\u043e\u0442\u043e\u0432\u0438\u043c Window Inset \u043f\u043e\u0434 \u0441\u043e\u0443\u0441\u043e\u043c Jetpack Compose \u0438 \u0449\u0435\u043f\u043e\u0442\u043a\u043e\u0439 View<\/span>"},"content":{"rendered":"<div><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/8a0\/8a9\/7e8\/8a08a97e8c5ce9ba06d3e51de89f0516.jpg\" width=\"1600\" height=\"900\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8a0\/8a9\/7e8\/8a08a97e8c5ce9ba06d3e51de89f0516.jpg\" data-blurred=\"true\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u0438\u0432\u0435\u0442! \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0422\u0438\u043c\u0443\u0440, \u044f \u0437\u0430\u043d\u0438\u043c\u0430\u044e\u0441\u044c Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u043e\u0439 \u0432 <a href=\"https:\/\/kts.studio\/\"><u>KTS<\/u><\/a>.<\/p>\n<p>\u041a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e, \u0441\u0435\u0439\u0447\u0430\u0441 \u0432\u0441\u0435 \u0435\u0449\u0435 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u044e\u0442\u0441\u044f Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044e\u0442 <em>edge-to-edge<\/em>. \u0421\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435, \u0447\u0442\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043b\u0438\u0431\u043e \u043d\u0435 \u0437\u043d\u0430\u044e\u0442 \u043e \u0442\u0430\u043a\u043e\u0439 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438, \u043b\u0438\u0431\u043e \u0431\u043e\u044f\u0442\u0441\u044f \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 <em>WindowInsets<\/em>. \u041d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c <em>edge-to-edge<\/em><strong> <\/strong>\u043d\u0435 \u0441\u043b\u043e\u0436\u043d\u043e, \u0430 \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u044d\u0442\u043e\u0439 \u0442\u0435\u043c\u0435<strong> <\/strong>\u0432 \u0440\u0430\u0437\u044b \u0431\u044b\u0441\u0442\u0440\u0435\u0435.\u00a0<\/p>\n<p>\u0421\u0435\u0433\u043e\u0434\u043d\u044f \u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u0440\u0435\u0436\u0438\u043c <em>edge-to-edge<\/em> \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u0438 \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 <em>WindowInsets <\/em>\u0432 Android. \u0415\u0449\u0435 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 insets \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432\u043e <code>View<\/code><strong>, <\/strong>\u043d\u043e \u0438 \u0432 <em>Jectpack Compose<\/em><strong>. <\/strong>\u00a0\u0415\u0441\u043b\u0438 \u0441\u0442\u0430\u0442\u044c\u0438 \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 <em>insets<\/em> \u0432 <em>View<\/em>, \u0435\u0449\u0435 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u043d\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u0440\u0430\u0445 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442\u0430, \u0442\u043e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u043d\u0438\u043c\u0438 \u0432 <em>Jetpack Compose<\/em> \u0435\u0441\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438.\u00a0<\/p>\n<p>\u0412\u0441\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u0438\u0437 \u0441\u0442\u0430\u0442\u044c\u0438 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432\u00a0<a href=\"https:\/\/github.com\/TimurChikishev\/Insets\/\">\u044d\u0442\u043e\u043c <\/a>\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438.<\/p>\n<p>\u0421\u043e\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435:<\/p>\n<ul>\n<li>\n<p><a href=\"#1\">\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 edge-to-edge?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/%E2%84%962\">\u042d\u0442\u0430\u043f\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 edge-to-edge:<\/a><\/p>\n<ul>\n<li>\n<p><a href=\"#3\">\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#4\">\u041e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#5\">\u0423\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u043e\u0432\u00a0<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"#6\">WindowInsets vs fitSystemWindow?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#7\">\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 insets<\/a><\/p>\n<ul>\n<li>\n<p><a href=\"#8\">System Window Insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#9\">Ime Insets (\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#10\">Stable Insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#11\">Immersive mode (\u041f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u0431\u0435\u0437 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 UI)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#12\">Display Cutouts (\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0432\u044b\u0440\u0435\u0437\u043e\u0432 \u0434\u0438\u0441\u043f\u043b\u0435\u044f)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#13\">System Gesture Insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#14\">Mandatory system gesture insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#15\">Tappable element insets<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"#16\">\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/a><\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"1\" id=\"1\"><\/a><\/p>\n<h2>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 edge-to-edge?<\/h2>\n<figure class=\"float full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a64\/07e\/52d\/a6407e52dfe5dbb0b1d9d027476c91ce.gif\" width=\"600\" height=\"810\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a64\/07e\/52d\/a6407e52dfe5dbb0b1d9d027476c91ce.gif\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u043c \u043c\u0438\u0440\u0435 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0432\u0441\u0435 \u0447\u0430\u0449\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u0435\u0439 \u0432\u0438\u0434\u0438\u043c\u043e\u0439 \u043f\u043e\u0432\u0435\u0440\u0445\u043d\u043e\u0441\u0442\u0438 \u0434\u0438\u0441\u043f\u043b\u0435\u044f, \u043d\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u044f\u0441\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u0441\u0438\u0441\u0442\u0435\u043c\u044b. \u0412 \u0442\u0430\u043a\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043f\u043e\u0434\u0445\u043e\u0434 <em>edge-to-edge<\/em>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI, \u0442.\u0435. \u043f\u043e\u0434 Status Bar \u0438 Navigation Bar.\u00a0<\/p>\n<p>\u0421\u043f\u0440\u043e\u0441\u0438\u0442\u0435, \u0437\u0430\u0447\u0435\u043c \u044d\u0442\u043e \u043d\u0443\u0436\u043d\u043e? \u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0432\u043b\u0435\u043a\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441. \u0421\u043e\u0433\u043b\u0430\u0441\u0438\u0442\u0435\u0441\u044c, \u0432\u0441\u0435\u043c \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0438\u044f\u0442\u043d\u0435\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438  <em>edge-to-edge<\/em>.<\/p>\n<p><a class=\"anchor\" name=\"2\" id=\"2\"><\/a><\/p>\n<h2>\u042d\u0442\u0430\u043f\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 edge-to-edge<\/h2>\n<p>\u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0440\u0435\u0436\u0438\u043c\u0430 <em>edge-to-edge<\/em> \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e:<\/p>\n<ul>\n<li>\n<p>\u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/p>\n<\/li>\n<li>\n<p>\u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI<\/p>\n<\/li>\n<li>\n<p>\u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u044b<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"3\" id=\"3\"><\/a><\/p>\n<h3>\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/h3>\n<p>\u041d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 Android 5 (API 21) \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u0434\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0434\u043b\u044f Status Bar \u0438 Navigation Bar. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u0442\u0435\u043c\u044b:<\/p>\n<pre><code class=\"kotlin\">&lt;item name=\"android:statusBarColor\">@color\/colorAccent&lt;\/item> &lt;item name=\"android:navigationBarColor\">@color\/colorAccent&lt;\/item><\/code><\/pre>\n<p>\u0415\u0449\u0435 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c \u0438\u043b\u0438 \u043f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c. \u0427\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438, \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowTranslucentStatus\"><strong><u>android:windowTranslucentStatus<\/u><\/strong><\/a> \u0438 <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowTranslucentNavigation\"><strong><u>android:windowTranslucentNavigation<\/u><\/strong><\/a><strong>:<\/strong><\/p>\n<pre><code class=\"kotlin\">&lt;item name=\"android:windowTranslucentStatus\">true&lt;\/item> &lt;item name=\"android:windowTranslucentNavigation\">true&lt;\/item><\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/25a\/c52\/e08\/25ac52e0804b789f99d9573d74fe676f.jpg\" width=\"1830\" height=\"680\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/25a\/c52\/e08\/25ac52e0804b789f99d9573d74fe676f.jpg\" data-blurred=\"true\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0427\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0433\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#navigationBarColor\"><strong><u>android:navigationBarColor<\/u><\/strong><\/a> \u0438 <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#statusBarColor\"><strong><u>android:statusBarColor<\/u><\/strong><\/a> \u0441 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c \u0438 \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/Window#isNavigationBarContrastEnforced()\"><strong><u>android:enforceNavigationBarContrast<\/u><\/strong><\/a>, <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/Window#isStatusBarContrastEnforced()\"><strong><u>android:enforceStatusBarContrast<\/u><\/strong><\/a>. \u041e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0441 10 \u0432\u0435\u0440\u0441\u0438\u0438 Android \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u0443\u044e \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c Navigation Bar.<\/p>\n<pre><code class=\"kotlin\">&lt;item name=\"android:statusBarColor\">@android:color\/transparent&lt;\/item> &lt;item name=\"android:navigationBarColor\">@android:color\/transparent&lt;\/item> &lt;item name=\"android:enforceNavigationBarContrast\">false&lt;\/item> &lt;item name=\"android:enforceStatusBarContrast\">false&lt;\/item><\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/934\/3c9\/7ee\/9343c97eee772431ea4ae7b05c805fa4.jpg\" width=\"1786\" height=\"664\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/934\/3c9\/7ee\/9343c97eee772431ea4ae7b05c805fa4.jpg\" data-blurred=\"true\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u0447\u0442\u043e \u043d\u0430 \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442\u0435 \u0432\u044b\u0448\u0435 \u043f\u043b\u043e\u0445\u043e \u0432\u0438\u0434\u043d\u044b \u043a\u043d\u043e\u043f\u043a\u0438 \u043d\u0430 Navigation Bar. \u0412 Status Bar \u0431\u044b\u043b\u0430 \u0431\u044b \u0442\u0430 \u0436\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430, \u0435\u0441\u043b\u0438 \u0431\u044b \u043d\u0435 \u043f\u0443\u0440\u043f\u0443\u0440\u043d\u044b\u0439 \u0446\u0432\u0435\u0442. \u0427\u0442\u043e\u0431\u044b \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u044d\u0442\u043e, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightStatusBar\"><strong><u>android:windowLightStatusBar<\/u><\/strong><\/a><strong>, <\/strong><a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightNavigationBar\"><strong><u>android:windowLightNavigationBar<\/u><\/strong><\/a><strong>. <\/strong>\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightStatusBar\"><strong><u>windowLightStatusBar<\/u><\/strong><\/a><strong> <\/strong>\u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0441 23 api, \u0430 <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightNavigationBar\"><strong><u>windowLightNavigationBar<\/u><\/strong><\/a><strong> <\/strong>\u0441 27 api.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/ca2\/373\/5ab\/ca23735ab722966ac11abc935f1bdb9b.jpg\" width=\"1790\" height=\"664\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ca2\/373\/5ab\/ca23735ab722966ac11abc935f1bdb9b.jpg\" data-blurred=\"true\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412<em> Jetpack Compose<\/em> \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 <a href=\"https:\/\/github.com\/google\/accompanist\/tree\/main\/systemuicontroller\"><strong><u>System UI Controller<\/u><\/strong><\/a>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f\u00a0 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u044b\u0435 \u0443\u0442\u0438\u043b\u0438\u0442\u044b \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI. \u0418\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u0442\u043e\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u0442\u0430\u043a:<\/p>\n<pre><code class=\"kotlin\">private val BlackScrim = Color(0f, 0f, 0f, 0.3f) \/\/ 30% opaque black  @Composable fun TransparentSystemBars() {    val systemUiController = rememberSystemUiController()    val useDarkIcons = MaterialTheme.colors.isLight    SideEffect {        systemUiController.setSystemBarsColor(            color = Color.Transparent,            darkIcons = useDarkIcons,            isNavigationBarContrastEnforced = false,            transformColorForLightContent = { original ->                BlackScrim.compositeOver(original)            }        )    } }<\/code><\/pre>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 TransparentSystemBars:<\/p>\n<pre><code class=\"kotlin\">override fun onCreate(savedInstanceState: Bundle?) {     super.onCreate(savedInstanceState)    WindowCompat.setDecorFitsSystemWindows(window, false)    setContent {        TransparentSystemBars()        Sample()    } }<\/code><\/pre>\n<p>\u041c\u0435\u0442\u043e\u0434 <em>setSystemBarsColor<\/em><strong> <\/strong>\u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u0434\u043b\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/p>\n<\/li>\n<li>\n<p>\u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u043a\u043e\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0432\u0435\u0442\u043b\u044b\u0435 \u0438\u043b\u0438 \u0442\u0435\u043c\u043d\u044b\u0435 \u0438\u043a\u043e\u043d\u043a\u0438<\/p>\n<\/li>\n<li>\n<p>\u043c\u043e\u0436\u043d\u043e \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <em>isNavigationBarContrastEnforced<\/em>.\u00a0<\/p>\n<\/li>\n<li>\n<p>\u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043b\u044f\u043c\u0431\u0434\u0443 <em>transformColorForLightContent<\/em>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u043d\u0430 \u0434\u043b\u044f \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430, \u0435\u0441\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0448\u0435\u043d\u044b \u0442\u0435\u043c\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u043a\u0438, \u043d\u043e \u043e\u043d\u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b. \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u043d\u0430\u044f \u043d\u0430\u043a\u043b\u0430\u0434\u043a\u0430 (\u0432 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0432\u044b\u0448\u0435 \u0432 <em>transformColorForLightContent<\/em> \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u0438\u0441\u0430\u0442\u044c \u044d\u0442\u043e\u0433\u043e \u043d\u0435 \u043d\u0443\u0436\u043d\u043e). <\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"4\" id=\"4\"><\/a><\/p>\n<h3>\u0417\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u00a0 \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI<\/h3>\n<p>\u041a\u0440\u043e\u043c\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u043d\u0443\u0436\u043d\u043e \u0441\u043a\u0430\u0437\u0430\u0442\u044c \u0441\u0438\u0441\u0442\u0435\u043c\u0435, \u0447\u0442\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0443\u0436\u043d\u043e \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432 Android \u0435\u0441\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0444\u043b\u0430\u0433\u0438 <em>View SYSTEM_UI_FLAGS<\/em> (\u0434\u0430\u043b\u0435\u0435 <em>UI_FLAGS<\/em>). \u041e\u043d\u0438 deprecated \u043d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 API 30, \u0438 \u0442\u0435\u043f\u0435\u0440\u044c \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 WindowCompat, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0435 \u0444\u043b\u0430\u0433\u0438 \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u043d\u043d\u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 API.<\/p>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441 \u043f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u0440\u0435\u0436\u0438\u043c\u0430 \u0447\u0435\u0440\u0435\u0437 <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/WindowCompat\"><strong><u>WindowCompat<\/u><\/strong><\/a><strong> <\/strong>\u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n<pre><code>WindowCompat.setDecorFitsSystemWindows(window, false)<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u044d\u0442\u043e \u0432 activity, \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c insets \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0438 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/p>\n<p>\u0417\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u0446\u0435\u043b\u0435\u0441\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u043e \u0434\u043b\u044f \u0432\u0441\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u0432 <code>onCreate()<\/code> \u0432\u0430\u0448\u0435\u0439 activity, \u0435\u0441\u043b\u0438 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u043f\u043e\u0434\u0445\u043e\u0434 single-activity).\u00a0<\/p>\n<p>\u0412 <em>Jetpack Compose<\/em> \u044d\u0442\u043e\u0442 \u044d\u0442\u0430\u043f \u043d\u0438\u0447\u0435\u043c \u043d\u0435 \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f.<\/p>\n<p><a class=\"anchor\" name=\"5\" id=\"5\"><\/a><\/p>\n<h3>\u0423\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u044b<\/h3>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u043f\u0440\u043e\u0448\u043b\u044b\u0435 \u0448\u0430\u0433\u0438 \u0438 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043c\u043e\u0436\u043d\u043e \u0443\u0432\u0438\u0434\u0435\u0442\u044c, \u0447\u0442\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442 \u043c\u0435\u0441\u0442\u043e \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0439 UI. \u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0441\u0430\u043c\u0438\u043c:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/3fd\/b4d\/e39\/3fdb4de398b00a6bff05857727ec10d6.png\" width=\"793\" height=\"234\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3fd\/b4d\/e39\/3fdb4de398b00a6bff05857727ec10d6.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u043f\u043e\u0434 Android \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowInsets\"><em>WindowInsets<\/em><\/a>. <em>Insets<\/em><strong> <\/strong>\u2014 \u044d\u0442\u043e \u043e\u0431\u044a\u0435\u043a\u0442, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0438\u0437 \u0441\u0435\u0431\u044f \u043e\u0431\u043b\u0430\u0441\u0442\u044c \u043e\u043a\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u0443\u0435\u0442 \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c. \u041a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u044b \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0435, \u0438 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0440\u0430\u0437\u043d\u044b\u0435 <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/core\/view\/WindowInsetsCompat.Type\"><u>\u0442\u0438\u043f\u044b<\/u><\/a> <em>insets<\/em><strong> <\/strong>(\u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0436\u0435\u0441\u0442\u043e\u0432, \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0435 \u043f\u0430\u043d\u0435\u043b\u0438, \u0447\u0435\u043b\u043a\u0438 \u0438 \u0442.\u0434.).\u00a0<\/p>\n<p>\u0414\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 <em>insets<\/em><strong> <\/strong>\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043a\u043b\u0430\u0441\u0441 <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/WindowInsetsCompat\"><em>WindowInsetsCompat <\/em><\/a>\u0441 \u043e\u0431\u0440\u0430\u0442\u043d\u043e\u0439 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u044c\u044e \u0438 \u0443\u0434\u043e\u0431\u043d\u044b\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435\u043c \u043d\u0430 <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/core\/view\/WindowInsetsCompat.Type\"><u>\u0442\u0438\u043f\u044b<\/u><\/a> insets.<\/p>\n<p>\u0421\u0430\u043c\u0430 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u043f\u0440\u0438\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u0438\u0438 \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044f \u043d\u0430 <em>View<\/em>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 <em>insets<\/em>. \u041f\u043e\u0441\u043b\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0435 padding \u0438\u043b\u0438 margin \u043d\u0430 <em>View<\/em>:<\/p>\n<pre><code class=\"kotlin\">ViewCompat.setOnApplyWindowInsetsListener(navBar) { view, insets ->     val systemBarInsets = insets.getInsets(WindowInsetsCompat.Type.systemBars())     view.updatePadding(         bottom = systemBarInsets.bottom,         left = systemBarInsets.left,         right = systemBarInsets.right     )     insets }<\/code><\/pre>\n<p>\u0412 <a href=\"https:\/\/kts.studio\/\"><u>KTS<\/u><\/a> \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><u>insetter<\/u><\/a>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043d\u0430 \u0431\u0430\u0437\u0435 \u044d\u0442\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430. \u0412 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d \u0443\u0434\u043e\u0431\u043d\u044b\u0439 Kotlin DSL applyInsetter \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 <em>insets<\/em>.<\/p>\n<pre><code class=\"kotlin\">toolbar.applyInsetter {     type(navigationBars = true, statusBars = true) {         padding(horizontal = true, top = true)     } }<\/code><\/pre>\n<p>\u0412<strong> <\/strong><em>Jetpack Compose<\/em> \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 <em>instes<\/em><strong> <\/strong>\u0440\u0430\u043d\u0435\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0430\u0441\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u0438\u0437 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f <a href=\"https:\/\/github.com\/google\/accompanist\/tree\/main\/insets\"><strong><u>accompanist<\/u><\/strong><\/a>, \u043d\u043e \u043e\u043d\u0430 \u0443\u0441\u0442\u0430\u0440\u0435\u043b\u0430, \u0442\u0430\u043a \u043a\u0430\u043a \u0432 <em>Compose 1.2.0<\/em> \u0442\u0435\u043f\u0435\u0440\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u0430 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 <em>insets<\/em>. \u0415\u0441\u043b\u0438 \u0432\u044b \u0443\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 <a href=\"https:\/\/github.com\/google\/accompanist\/tree\/main\/insets\"><strong><u>accompanist<\/u><\/strong><\/a>, \u0442\u043e \u043d\u0430 \u0441\u0430\u0439\u0442\u0435 \u0435\u0441\u0442\u044c \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0435 <a href=\"https:\/\/google.github.io\/accompanist\/insets\/\"><strong><u>\u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e \u043f\u043e \u043c\u0438\u0433\u0440\u0430\u0446\u0438\u0438<\/u><\/strong><\/a>.<\/p>\n<pre><code class=\"kotlin\">TopAppBar(     contentPadding = WindowInsets.systemBars         .only(WindowInsetsSides.Horizontal + WindowInsetsSides.Top)         .asPaddingValues(),     backgroundColor = MaterialTheme.colors.primary ) {     \/\/ content... }<\/code><\/pre>\n<p><a class=\"anchor\" name=\"6\" id=\"6\"><\/a><\/p>\n<h2>WindowInsets vs fitSystemWindow?<\/h2>\n<p>\u0412 Android \u0435\u0441\u0442\u044c \u0444\u043b\u0430\u0433 <em>fitSystemWindow<\/em>. \u0415\u0441\u043b\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u00abtrue\u00bb, \u0442\u043e \u044d\u0442\u043e\u0442 \u0444\u043b\u0430\u0433 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 padding \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430, \u0443 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0432\u044b \u0443\u043a\u0430\u0437\u0430\u043b\u0438 \u0444\u043b\u0430\u0433.\u00a0<\/p>\n<p><em>FitsSystemWindows<\/em><strong> <\/strong>\u0441\u0431\u0438\u0432\u0430\u0435\u0442 \u0441 \u0442\u043e\u043b\u043a\u0443<strong> <\/strong>\u043c\u043d\u043e\u0433\u0438\u0445 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044d\u0442\u043e\u0442 \u0444\u043b\u0430\u0433 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 CoordinatorLayout \u0438 \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0434\u043b\u044f FrameLayout. FitsSystemWindows = true \u043d\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442 \u0432\u0430\u0448 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043f\u043e\u0434 \u0441\u0442\u0440\u043e\u043a\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f, \u043d\u043e \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0434\u043b\u044f \u0442\u0430\u043a\u0438\u0445 \u043c\u0430\u043a\u0435\u0442\u043e\u0432, \u043a\u0430\u043a CoordinatorLayout \u0438 DrawerLayout, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u043d\u0438 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u041f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442\u043e\u043c \u043e\u043d\u0438 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e\u0442 \u0444\u043b\u0430\u0433\u0438 <code>setSystemUiVisibility<\/code>(<code>View.SYSTEM_UI_FLAG_LAYOUT_STABLE\u00a0 | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN<\/code>) \u0435\u0441\u043b\u0438 fitsSystemWindows \u0440\u0430\u0432\u0435\u043d <em>true<\/em>.\u00a0<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/View#SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN\"><u>SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN<\/u><\/a> \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043f\u043e\u0434 \u0441\u0442\u0440\u043e\u043a\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/View#SYSTEM_UI_FLAG_LAYOUT_STABLE\"><u>SYSTEM_UI_FLAG_LAYOUT_STABLE<\/u><\/a> \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0445 insets, \u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0442\u0435\u043a\u0443\u0449\u0438\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u044d\u0442\u043e\u0433\u043e.<\/p>\n<\/li>\n<\/ul>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043c \u044d\u0442\u0438 \u0444\u043b\u0430\u0433\u0438 \u043a \u043d\u0430\u0448\u0435\u043c\u0443 rootLayout, \u0442\u043e \u0432\u0441\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0437\u0430\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0434\u0430\u0436\u0435 \u043d\u0430 FrameLayout.<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 <em>fitSystemWindow<\/em><strong> <\/strong>\u0432\u0430\u0436\u043d\u0430 \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u044f: \u0435\u0441\u043b\u0438 \u043a\u0442\u043e-\u0442\u043e \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u0435\u0439 \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u043b \u044d\u0442\u043e\u0442 \u0444\u043b\u0430\u0433 \u0432 \u00abtrue\u00bb, \u0434\u0430\u043b\u044c\u0448\u0435 \u0435\u0433\u043e \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0435 \u0431\u0443\u0434\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 \u0443\u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u043b \u043e\u0442\u0441\u0442\u0443\u043f\u044b.<\/p>\n<p>\u041d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u044d\u0442\u043e \u043d\u0435 \u0432\u0441\u0435 \u043d\u044e\u0430\u043d\u0441\u044b \u0438\u0437-\u0437\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0444\u043b\u0430\u0433\u0430 <em>fitSystemWindow<\/em> \u043d\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f (\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u0445 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 <a href=\"https:\/\/habr.com\/ru\/company\/oleg-bunin\/blog\/488196\/\"><u>\u044d\u0442\u043e\u0439 <\/u><\/a>\u0441\u0442\u0430\u0442\u044c\u0435), \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0447\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0438 \u043d\u0435 \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e\u0433\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f, \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <em>WindowInsets<\/em><strong>.<\/strong><\/p>\n<p><a class=\"anchor\" name=\"7\" id=\"7\"><\/a><\/p>\n<h2>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 insets<\/h2>\n<p><a class=\"anchor\" name=\"8\" id=\"8\"><\/a><\/p>\n<h3>System Window Insets<\/h3>\n<p>\u042d\u0442\u043e\u0442 \u0442\u0438\u043f <em>insets<\/em> \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u043c. \u041e\u043d\u0438 \u043d\u0443\u0436\u043d\u044b, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043a\u0430\u043a <em>Status Bar<\/em> \u0438 <em>Navigation Bar<\/em>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d, toolbar \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043f\u043e\u0434 Status Bar.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f8a\/a21\/d80\/f8aa21d804122a6e4d42a6b14ab523d4.png\" width=\"1080\" height=\"521\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f8a\/a21\/d80\/f8aa21d804122a6e4d42a6b14ab523d4.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u00a0<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <em>insets<\/em> \u0434\u043b\u044f toolbar, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 <a href=\"https:\/\/developer.android.com\/reference\/com\/google\/android\/material\/appbar\/AppBarLayout\"><em>AppBarLayout <\/em><\/a>\u0441 \u043f\u0443\u0440\u043f\u0443\u0440\u043d\u044b\u043c background. \u042d\u0442\u043e \u0434\u0430\u0441\u0442 \u043d\u0430\u043c \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0435\u043d\u0438\u044f AppBar \u0437\u0430 Status Bar. \u0412 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043d\u0438\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><strong><u>insetter<\/u><\/strong><\/a>.<\/p>\n<pre><code class=\"kotlin\">toolbar.applyInsetter {    type(navigationBars = true, statusBars = true) {        padding(horizontal = true)        margin(top = true)    } }<\/code><\/pre>\n<p>\u0412 <em>Jetpack Compose<\/em> \u0442\u0430\u043a\u043e\u0433\u043e \u0436\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f, \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0432 <em>insets<\/em> \u0432 <em>contentPadding<\/em> compose \u0444\u0443\u043d\u043a\u0446\u0438\u0438 <em>TopAppBar<\/em>. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <em>WindowInsets.systemBars<\/em> \u0434\u043b\u044f \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u0438 \u0438 \u0432\u0435\u0440\u0445\u0430, \u0447\u0442\u043e\u0431\u044b \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043f\u043e\u0432\u043e\u0440\u043e\u0442\u0430 \u044d\u043a\u0440\u0430\u043d\u0430 Navigation Bar \u043d\u0435 \u043f\u0435\u0440\u0435\u043a\u0440\u044b\u0432\u0430\u043b\u0430 \u043d\u0430\u0447\u0430\u043b\u043e \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 \u0438\u043b\u0438 \u043a\u043d\u043e\u043f\u043a\u0443 \u0432\u044b\u0445\u043e\u0434\u0430.<\/p>\n<pre><code class=\"kotlin\">TopAppBar(     contentPadding = WindowInsets.systemBars         .only(WindowInsetsSides.Horizontal + WindowInsetsSides.Top)         .asPaddingValues(),     backgroundColor = MaterialTheme.colors.primary ) {     \/\/ content... }<\/code><\/pre>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0432 <em>Jetpack Compose<\/em> \u0435\u0441\u0442\u044c \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e extensions \u0434\u043b\u044f <a href=\"https:\/\/developer.android.com\/jetpack\/compose\/modifiers\"><strong><u>Modifier<\/u><\/strong><\/a>, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).systemBarsPadding()\"><strong><u>systemBarsPadding()<\/u><\/strong><\/a><strong>, <\/strong><a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).navigationBarsPadding()\"><strong><u>navigationBarsPadding()<\/u><\/strong><\/a><strong>, <\/strong><a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).statusBarsPadding()\"><strong><u>statusBarsPadding()<\/u><\/strong><\/a> \u0438 \u0434\u0440\u0443\u0433\u0438\u0435.\u00a0<\/p>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 <em>insets<\/em> toolbar \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0442\u0430\u043a:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c41\/c78\/ec0\/c41c78ec077616d8d0b12a69180337eb.png\" width=\"652\" height=\"298\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c41\/c78\/ec0\/c41c78ec077616d8d0b12a69180337eb.png\"\/><figcaption><\/figcaption><\/figure>\n<p><a class=\"anchor\" name=\"9\" id=\"9\"><\/a><\/p>\n<h3>Ime Insets (\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b)<\/h3>\n<p>\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <em>WindowInsetsCompat.Type.ime()<\/em>. \u0422\u0430\u043a\u0436\u0435 \u0434\u043b\u044f <em>ime insets<\/em> \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f\/\u0441\u043a\u0440\u044b\u0442\u0438\u044f \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043d\u043e\u0432\u043e\u0433\u043e API <em>ViewCompat.setWindowInsetsAnimationCallback<\/em><strong>.<\/strong> \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043f\u0440\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 ime insets <a href=\"https:\/\/medium.com\/androiddevelopers\/animating-your-keyboard-fb776a8fb66d\"><u>\u0442\u0443\u0442<\/u><\/a>.<\/p>\n<p>\u0412\u044b\u0437\u043e\u0432 <em>setWindowInsetsAnimationCallback<\/em><strong> <\/strong>\u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d \u0432 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><strong><u>insetter<\/u><\/strong><\/a> (\u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0447\u0435\u0440\u0435\u0437 \u0444\u043b\u0430\u0433 <em>animated<\/em><strong> <\/strong>\u043d\u0430 padding\/margin) \u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u0432\u044f\u0437\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0441 View, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f DSL, \u043d\u043e \u0438 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 View \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043d\u0430 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u0445 UI (\u043c\u0435\u0442\u043e\u0434 <em>syncTranslationTo<\/em>).<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f65\/c5c\/7c7\/f65c5c7c79fc81bc938f821c627af3b4.gif\" width=\"216\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f65\/c5c\/7c7\/f65c5c7c79fc81bc938f821c627af3b4.gif\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b \u0441 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><strong><u>insetter<\/u><\/strong><\/a>.<\/p>\n<pre><code class=\"kotlin\">private fun setupInsets() = with(binding) {    messageWrapper.applySystemBarsImeInsetter(syncTranslationView = list) {        margin(horizontal = true, bottom = true, animated = true)    } }  inline fun View.applySystemBarsImeInsetter(    syncTranslationView: View? = null,    crossinline insetterApply: InsetterApplyTypeDsl.() -> Unit ) {    applyInsetter {        type(ime = true, navigationBars = true, statusBars = true) {            insetterApply()        }        syncTranslationView?.let {            syncTranslationTo(it)        }    } } <\/code><\/pre>\n<p>\u0427\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u0442\u0430\u043a\u043e\u0433\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0432 <em>Jetpack Compose<\/em><strong>,<\/strong> \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u00a0 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).imePadding()\"><strong><u>imePadding()<\/u><\/strong><\/a> \u0434\u043b\u044f <a href=\"https:\/\/developer.android.com\/jetpack\/compose\/modifiers\"><strong><u>Modifier<\/u><\/strong><\/a> (\u043d\u0435 \u0437\u0430\u0431\u0443\u0434\u044c\u0442\u0435 \u0441\u0434\u0435\u043b\u0430\u0442\u044c <em>inset<\/em> \u0434\u043b\u044f Navigation Bar \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).navigationBarsPadding()\"><strong><u>navigationBarsPadding()<\/u><\/strong><\/a>):<\/p>\n<pre><code class=\"kotlin\">@Composable fun BottomEditText(     placeholderText: String = \"Type text here...\" ) {     val text = rememberSaveable(stateSaver = TextFieldValue.Saver) {         mutableStateOf(TextFieldValue(\"\"))     }     Surface(elevation = 1.dp) {         OutlinedTextField(             value = text.value,             onValueChange = { text.value = it },             placeholder = { Text(text = placeholderText) },             modifier = Modifier                 .fillMaxWidth()                 .padding(horizontal = 16.dp, vertical = 8.dp)                 .navigationBarsPadding()                 .imePadding()         )     } }<\/code><\/pre>\n<p><em>Jetpack Compose<\/em> \u0442\u0430\u043a\u0436\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0442\u043a\u0440\u044b\u0442\u044c \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0443 \u0441\u043a\u0440\u043e\u043b\u043b\u043e\u043c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).imeNestedScroll()\"><strong><em><u>imeNestedScroll<\/u><\/em><\/strong><u>()<\/u><\/a>:<\/p>\n<pre><code class=\"kotlin\">LazyColumn(     contentPadding = contentPadding,     reverseLayout = true,     modifier = Modifier         .weight(1f)         .imeNestedScroll() ) {     items(listItems) { SampleListItem(it) } }<\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/fd4\/c38\/28b\/fd4c3828b21579e7eaaac91cf74e4ea3.gif\" width=\"216\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/fd4\/c38\/28b\/fd4c3828b21579e7eaaac91cf74e4ea3.gif\"\/><figcaption><\/figcaption><\/figure>\n<p><a class=\"anchor\" name=\"10\" id=\"10\"><\/a><\/p>\n<h3>Stable Insets<\/h3>\n<p><em>Stable Insets<\/em> \u043f\u043e\u043b\u0435\u0437\u043d\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u044b\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u0432\u0438\u0434\u0435\u043e\u043f\u043b\u0435\u0435\u0440\u044b, \u0433\u0430\u043b\u0435\u0440\u0435\u0438 \u0438 \u0438\u0433\u0440\u044b. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u043d\u0438\u044f \u043f\u043b\u0435\u0435\u0440\u0430 \u0432\u044b \u043c\u043e\u0433\u043b\u0438 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u0447\u0442\u043e \u0443 \u0432\u0430\u0441 \u043f\u0440\u044f\u0447\u0435\u0442\u0441\u044f \u0432\u0435\u0441\u044c \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0439 UI, \u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 Status Bar, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442\u0441\u044f \u0437\u0430 \u043a\u0440\u0430\u0439 \u044d\u043a\u0440\u0430\u043d\u0430. \u041d\u043e \u0441\u0442\u043e\u0438\u0442 \u043a\u043e\u0441\u043d\u0443\u0442\u044c\u0441\u044f \u044d\u043a\u0440\u0430\u043d\u0430, \u043a\u0430\u043a Status Bar \u043f\u043e\u044f\u0432\u0438\u0442\u0441\u044f \u0441\u0432\u0435\u0440\u0445\u0443. \u041e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c insets \u0432 \u0433\u0430\u043b\u0435\u0440\u0435\u0435 \u0438\u043b\u0438 \u043f\u043b\u0435\u0435\u0440\u0435 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043f\u0440\u0438 \u043f\u043e\u043a\u0430\u0437\u0435\/\u0441\u043a\u0440\u044b\u0442\u0438\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI \u043a <em>View<\/em> \u043f\u0440\u0438\u0445\u043e\u0434\u044f\u0442 \u043f\u0443\u0441\u0442\u044b\u0435 <em>insets<\/em> (\u043a\u043e\u0433\u0434\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0439 UI \u0441\u043a\u0440\u044b\u0442). \u0418\u0437-\u0437\u0430 \u044d\u0442\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b Ui \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442 <em>insets<\/em><strong>,<\/strong> \u043c\u043e\u0433\u0443\u0442 \u043f\u043e\u0434\u043f\u0440\u044b\u0433\u0438\u0432\u0430\u0442\u044c \u043a\u0430\u043a \u043d\u0430 \u0433\u0438\u0444\u043a\u0435 \u043d\u0438\u0436\u0435.<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d00\/494\/613\/d0049461348f482e53c34e9f68f5a5e5.gif\" width=\"216\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d00\/494\/613\/d0049461348f482e53c34e9f68f5a5e5.gif\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0442\u0438\u043f <em>Stable Insets<\/em>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0432\u0441\u0435\u0433\u0434\u0430 \u0432\u044b\u0434\u0430\u0435\u0442 \u0441\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438, \u043a\u0430\u043a \u0431\u0443\u0434\u0442\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0439 UI \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f. \u0412 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><strong><u>insetter<\/u><\/strong><\/a> \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d \u043c\u0435\u0442\u043e\u0434 <em>ignoreVisibility<\/em>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u043e\u0442\u0434\u0430\u0432\u0430\u0442\u044c <em>Stable Insets<\/em> \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e <em>View<\/em>.<\/p>\n<pre><code class=\"kotlin\">toolbar.applyInsetter {     type(navigationBars = true, statusBars = true) {         padding(horizontal = true)             margin(top = true)     }     ignoreVisibility(true) }<\/code><\/pre>\n<p>\u041d\u0430 \u0443\u0434\u0438\u0432\u043b\u0435\u043d\u0438\u0435, \u0432 <em>Jetpack Compose<\/em><strong> <\/strong>\u043d\u0435\u0442 \u043d\u0438\u043a\u0430\u043a\u043e\u0433\u043e \u0433\u043e\u0442\u043e\u0432\u043e\u0433\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u0434\u043b\u044f <em>Stable Insets<\/em>, \u043d\u043e \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"kotlin\">class StableStatusBarsInsetsHolder {    private var stableStatusBarsInsets: WindowInsets = WindowInsets(0.dp)     val stableStatusBars: WindowInsets        @Composable        get() {            val density = LocalDensity.current            val layoutDirection = LocalLayoutDirection.current            val statusBars = WindowInsets.statusBars            return remember {                derivedStateOf {                    if (statusBars.exclude(stableStatusBarsInsets).getTop(density) > 0) {                        stableStatusBarsInsets                                     = statusBars.deepCopy(density, layoutDirection)                    }                    stableStatusBarsInsets                }            }.value        }   }  private fun WindowInsets.deepCopy(density: Density, layoutDirection: LayoutDirection): WindowInsets {    return WindowInsets(        left = getLeft(density, layoutDirection),        top = getTop(density),        right = getRight(density, layoutDirection),        bottom = getBottom(density)    ) }<\/code><\/pre>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n<pre><code class=\"kotlin\">val stableInsetsHolder = remember { StableStatusBarsInsetsHolder()} SampleTopBar(    titleRes = R.string.insets_sample_fullscreen_stable,    contentPadding = stableInsetsHolder.stableStatusBars        .only(WindowInsetsSides.Horizontal + WindowInsetsSides.Top)        .asPaddingValues(), )<\/code><\/pre>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c, \u043a\u043e\u0433\u0434\u0430 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <em>Stable Insets<\/em><strong>, <\/strong>\u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0449\u0438\u0435 <em>insets<\/em> \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0435 \u043f\u043e\u0434\u043f\u0440\u044b\u0433\u0438\u0432\u0430\u044e\u0442.<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6cc\/a65\/97f\/6cca6597f483786801356661e2b1a8ec.gif\" width=\"216\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6cc\/a65\/97f\/6cca6597f483786801356661e2b1a8ec.gif\"\/><figcaption><\/figcaption><\/figure>\n<p><a class=\"anchor\" name=\"11\" id=\"11\"><\/a><\/p>\n<h3>Immersive mode (\u041f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u0431\u0435\u0437 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 UI)<\/h3>\n<p>\u0427\u0442\u043e\u0431\u044b \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u0438\u043b\u0438 \u0441\u043a\u0440\u044b\u0442\u044c Ui \u0432\u043c\u0435\u0441\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u044b\u0445 \u043a\u043e\u043c\u0431\u0438\u043d\u0430\u0446\u0438\u0439 UI_FLAGS, \u043d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 API 30 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 <em>WindowInsetsController<\/em><strong> <\/strong>(\u0435\u0433\u043e compat-\u0432\u0435\u0440\u0441\u0438\u044f <em>WindowInsetsControllerCompat<\/em>), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u043c\u0435\u0435\u0442 \u0443\u0434\u043e\u0431\u043d\u043e\u0435 API \u043d\u0430 \u0431\u0430\u0437\u0435 \u043d\u043e\u0432\u044b\u0445 \u043a\u043b\u0430\u0441\u0441\u043e\u0432 API 30.<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e84\/ebe\/b05\/e84ebeb056500a7d9bf56a82f0e383ee.gif\" width=\"216\" height=\"480\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e84\/ebe\/b05\/e84ebeb056500a7d9bf56a82f0e383ee.gif\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041a\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u0432\u0435\u0440\u043d\u0443\u0442\u044c \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0439 Ui \u043d\u0430 \u044d\u043a\u0440\u0430\u043d, \u0437\u0430\u0434\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0444\u043b\u0430\u0433\u043e\u0432 WindowInsetsController (\u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u043e\u0434 <em>setSystemBarsBehavior<\/em>):<\/p>\n<ol>\n<li>\n<p><em>BEHAVIOR_SHOW_BARS_BY_SWIPE<\/em> \u2014 \u0414\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 SystemUi \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u0432\u0430\u0439\u043f, \u0443\u0431\u0438\u0440\u0430\u0442\u044c \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e<\/p>\n<\/li>\n<li>\n<p><em>BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE<\/em> \u2014 \u0414\u043b\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e Ui \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u0432\u0430\u0439\u043f, \u0441\u043a\u0440\u044b\u0442\u0438\u0435 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0447\u0435\u0440\u0435\u0437 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0440\u0435\u043c\u044f.<\/p>\n<\/li>\n<\/ol>\n<p>\u0415\u0441\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 extension-\u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u044b\u0437\u043e\u0432\u043e\u0432 \u043d\u0430 <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowInsetsController\"><em>WindowInsetsController <\/em><\/a>\u0447\u0435\u0440\u0435\u0437 extraAction.<\/p>\n<h4>\u0414\u043b\u044f \u0441\u043a\u0440\u044b\u0442\u0438\u044f UI<\/h4>\n<pre><code class=\"kotlin\">fun Window.hideSystemUi(extraAction:(WindowInsetsControllerCompat.() -> Unit)? = null) {     WindowInsetsControllerCompat(this, this.decorView).let { controller ->         controller.hide(WindowInsetsCompat.Type.systemBars())         extraAction?.invoke(controller)     } }  \/\/ Usage hideSystemUi{     systemBarsBehavior =     WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE }<\/code><\/pre>\n<h4>\u0414\u043b\u044f \u043f\u043e\u043a\u0430\u0437\u0430 UI<\/h4>\n<pre><code>fun Window.showSystemUi(extraAction: (WindowInsetsControllerCompat.() -> Unit)? = null) {     WindowInsetsControllerCompat(this, this.decorView).let { controller ->         controller.show(WindowInsetsCompat.Type.systemBars())         extraAction?.invoke(controller)     } }  \/\/ Usage showSystemUi()<\/code><\/pre>\n<p>\u0412 <em>Jetpack Compose<\/em>, \u0447\u0442\u043e\u0431\u044b \u0441\u043a\u0440\u044b\u0442\u044c \u0438\u043b\u0438 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0441\u0438\u0441\u0442\u0435\u043c\u044b, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <em>rememberSystemUiController()<\/em><strong><em> <\/em><\/strong><em>\u0438\u0437 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438<\/em><strong><em> <\/em><\/strong><a href=\"https:\/\/google.github.io\/accompanist\/systemuicontroller\/\"><strong><em><u>accompanist systemui controller<\/u><\/em><\/strong><\/a><strong><em>.<\/em><\/strong><\/p>\n<pre><code class=\"kotlin\">val systemUiController = rememberSystemUiController()  InsetsExamplesTheme {    FullscreenCutoutSample(        systemUiController.toggleUi    ) }  val SystemUiController.toggleUi: () -> Unit    get() = {        isSystemBarsVisible = !isSystemBarsVisible    } <\/code><\/pre>\n<p>\u041d\u043e \u044d\u0442\u0430 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u043d\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0444\u043b\u0430\u0433\u0438 <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/WindowInsetsControllerCompat\"><em><u>WindowInsetsControllerCompat<\/u><\/em><\/a>. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0431\u044b\u043b \u043d\u0430\u043f\u0438\u0441\u0430\u043d \u043a\u043b\u0430\u0441\u0441 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 <em>rememberSystemUiController<\/em><strong><em>()<\/em><\/strong> \u0438\u0437<a href=\"https:\/\/google.github.io\/accompanist\/systemuicontroller\/\"> <strong><em><u>accompanist systemui controller<\/u><\/em><\/strong><\/a>. \u0412 \u044d\u0442\u043e\u0439 \u0438\u043c\u043f\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u0434\u043b\u044f <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/WindowInsetsControllerCompat\"><em><u>WindowInsetsControllerCompat<\/u><\/em><\/a><em> <\/em>\u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f <em>BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE<\/em><strong>. <\/strong>  <\/p>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">@Composable fun rememberSystemUiVisibilityController(     window: Window? = findWindow() ): SystemUiVisibilityController {     val view = LocalView.current     return remember(view) {           AndroidSystemUiVisibilityController(window, view)      } }  interface SystemUiVisibilityState {    val isVisible: StateFlow&lt;Boolean> }  interface SystemUiVisibilityController :SystemUiVisibilityState {    var isSystemBarsVisible: Boolean }  internal class AndroidSystemUiVisibilityController(    window: Window?,    private val view: View ) : SystemUiVisibilityController {     private val windowInsetsController = window?.let {        WindowInsetsControllerCompat(window, view).apply {            systemBarsBehavior = WindowInsetsControllerCompat.BEHAVIOR_SHOW_TRANSIENT_BARS_BY_SWIPE        }    }     private val isVisibleStateFlow = MutableStateFlow(isSystemBarsVisible)     private fun systemUiBars() =        WindowInsetsCompat.Type.statusBars() or WindowInsetsCompat.Type.navigationBars()     override var isSystemBarsVisible: Boolean        get() {            return ViewCompat.getRootWindowInsets(view)                ?.isVisible(systemUiBars()) == true        }        set(value) {            if (value) {                windowInsetsController?.show(systemUiBars())            } else {                windowInsetsController?.hide(systemUiBars())            }            isVisibleStateFlow.value = value        }     override val isVisible: StateFlow&lt;Boolean>        get() = isVisibleStateFlow.asStateFlow() }  val SystemUiVisibilityController.toggleUi: () -> Unit    get() = {        isSystemBarsVisible = !isSystemBarsVisible    }  @Composable private fun findWindow(): Window? =    (LocalView.current.parent as? DialogWindowProvider)?.window        ?: LocalView.current.context.findWindow()  private tailrec fun Context.findWindow(): Window? =    when (this) {        is Activity -> window        is ContextWrapper -> baseContext.findWindow()        else -> null    } <\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n<pre><code class=\"kotlin\">val systemUiVisibilityController = rememberSystemUiVisibilityController() InsetsExamplesTheme {    FullscreenCutoutSample(        systemUiVisibilityController.toggleUi    ) } <\/code><\/pre>\n<p><a class=\"anchor\" name=\"12\" id=\"12\"><\/a><\/p>\n<h3>Display Cutouts (\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0432\u044b\u0440\u0435\u0437\u043e\u0432 \u0434\u0438\u0441\u043f\u043b\u0435\u044f)<\/h3>\n<p>\u0412\u0441\u0435 \u0447\u0430\u0449\u0435 \u043d\u0430 \u0442\u0435\u043b\u0435\u0444\u043e\u043d\u0430\u0445 \u0441\u0442\u0430\u043b\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0447\u0435\u043b\u043a\u0438 \u0438 \u0432\u044b\u0440\u0435\u0437\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u0440\u0430\u0437\u043d\u044b\u0445 \u043c\u0435\u0441\u0442\u0430\u0445 \u044d\u043a\u0440\u0430\u043d\u0430, \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0445 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u0438 \u0444\u043e\u0440\u043c.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ba9\/e54\/447\/ba9e544473ea6538e3ddb37688f92052.png\" width=\"1838\" height=\"526\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ba9\/e54\/447\/ba9e544473ea6538e3ddb37688f92052.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 android 9 (api 28) \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u043a\u043b\u0430\u0441\u0441 <em>DisplayCutout<\/em>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u044b\u0440\u0435\u0437\u043e\u0432. \u041f\u043e\u043c\u0438\u043c\u043e \u044d\u0442\u043e\u0433\u043e, \u0435\u0441\u0442\u044c \u043d\u0430\u0431\u043e\u0440 \u0444\u043b\u0430\u0433\u043e\u0432 \u0443 <em>WindowManager.LayoutParams<\/em>, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0432\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0440\u0430\u0437\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432\u043e\u043a\u0440\u0443\u0433 \u0432\u044b\u0440\u0435\u0437\u043e\u0432.<\/p>\n<p>\u0414\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u0444\u043b\u0430\u0433\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#layoutInDisplayCutoutMode\"><u>layoutInDisplayCutoutMode<\/u><\/a>, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0449\u0438\u0439, \u043a\u0430\u043a \u0432\u0430\u0448 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u044b\u0440\u0435\u0437\u043e\u0432. \u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f:<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT\"><u>LAYOUT_IN_DISPLAY_CUTOUT_MODE_DEFAULT<\/u><\/a> \u2014 \u0432 \u043f\u043e\u0440\u0442\u0440\u0435\u0442\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f\u00a0 \u043f\u043e\u0434 \u043e\u0431\u043b\u0430\u0441\u0442\u044c\u044e \u0432\u044b\u0440\u0435\u0437\u0430 \u0432 \u043f\u043e\u0440\u0442\u0440\u0435\u0442\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435, \u0430 \u0432 \u0430\u043b\u044c\u0431\u043e\u043c\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u0431\u0443\u0434\u0435\u0442 \u0447\u0435\u0440\u043d\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430.<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES\"><u>LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES<\/u><\/a> \u2014 \u0421\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u044b\u0440\u0435\u0437\u0430 \u043a\u0430\u043a \u0432 \u043f\u043e\u0440\u0442\u0440\u0435\u0442\u043d\u043e\u043c, \u0442\u0430\u043a \u0438 \u0432 \u0430\u043b\u044c\u0431\u043e\u043c\u043d\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0430\u0445.<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER\"><u>LAYOUT_IN_DISPLAY_CUTOUT_MODE_NEVER<\/u><\/a> \u2014 \u0421\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442\u0441\u044f \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u044b\u0440\u0435\u0437\u0430.<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS\"><u>LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS <\/u><\/a>\u2014 \u0412 \u044d\u0442\u043e\u043c \u0440\u0435\u0436\u0438\u043c\u0435 \u043e\u043a\u043d\u043e \u0440\u0430\u0441\u0448\u0438\u0440\u044f\u0435\u0442\u0441\u044f \u043f\u043e\u0434 \u0432\u044b\u0440\u0435\u0437\u0430\u043c\u0438 \u043f\u043e \u0432\u0441\u0435\u043c \u043a\u0440\u0430\u044f\u043c \u0434\u0438\u0441\u043f\u043b\u0435\u044f \u043a\u0430\u043a \u0432 \u043f\u043e\u0440\u0442\u0440\u0435\u0442\u043d\u043e\u0439, \u0442\u0430\u043a \u0438 \u0432 \u0430\u043b\u044c\u0431\u043e\u043c\u043d\u043e\u0439 \u043e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u0438, \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e \u043e\u0442 \u0442\u043e\u0433\u043e, \u0441\u043a\u0440\u044b\u0432\u0430\u0435\u0442 \u043b\u0438 \u043e\u043a\u043d\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0435 \u043f\u0430\u043d\u0435\u043b\u0438 ( <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES\"><u>LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES<\/u><\/a> \u043f\u043e\u043b\u043d\u044b\u0439 \u0430\u043d\u0430\u043b\u043e\u0433, \u043d\u043e \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0441 28 api, \u043a\u043e\u0433\u0434\u0430 <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowManager.LayoutParams#LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS\"><u>LAYOUT_IN_DISPLAY_CUTOUT_MODE_ALWAYS<\/u><\/a> \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0432 30 api).<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043e\u0431 \u044d\u0442\u0438\u0445 \u0444\u043b\u0430\u0433\u0430\u0445 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u043c \u0433\u0430\u0439\u0434\u0435 <a href=\"https:\/\/developer.android.com\/guide\/topics\/display-cutout\"><u>\u0437\u0434\u0435\u0441\u044c<\/u><\/a>.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n<pre><code class=\"kotlin\">if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.P) {     window.attributes.layoutInDisplayCutoutMode =  WindowManager.LayoutParams.LAYOUT_IN_DISPLAY_CUTOUT_MODE_SHORT_EDGES }<\/code><\/pre>\n<p>\u0412 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435 <a href=\"https:\/\/chrisbanes.github.io\/insetter\/\"><u>insetter<\/u><\/a> \u0435\u0441\u0442\u044c \u0444\u043b\u0430\u0433 \u0434\u043b\u044f <em>displayCutout<\/em>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c padding \u0438 margin \u043e\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0432\u044b\u0440\u0435\u0437\u0430.\u00a0<\/p>\n<pre><code class=\"kotlin\">applyInsetter {    type(displayCutout = true) {        \/\/ \u0443\u043a\u0430\u0436\u0438\u0442\u0435 \u043d\u0443\u0436\u043d\u044b\u0435 \u0432\u0430\u043c \u0441\u0442\u043e\u0440\u043e\u043d\u044b         \/\/ \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 padding(top = true)        padding()     }  } <\/code><\/pre>\n<p>\u0412 <em>Jetpack Compose<\/em> \u0432\u0430\u043c \u0442\u0430\u043a\u0436\u0435 \u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <em>layoutInDisplayCutoutMode<\/em> \u0447\u0442\u043e\u0431\u044b \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0440\u0435\u0436\u0438\u043c \u0434\u043b\u044f <em>DisplayCotout<\/em>. \u0412 compose \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 padding \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c  <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowInsets#getDisplayCutout()\"><em>WindowInsets.displayCutout<\/em><\/a> \u0438\u043b\u0438 <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.ui.Modifier).displayCutoutPadding()\"><em>Modifier.displayCutoutPadding()<\/em><\/a>.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0430\u043c \u0432\u0434\u0440\u0443\u0433 \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u0438\u0442\u0441\u044f \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0437\u043e\u043d\u0443 \u0432\u044b\u0440\u0435\u0437\u0430, \u0442\u043e \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/DisplayCutoutCompat#getBoundingRects()\"><strong><u>DisplayCutoutCompat.getBoundingRects()<\/u><\/strong><\/a>. \u042d\u0442\u043e\u0442 \u043c\u0435\u0442\u043e\u0434 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432 \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u044e\u0449\u0438\u043c \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u043c \u0434\u043b\u044f \u043d\u0435\u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043d\u0430 \u0434\u0438\u0441\u043f\u043b\u0435\u0435.\u00a0<\/p>\n<pre><code class=\"kotlin\">ViewCompat.setOnApplyWindowInsetsListener(root) { view, insets ->    val boundingRects = insets.displayCutout?.boundingRects    insets } <\/code><\/pre>\n<p>\u0412 <em>Jetpack Compose<\/em> \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/layout\/package-summary#(androidx.compose.foundation.layout.WindowInsets.Companion).displayCutout()\"><strong><u>WindowInsets.displayCutout<\/u><\/strong><\/a> \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c\u00a0 boundingRects \u043d\u0435\u043b\u044c\u0437\u044f.<\/p>\n<p>\u042f \u0441\u0447\u0438\u0442\u0430\u044e, \u0447\u0442\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0442\u044c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u044b\u0440\u0435\u0437\u0430 \u043d\u0435 \u0438\u043c\u0435\u0435\u0442 \u0441\u043c\u044b\u0441\u043b\u0430 \u043f\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043f\u0440\u0438\u0447\u0438\u043d\u0430\u043c:<\/p>\n<ul>\n<li>\n<p>\u0442\u0430\u043c \u0433\u0434\u0435 \u043d\u0435\u0442 \u0432\u044b\u0440\u0435\u0437\u0430 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u0438\u0437 Status Bar (\u0432\u0440\u0435\u043c\u044f, \u0438\u043a\u043e\u043d\u043a\u0438);<\/p>\n<\/li>\n<li>\n<p>api \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0441\u043f\u0438\u0441\u043e\u043a, \u0430 \u0437\u043d\u0430\u0447\u0438\u0442 \u0432\u044b\u0440\u0435\u0437\u043e\u0432 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e;<\/p>\n<\/li>\n<li>\n<p>\u0432\u044b\u0440\u0435\u0437\u044b \u0431\u044b\u0432\u0430\u044e \u0440\u0430\u0437\u043d\u044b\u0445 \u0444\u043e\u0440\u043c \u0438 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u043e\u0431\u0449\u0435\u043c \u0432\u0441\u0435 \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0442\u0430\u043a \u043b\u0443\u0447\u0448\u0435 \u043d\u0435 \u0434\u0435\u043b\u0430\u0442\u044c, \u043d\u043e \u0435\u0441\u043b\u0438 \u043e\u0447\u0435\u043d\u044c \u043d\u0430\u0434\u043e, \u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043c\u043e\u0436\u043d\u043e.\u00a0<\/p>\n<p><a class=\"anchor\" name=\"13\" id=\"13\"><\/a><\/p>\n<h3>System Gesture Insets<\/h3>\n<p>\u042d\u0442\u043e\u0442 \u0432\u0438\u0434 insets \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u0432 Android 10\u00a0 \u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0436\u0435\u0441\u0442\u043e\u0432 \u0434\u043e\u043c\u043e\u0439 \u0441\u043d\u0438\u0437\u0443 \u0438 \u043d\u0430\u0437\u0430\u0434 \u0441\u043f\u0440\u0430\u0432\u0430 \u0438 \u0441\u043b\u0435\u0432\u0430 \u043e\u0442 \u044d\u043a\u0440\u0430\u043d\u0430.\u00a0<\/p>\n<p>\u0422\u0430\u043a\u043e\u0433\u043e \u0440\u043e\u0434\u0430 insets \u043f\u043e\u044f\u0432\u0438\u043b\u0438\u0441\u044c \u0432 Android 10. \u041e\u043d\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u044e\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0436\u0435\u0441\u0442\u043e\u0432 \u0434\u043e\u043c\u043e\u0439 \u0441\u043d\u0438\u0437\u0443 \u0438 \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u043f\u0440\u0430\u0432\u0443\u044e \u0438 \u043b\u0435\u0432\u0443\u044e \u0447\u0430\u0441\u0442\u0438 \u044d\u043a\u0440\u0430\u043d\u0430.<\/p>\n<figure class=\"float full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2c2\/dec\/155\/2c2dec155871ffa0563cbbed07987d95.png\" width=\"759\" height=\"1600\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2c2\/dec\/155\/2c2dec155871ffa0563cbbed07987d95.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0432 \u044d\u0442\u0438\u0445 \u0437\u043e\u043d\u0430\u0445, \u0442\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u043c\u043e\u0433\u0443\u0442 \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u043e \u0432\u044b\u0437\u0432\u0430\u0442\u044c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0436\u0435\u0441\u0442 \u043d\u0430\u0437\u0430\u0434. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0441\u043b\u0438 \u0432\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0442\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044c \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u043e\u0442 \u043a\u0440\u0430\u044f, \u043d\u043e \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443 \u0441 \u0436\u0435\u0441\u0442\u0430\u043c\u0438.\u00a0<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440: \u043d\u0430 \u0433\u0438\u0444\u043a\u0435 \u043d\u0438\u0436\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0445\u043e\u0447\u0435\u0442 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0441\u043a\u0440\u043e\u043b\u043b \u0438 \u0431\u0435\u0437 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0436\u0435\u0441\u0442\u043e\u0432 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u0432\u044b\u0445\u043e\u0434. \u0422\u0430\u043a\u0436\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0442\u043e\u0438\u0442 \u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u0447\u0442\u043e \u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u0437\u043e\u043d\u044b \u0441 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u0436\u0435\u0441\u0442\u043e\u0432 \u043c\u043e\u0433\u0443\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u043d\u0435\u043f\u043e\u043d\u044f\u0442\u043d\u043e\u043c\u0443 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044e \u0434\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0441\u0442\u043e\u0438\u0442 \u0438\u0441\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0436\u0435\u0441\u0442\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0442\u0435\u0445 \u043c\u0435\u0441\u0442\u0430\u0445, \u0433\u0434\u0435 \u044d\u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e. \u0415\u0441\u043b\u0438 \u0440\u0430\u0441\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0438\u0436\u0435, \u0442\u043e \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0436\u0435\u0441\u0442\u043e\u0432 \u0434\u043e\u043b\u0436\u043d\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0441 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u043c \u0441\u043a\u0440\u043e\u043b\u043b\u043e\u043c.<\/p>\n<figure class=\"float full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2db\/d9c\/a1b\/2dbd9ca1bd621e6953aaf06e8b353fb7.gif\" width=\"576\" height=\"1280\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2db\/d9c\/a1b\/2dbd9ca1bd621e6953aaf06e8b353fb7.gif\"\/><figcaption><\/figcaption><\/figure>\n<p>\u041a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e, \u044f \u043d\u0435 \u043d\u0430\u0448\u0435\u043b \u0441\u043f\u043e\u0441\u043e\u0431\u0430 \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0436\u0435\u0441\u0442\u044b \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 <a href=\"https:\/\/chrisbanes.github.io\/insetter\/\"><u>insetter<\/u><\/a>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b. \u0412 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043d\u0438\u0436\u0435 \u043c\u044b \u0438\u0441\u043a\u043b\u044e\u0447\u0430\u0435\u043c \u0436\u0435\u0441\u0442\u044b \u0434\u043b\u044f <a href=\"https:\/\/material.io\/components\/sheets-bottom\/android\"><u>BottomSheetBehavior<\/u><\/a>, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 \u0440\u0430\u0437\u0432\u0435\u0440\u043d\u0443\u0442\u043e\u043c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u0438 \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u043c, \u043a\u043e\u0433\u0434\u0430 <a href=\"https:\/\/material.io\/components\/sheets-bottom\/android\"><u>BottomSheetBehavior<\/u><\/a> \u0441\u0432\u0435\u0440\u043d\u0443\u0442.\u00a0 <\/p>\n<p>\u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u0434\u043b\u044f <em>View<\/em> \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439, \u0447\u0442\u043e <code>windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures())<\/code>\u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043f\u0443\u0441\u0442\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435. \u042f \u0434\u043e\u043b\u0433\u043e \u043c\u0443\u0447\u0438\u043b\u0441\u044f \u0441 \u044d\u0442\u0438\u043c, \u043f\u043e\u043a\u0430 \u043d\u0435 \u0440\u0435\u0448\u0438\u043b \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430 \u044d\u043c\u0443\u043b\u044f\u0442\u043e\u0440\u0435 \u0438 \u043d\u0435 \u0443\u0432\u0438\u0434\u0435\u043b, \u0447\u0442\u043e \u0432\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442. \u0427\u0442\u043e\u0431\u044b \u0443\u0436 \u0442\u043e\u0447\u043d\u043e \u0443\u0434\u043e\u0441\u0442\u043e\u0432\u0435\u0440\u0438\u0442\u044c\u0441\u044f, \u044f \u0441\u043a\u0438\u043d\u0443\u043b apk \u0441\u0432\u043e\u0438\u043c \u043a\u043e\u043b\u043b\u0435\u0433\u0430\u043c \u0438 \u043f\u043e\u043b\u0443\u0447\u0438\u043b \u0432 \u043e\u0442\u0432\u0435\u0442 &#8212; \u0432\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442.  \u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0431\u044b\u043b\u0430 \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u044f \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043b \u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430 \u0441\u0432\u043e\u0435\u043c \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0435 (Realme c21). \u0412\u0435\u043d\u0434\u043e\u0440\u044b \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u043e \u0448\u0430\u043b\u044f\u0442.                          <\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">private fun setupInsets() = with(binding) {     ViewCompat.setOnApplyWindowInsetsListener(root) { _, windowInsets ->        setupBottomSheetCollback(bottomSheetBehavior, windowInsets)        windowInsets    } }  private fun &lt;T : View> setupBottomSheetCollback(    bottomSheetBehavior: BottomSheetBehavior&lt;T>,    windowInsets: WindowInsetsCompat ) {    bottomSheetCallback = object : BottomSheetBehavior.BottomSheetCallback() {        override fun onSlide(bottomSheet: View, slideOffset: Float) = Unit         override fun onStateChanged(bottomSheet: View, newState: Int) {            when (newState) {                BottomSheetBehavior.STATE_EXPANDED -> {                    excludeGesturesHorizontalLit(windowInsets)                }                BottomSheetBehavior.STATE_COLLAPSED -> {                    ViewCompat.setSystemGestureExclusionRects(binding.root, listOf())                }            }        }    }    bottomSheetCallback?.let(bottomSheetBehavior::addBottomSheetCallback) }  private fun excludeGesturesHorizontalLit(windowInsets: WindowInsetsCompat) {    binding.root.doOnLayout {        val gestureInsets =            windowInsets.getInsets(WindowInsetsCompat.Type.systemGestures())         with(binding) {           val rectTop = root.bottom - bottomSheetInclude.list.height           val rectBottom = root.bottom                      val leftExclusionRectLeft = 0           val leftExclusionRectRight = gestureInsets.left                      val rightExclusionRectLeft = root.right - gestureInsets.right           val rightExclusionRectRight = root.right                      root.setSystemGestureExclusionRectsCompat(               rects = listOf(                   Rect(                       leftExclusionRectLeft,                       rectTop,                       leftExclusionRectRight,                       rectBottom                   ),                   Rect(                       rightExclusionRectLeft,                       rectTop,                       rightExclusionRectRight,                       rectBottom                   )               )           )        }    } } <\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u0427\u0442\u043e\u0431\u044b \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0436\u0435\u0441\u0442\u044b \u0432 <em>Jetpack Compose<\/em><strong>,<\/strong> \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/compose\/foundation\/package-summary#(androidx.compose.ui.Modifier).systemGestureExclusion()\"><em>Modifier.systemGestureExclusion()<\/em><\/a>.<\/p>\n<pre><code class=\"kotlin\">LazyRow(    modifier = Modifier        .padding(vertical = 16.dp)        .systemGestureExclusion(),    contentPadding = PaddingValues(horizontal = 16.dp),    horizontalArrangement = Arrangement.spacedBy(16.dp) ) {     \/\/... } <\/code><\/pre>\n<p><a class=\"anchor\" name=\"14\" id=\"14\"><\/a><\/p>\n<h3>Mandatory System Gesture Insets<\/h3>\n<p>\u0414\u0430\u043d\u043d\u044b\u0439 \u0442\u0438\u043f insets \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u0432 Android 10 \u0438 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u043e\u0434\u0442\u0438\u043f\u043e\u043c <em>System Gesture Insets.<\/em> \u041e\u043d\u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u044d\u043a\u0440\u0430\u043d\u0430, \u0433\u0434\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0436\u0435\u0441\u0442\u0430 \u0431\u0443\u0434\u0435\u0442 \u0432\u0441\u0435\u0433\u0434\u0430 \u0432 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u0435 \u043d\u0430\u0434 \u0436\u0435\u0441\u0442\u0430\u043c\u0438 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u041e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0437\u043e\u043d\u044b \u0436\u0435\u0441\u0442\u043e\u0432 \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u043c\u0438 (\u0441 android 10 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0437\u043e\u043d\u043e\u0439 \u0436\u0435\u0441\u0442\u043e\u0432 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0437\u043e\u043d\u0430 \u0441 \u0436\u0435\u0441\u0442\u043e\u043c \u0434\u043e\u043c\u043e\u0439). \u041e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 insets \u043e\u0442\u043e\u0434\u0432\u0438\u0433\u0430\u044e\u0442 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043e\u0442 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0432\u0441\u0442\u0430\u0432\u043e\u043a \u0436\u0435\u0441\u0442\u043e\u0432. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c seekbar \u0441\u043d\u0438\u0437\u0443 \u044d\u043a\u0440\u0430\u043d\u0430, \u0432\u0430\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Mandatory System Gesture Insets, \u0447\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u0432\u044b\u0437\u043e\u0432\u0430 \u0436\u0435\u0441\u0442\u043e\u0432.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7ff\/59e\/b71\/7ff59eb71954691244b360677a3131b0.gif\" width=\"1200\" height=\"600\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7ff\/59e\/b71\/7ff59eb71954691244b360677a3131b0.gif\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0412 <em>View<\/em>\u00a0\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 <em>insets<\/em> \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 <a href=\"https:\/\/chrisbanes.github.io\/insetter\/\"><u>insetter<\/u><\/a>:\u00a0<\/p>\n<pre><code class=\"kotlin\">seekBar.applyInsetter {    type(mandatorySystemGestures = true) {        padding(bottom = true)    } } <\/code><\/pre>\n<p>\u0412 <em>Jetpack Compose<\/em> \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0436\u0435\u0441\u0442\u044b \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e\u00a0 <em>WindowInsets.mandatorySystemGestures<\/em>:<\/p>\n<pre><code class=\"kotlin\">Surface(    modifier = Modifier        .fillMaxWidth()        .windowInsetsPadding(            WindowInsets.mandatorySystemGestures                .only(WindowInsetsSides.Bottom)                .union(                    WindowInsets.navigationBars.only(WindowInsetsSides.Horizontal)                )        ),    color = Color.LightGray.copy(alpha = 0.3f) ) {    \/\/ content } <\/code><\/pre>\n<p><a class=\"anchor\" name=\"15\" id=\"15\"><\/a><\/p>\n<h3>Tappable element insets<\/h3>\n<p>\u0414\u0430\u043d\u043d\u044b\u0439 \u0442\u0438\u043f \u0432\u0441\u0442\u0430\u0432\u043a\u0438 \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u0432 android 10 \u0438 \u043d\u0443\u0436\u0435\u043d \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0440\u0430\u0437\u043d\u044b\u0445 \u0440\u0435\u0436\u0438\u043c\u043e\u0432 Navigation Bar. \u0414\u0430\u043d\u043d\u044b\u0439 \u0432\u0438\u0434 <em>insets<\/em> \u0440\u0435\u0434\u043a\u043e \u043a\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u0442\u043b\u0438\u0447\u0438\u044f \u043e\u0442 <em>system window insets<\/em> \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b. \u041d\u043e \u0441\u043e\u0433\u043b\u0430\u0441\u0438\u0442\u0435\u0441\u044c, \u043f\u0440\u0438\u044f\u0442\u043d\u043e \u043e\u0441\u043e\u0437\u043d\u0430\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043e \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u043a\u0440\u0443\u0442\u043e.\u00a0<\/p>\n<p>\u041d\u0430 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0435 \u043d\u0438\u0436\u0435 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u0438\u0434\u0435\u0442\u044c, \u0447\u0442\u043e <em>tappable element insets<\/em> \u0438 <em>system window insets<\/em>   \u0434\u0435\u0439\u0441\u0442\u0432\u0443\u044e\u0442 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e, \u043a\u043e\u0433\u0434\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043d\u043e \u043d\u0430 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u043d\u043e\u043f\u043e\u043a. \u041e\u0442\u043b\u0438\u0447\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0436\u0435\u0441\u0442\u043e\u0432.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/ce3\/15b\/04f\/ce315b04fe20eeae584cf49a64c82ad6.png\" width=\"1400\" height=\"1142\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ce3\/15b\/04f\/ce315b04fe20eeae584cf49a64c82ad6.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u0414\u0435\u043b\u043e \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043f\u0440\u0438 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 \u0436\u0435\u0441\u0442\u0430\u043c\u0438 \u043c\u044b \u043d\u0435 \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u043c, \u0430 \u0434\u0435\u043b\u0430\u0435\u043c \u0441\u0432\u0430\u0439\u043f \u0441\u043d\u0438\u0437\u0443 \u0432\u0432\u0435\u0440\u0445. \u042d\u0442\u043e \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u044d\u0442\u043e\u0439 \u0437\u043e\u043d\u0435 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <a href=\"https:\/\/material.io\/components\/buttons-floating-action-button\/android#regular-fabs\"><u>FloatingActionButton<\/u><\/a>), \u0430 \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u043e\u0442\u0441\u0442\u0443\u043f \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0438  <em>tappable element insets <\/em>\u0432\u0435\u0440\u043d\u0435\u0442 0.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f c view (\u0432\u0441\u0435 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 <a href=\"https:\/\/chrisbanes.github.io\/insetter\/\"><u>insetter<\/u><\/a>):<\/p>\n<pre><code class=\"kotlin\">fab.applyInsetter {    type(tappableElement = true) {        margin(bottom = true)    } } <\/code><\/pre>\n<p>\u0412 <em>Jetpack Compose \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <\/em><a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/core\/view\/WindowInsetsCompat.Type#tappableElement()\"><em>WindowInsets.tappableElement<\/em><\/a><em>:<\/em><\/p>\n<pre><code class=\"kotlin\">Scaffold(    floatingActionButton = {       FloatingActionButton(           modifier = Modifier.padding(               bottom = WindowInsets.tappableElement                   .only(WindowInsetsSides.Bottom)                   .asPaddingValues()                   .calculateBottomPadding()           ),           backgroundColor = backgroundColor,           onClick = onClick       ) {           Icon(               imageVector = Icons.Filled.Add,               contentDescription = null           )       } ){ \/\/ content... } <\/code><\/pre>\n<p><a class=\"anchor\" name=\"16\" id=\"16\"><\/a><\/p>\n<h2>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h2>\n<p>\u0412\u0435\u0441\u044c \u043a\u043e\u0434 \u0438\u0437 \u0441\u0442\u0430\u0442\u044c\u0438 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432 <a href=\"https:\/\/github.com\/TimurChikishev\/Insets\"><u>\u044d\u0442\u043e\u043c<\/u><\/a> \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438.\u00a0<\/p>\n<p>\u041c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043b\u0438 \u043d\u044e\u0430\u043d\u0441\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 <em>e2e<\/em> \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u043d\u0430 Android \u0438 \u043f\u0440\u0438\u043c\u0435\u0440 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 <a href=\"https:\/\/chrisbanes.github.io\/insetter\/\"><u>insetter<\/u><\/a> \u0434\u043b\u044f <em>View<\/em>, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 <em>insets<\/em> \u0432 <em>Jetpack Compose<\/em>. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0445\u043e\u0442\u0435\u043b \u0434\u043e\u043d\u0435\u0441\u0442\u0438 \u0434\u043e \u0432\u0441\u0435\u0445 android \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u0447\u0442\u043e <em>e2e<\/em> \u043d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442 \u0432 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u0430 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441\u0442\u043e\u0438\u0442 \u0437\u0430\u0442\u0440\u0430\u0447\u0435\u043d\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u042f \u043d\u0430\u0434\u0435\u044e\u0441\u044c, \u0447\u0442\u043e \u044d\u0442\u0430 \u0441\u0442\u0430\u0442\u044c\u044f \u0431\u044b\u043b\u0430 \u0432\u0430\u043c \u043f\u043e\u043b\u0435\u0437\u043d\u0430, \u0438 \u0432\u0441\u0435 \u0431\u043e\u043b\u044c\u0448\u0435 \u0438 \u0431\u043e\u043b\u044c\u0448\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432 \u0431\u0443\u0434\u0443\u0442 \u0432\u043d\u0435\u0434\u0440\u044f\u0442\u044c <em>e2e<\/em> \u0432 \u0441\u0432\u043e\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0435 \u043b\u0438 \u0432\u044b edge-to-edge \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445? \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u043b\u0438 \u0432\u044b \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 insets? \u0421 \u043a\u0430\u043a\u0438\u043c\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438 \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u043b\u0438\u0441\u044c \u043f\u0440\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 edge-to-edge?<\/p>\n<p>\u0412\u044b\u0440\u0430\u0436\u0430\u0435\u043c \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u043d\u043e\u0441\u0442\u044c \u0412\u0430\u0434\u0438\u043c\u0443 (<a class=\"mention\" href=\"\/users\/vad99lord\">@vad99lord<\/a>) \u0437\u0430 \u043f\u043e\u043c\u043e\u0449\u044c \u0432 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043a\u0435 \u0441\u0442\u0430\u0442\u044c\u0438.<\/p>\n<\/p>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"v-portal\" style=\"display:none;\"><\/div>\n<\/div>\n<p> <!----> <\/p>\n<div class=\"tm-article-poll\">\n<div class=\"tm-notice tm-article-poll__notice tm-notice_positive\"><!----> <\/p>\n<div class=\"tm-notice__inner\"><!----> <\/p>\n<div data-test-id=\"notice-content\" class=\"tm-notice__content\"><span>\u0422\u043e\u043b\u044c\u043a\u043e \u0437\u0430\u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u043c\u043e\u0433\u0443\u0442 \u0443\u0447\u0430\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0432 \u043e\u043f\u0440\u043e\u0441\u0435. <a rel=\"nofollow\" href=\"\/kek\/v1\/auth\/habrahabr\/?back=\/ru\/company\/kts\/blog\/687310\/&#038;hl=ru\">\u0412\u043e\u0439\u0434\u0438\u0442\u0435<\/a>, \u043f\u043e\u0436\u0430\u043b\u0443\u0439\u0441\u0442\u0430.<\/span><\/div>\n<\/div>\n<\/div>\n<div class=\"tm-article-poll__header\">\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0435 \u043b\u0438 \u0432\u044b edge-to-edge \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445?<\/div>\n<div class=\"tm-article-poll__answers\">\n<div class=\"tm-article-poll__answer\">\n<div class=\"tm-article-poll__answer-data\"><span class=\"tm-article-poll__answer-percent tm-article-poll__answer-percent_winning\">             75%           <\/span> <span class=\"tm-article-poll__answer-label\">\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u0432 \u0440\u0430\u0431\u043e\u0447\u0435\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435<\/span> <span class=\"tm-article-poll__answer-votes\">             3           <\/span><\/div>\n<div class=\"tm-article-poll__answer-bar\">\n<div class=\"tm-article-poll__answer-progress tm-article-poll__answer-progress_winning\" style=\"width:75%;\"><\/div>\n<\/div>\n<\/div>\n<div class=\"tm-article-poll__answer\">\n<div class=\"tm-article-poll__answer-data\"><span class=\"tm-article-poll__answer-percent\">             25%           <\/span> <span class=\"tm-article-poll__answer-label\">\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u044e \u0432 \u0441\u0432\u043e\u0438\u0445 \u043f\u0435\u0442 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445<\/span> <span class=\"tm-article-poll__answer-votes\">             1           <\/span><\/div>\n<div class=\"tm-article-poll__answer-bar\">\n<div class=\"tm-article-poll__answer-progress\" style=\"width:25%;\"><\/div>\n<\/div>\n<\/div>\n<div class=\"tm-article-poll__answer\">\n<div class=\"tm-article-poll__answer-data\"><span class=\"tm-article-poll__answer-percent\">             0%           <\/span> <span class=\"tm-article-poll__answer-label\">\u041d\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u044e<\/span> <span class=\"tm-article-poll__answer-votes\">             0           <\/span><\/div>\n<div class=\"tm-article-poll__answer-bar\">\n<div class=\"tm-article-poll__answer-progress\" style=\"width:0%;\"><\/div>\n<\/div>\n<\/div>\n<\/div>\n<div class=\"tm-article-poll__stats\">        \u041f\u0440\u043e\u0433\u043e\u043b\u043e\u0441\u043e\u0432\u0430\u043b\u0438 4 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.           \u0412\u043e\u0437\u0434\u0435\u0440\u0436\u0430\u043b\u0441\u044f 1 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c.      <\/div>\n<\/div>\n<p> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/company\/kts\/blog\/687310\/\"> https:\/\/habr.com\/ru\/company\/kts\/blog\/687310\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u0438\u0432\u0435\u0442! \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0422\u0438\u043c\u0443\u0440, \u044f \u0437\u0430\u043d\u0438\u043c\u0430\u044e\u0441\u044c Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u043e\u0439 \u0432 <a href=\"https:\/\/kts.studio\/\"><u>KTS<\/u><\/a>.<\/p>\n<p>\u041a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e, \u0441\u0435\u0439\u0447\u0430\u0441 \u0432\u0441\u0435 \u0435\u0449\u0435 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u044e\u0442\u0441\u044f Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u044e\u0442 <em>edge-to-edge<\/em>. \u0421\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435, \u0447\u0442\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043b\u0438\u0431\u043e \u043d\u0435 \u0437\u043d\u0430\u044e\u0442 \u043e \u0442\u0430\u043a\u043e\u0439 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438, \u043b\u0438\u0431\u043e \u0431\u043e\u044f\u0442\u0441\u044f \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 <em>WindowInsets<\/em>. \u041d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c <em>edge-to-edge<\/em><strong> <\/strong>\u043d\u0435 \u0441\u043b\u043e\u0436\u043d\u043e, \u0430 \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u0432\u044b \u0441\u043c\u043e\u0436\u0435\u0442\u0435 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u044d\u0442\u043e\u0439 \u0442\u0435\u043c\u0435<strong> <\/strong>\u0432 \u0440\u0430\u0437\u044b \u0431\u044b\u0441\u0442\u0440\u0435\u0435.\u00a0<\/p>\n<p>\u0421\u0435\u0433\u043e\u0434\u043d\u044f \u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0435 \u0440\u0435\u0436\u0438\u043c <em>edge-to-edge<\/em> \u0432 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u0438 \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 <em>WindowInsets <\/em>\u0432 Android. \u0415\u0449\u0435 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 insets \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432\u043e <code>View<\/code><strong>, <\/strong>\u043d\u043e \u0438 \u0432 <em>Jectpack Compose<\/em><strong>. <\/strong>\u00a0\u0415\u0441\u043b\u0438 \u0441\u0442\u0430\u0442\u044c\u0438 \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 <em>insets<\/em> \u0432 <em>View<\/em>, \u0435\u0449\u0435 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u043d\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u0440\u0430\u0445 \u0438\u043d\u0442\u0435\u0440\u043d\u0435\u0442\u0430, \u0442\u043e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u043d\u0438\u043c\u0438 \u0432 <em>Jetpack Compose<\/em> \u0435\u0441\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438.\u00a0<\/p>\n<p>\u0412\u0441\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u0438\u0437 \u0441\u0442\u0430\u0442\u044c\u0438 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432\u00a0<a href=\"https:\/\/github.com\/TimurChikishev\/Insets\/\">\u044d\u0442\u043e\u043c <\/a>\u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0438.<\/p>\n<p>\u0421\u043e\u0434\u0435\u0440\u0436\u0430\u043d\u0438\u0435:<\/p>\n<ul>\n<li>\n<p><a href=\"#1\">\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 edge-to-edge?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/%E2%84%962\">\u042d\u0442\u0430\u043f\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 edge-to-edge:<\/a><\/p>\n<ul>\n<li>\n<p><a href=\"#3\">\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#4\">\u041e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#5\">\u0423\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u043e\u0432\u00a0<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"#6\">WindowInsets vs fitSystemWindow?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#7\">\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 insets<\/a><\/p>\n<ul>\n<li>\n<p><a href=\"#8\">System Window Insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#9\">Ime Insets (\u041e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#10\">Stable Insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#11\">Immersive mode (\u041f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u0431\u0435\u0437 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 UI)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#12\">Display Cutouts (\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0432\u044b\u0440\u0435\u0437\u043e\u0432 \u0434\u0438\u0441\u043f\u043b\u0435\u044f)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#13\">System Gesture Insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#14\">Mandatory system gesture insets<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"#15\">Tappable element insets<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"#16\">\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/a><\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"1\" id=\"1\"><\/a><\/p>\n<h2>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 edge-to-edge?<\/h2>\n<figure class=\"float full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u043c \u043c\u0438\u0440\u0435 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0432\u0441\u0435 \u0447\u0430\u0449\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u0432\u0441\u0435\u0439 \u0432\u0438\u0434\u0438\u043c\u043e\u0439 \u043f\u043e\u0432\u0435\u0440\u0445\u043d\u043e\u0441\u0442\u0438 \u0434\u0438\u0441\u043f\u043b\u0435\u044f, \u043d\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u044f\u0441\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u0441\u0438\u0441\u0442\u0435\u043c\u044b. \u0412 \u0442\u0430\u043a\u0438\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043f\u043e\u0434\u0445\u043e\u0434 <em>edge-to-edge<\/em>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI, \u0442.\u0435. \u043f\u043e\u0434 Status Bar \u0438 Navigation Bar.\u00a0<\/p>\n<p>\u0421\u043f\u0440\u043e\u0441\u0438\u0442\u0435, \u0437\u0430\u0447\u0435\u043c \u044d\u0442\u043e \u043d\u0443\u0436\u043d\u043e? \u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0432\u043b\u0435\u043a\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u0438 \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441. \u0421\u043e\u0433\u043b\u0430\u0441\u0438\u0442\u0435\u0441\u044c, \u0432\u0441\u0435\u043c \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u0438\u044f\u0442\u043d\u0435\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u041f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u043c \u043a \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438  <em>edge-to-edge<\/em>.<\/p>\n<p><a class=\"anchor\" name=\"2\" id=\"2\"><\/a><\/p>\n<h2>\u042d\u0442\u0430\u043f\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 edge-to-edge<\/h2>\n<p>\u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0440\u0435\u0436\u0438\u043c\u0430 <em>edge-to-edge<\/em> \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e:<\/p>\n<ul>\n<li>\n<p>\u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/p>\n<\/li>\n<li>\n<p>\u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI<\/p>\n<\/li>\n<li>\n<p>\u0443\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u044b<\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"3\" id=\"3\"><\/a><\/p>\n<h3>\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/h3>\n<p>\u041d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 Android 5 (API 21) \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u0434\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0434\u043b\u044f Status Bar \u0438 Navigation Bar. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u0442\u0435\u043c\u044b:<\/p>\n<pre><code class=\"kotlin\">&lt;item name=\"android:statusBarColor\">@color\/colorAccent&lt;\/item> &lt;item name=\"android:navigationBarColor\">@color\/colorAccent&lt;\/item><\/code><\/pre>\n<p>\u0415\u0449\u0435 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c \u0438\u043b\u0438 \u043f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c. \u0427\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438, \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowTranslucentStatus\"><strong><u>android:windowTranslucentStatus<\/u><\/strong><\/a> \u0438 <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowTranslucentNavigation\"><strong><u>android:windowTranslucentNavigation<\/u><\/strong><\/a><strong>:<\/strong><\/p>\n<pre><code class=\"kotlin\">&lt;item name=\"android:windowTranslucentStatus\">true&lt;\/item> &lt;item name=\"android:windowTranslucentNavigation\">true&lt;\/item><\/code><\/pre>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0427\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0433\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#navigationBarColor\"><strong><u>android:navigationBarColor<\/u><\/strong><\/a> \u0438 <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#statusBarColor\"><strong><u>android:statusBarColor<\/u><\/strong><\/a> \u0441 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c \u0438 \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0445 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/Window#isNavigationBarContrastEnforced()\"><strong><u>android:enforceNavigationBarContrast<\/u><\/strong><\/a>, <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/Window#isStatusBarContrastEnforced()\"><strong><u>android:enforceStatusBarContrast<\/u><\/strong><\/a>. \u041e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0441 10 \u0432\u0435\u0440\u0441\u0438\u0438 Android \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u0443\u044e \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c Navigation Bar.<\/p>\n<pre><code class=\"kotlin\">&lt;item name=\"android:statusBarColor\">@android:color\/transparent&lt;\/item> &lt;item name=\"android:navigationBarColor\">@android:color\/transparent&lt;\/item> &lt;item name=\"android:enforceNavigationBarContrast\">false&lt;\/item> &lt;item name=\"android:enforceStatusBarContrast\">false&lt;\/item><\/code><\/pre>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c, \u0447\u0442\u043e \u043d\u0430 \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442\u0435 \u0432\u044b\u0448\u0435 \u043f\u043b\u043e\u0445\u043e \u0432\u0438\u0434\u043d\u044b \u043a\u043d\u043e\u043f\u043a\u0438 \u043d\u0430 Navigation Bar. \u0412 Status Bar \u0431\u044b\u043b\u0430 \u0431\u044b \u0442\u0430 \u0436\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430, \u0435\u0441\u043b\u0438 \u0431\u044b \u043d\u0435 \u043f\u0443\u0440\u043f\u0443\u0440\u043d\u044b\u0439 \u0446\u0432\u0435\u0442. \u0427\u0442\u043e\u0431\u044b \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u044d\u0442\u043e, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightStatusBar\"><strong><u>android:windowLightStatusBar<\/u><\/strong><\/a><strong>, <\/strong><a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightNavigationBar\"><strong><u>android:windowLightNavigationBar<\/u><\/strong><\/a><strong>. <\/strong>\u041e\u0431\u0440\u0430\u0442\u0438\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435, \u0447\u0442\u043e <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightStatusBar\"><strong><u>windowLightStatusBar<\/u><\/strong><\/a><strong> <\/strong>\u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0441 23 api, \u0430 <a href=\"https:\/\/developer.android.com\/reference\/android\/R.attr#windowLightNavigationBar\"><strong><u>windowLightNavigationBar<\/u><\/strong><\/a><strong> <\/strong>\u0441 27 api.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412<em> Jetpack Compose<\/em> \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 <a href=\"https:\/\/github.com\/google\/accompanist\/tree\/main\/systemuicontroller\"><strong><u>System UI Controller<\/u><\/strong><\/a>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f\u00a0 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u044b\u0435 \u0443\u0442\u0438\u043b\u0438\u0442\u044b \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI. \u0418\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u0442\u043e\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u043c\u043e\u0436\u043d\u043e \u0442\u0430\u043a:<\/p>\n<pre><code class=\"kotlin\">private val BlackScrim = Color(0f, 0f, 0f, 0.3f) \/\/ 30% opaque black  @Composable fun TransparentSystemBars() {    val systemUiController = rememberSystemUiController()    val useDarkIcons = MaterialTheme.colors.isLight    SideEffect {        systemUiController.setSystemBarsColor(            color = Color.Transparent,            darkIcons = useDarkIcons,            isNavigationBarContrastEnforced = false,            transformColorForLightContent = { original ->                BlackScrim.compositeOver(original)            }        )    } }<\/code><\/pre>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 TransparentSystemBars:<\/p>\n<pre><code class=\"kotlin\">override fun onCreate(savedInstanceState: Bundle?) {     super.onCreate(savedInstanceState)    WindowCompat.setDecorFitsSystemWindows(window, false)    setContent {        TransparentSystemBars()        Sample()    } }<\/code><\/pre>\n<p>\u041c\u0435\u0442\u043e\u0434 <em>setSystemBarsColor<\/em><strong> <\/strong>\u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442:<\/p>\n<ul>\n<li>\n<p>\u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u0434\u043b\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI<\/p>\n<\/li>\n<li>\n<p>\u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u043a\u043e\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u0432\u0435\u0442\u043b\u044b\u0435 \u0438\u043b\u0438 \u0442\u0435\u043c\u043d\u044b\u0435 \u0438\u043a\u043e\u043d\u043a\u0438<\/p>\n<\/li>\n<li>\n<p>\u043c\u043e\u0436\u043d\u043e \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <em>isNavigationBarContrastEnforced<\/em>.\u00a0<\/p>\n<\/li>\n<li>\n<p>\u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043b\u044f\u043c\u0431\u0434\u0443 <em>transformColorForLightContent<\/em>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u043d\u0430 \u0434\u043b\u044f \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430, \u0435\u0441\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0448\u0435\u043d\u044b \u0442\u0435\u043c\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u043a\u0438, \u043d\u043e \u043e\u043d\u0438 \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b. \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u043d\u0430\u044f \u043d\u0430\u043a\u043b\u0430\u0434\u043a\u0430 (\u0432 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0432\u044b\u0448\u0435 \u0432 <em>transformColorForLightContent<\/em> \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043f\u0438\u0441\u0430\u0442\u044c \u044d\u0442\u043e\u0433\u043e \u043d\u0435 \u043d\u0443\u0436\u043d\u043e). <\/p>\n<\/li>\n<\/ul>\n<p><a class=\"anchor\" name=\"4\" id=\"4\"><\/a><\/p>\n<h3>\u0417\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u00a0 \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c UI<\/h3>\n<p>\u041a\u0440\u043e\u043c\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u043d\u0443\u0436\u043d\u043e \u0441\u043a\u0430\u0437\u0430\u0442\u044c \u0441\u0438\u0441\u0442\u0435\u043c\u0435, \u0447\u0442\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0443\u0436\u043d\u043e \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432 Android \u0435\u0441\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0444\u043b\u0430\u0433\u0438 <em>View SYSTEM_UI_FLAGS<\/em> (\u0434\u0430\u043b\u0435\u0435 <em>UI_FLAGS<\/em>). \u041e\u043d\u0438 deprecated \u043d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 API 30, \u0438 \u0442\u0435\u043f\u0435\u0440\u044c \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 WindowCompat, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0435 \u0444\u043b\u0430\u0433\u0438 \u043d\u0430 \u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u043d\u043d\u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 API.<\/p>\n<p>\u0417\u0430\u043f\u0440\u043e\u0441 \u043f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u0440\u0435\u0436\u0438\u043c\u0430 \u0447\u0435\u0440\u0435\u0437 <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/WindowCompat\"><strong><u>WindowCompat<\/u><\/strong><\/a><strong> <\/strong>\u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0442\u0430\u043a:<\/p>\n<pre><code>WindowCompat.setDecorFitsSystemWindows(window, false)<\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u044d\u0442\u043e \u0432 activity, \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0442\u044c insets \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0438 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/p>\n<p>\u0417\u0430\u043f\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u0446\u0435\u043b\u0435\u0441\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u043e \u0434\u043b\u044f \u0432\u0441\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f (\u0432 <code>onCreate()<\/code> \u0432\u0430\u0448\u0435\u0439 activity, \u0435\u0441\u043b\u0438 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u043f\u043e\u0434\u0445\u043e\u0434 single-activity).\u00a0<\/p>\n<p>\u0412 <em>Jetpack Compose<\/em> \u044d\u0442\u043e\u0442 \u044d\u0442\u0430\u043f \u043d\u0438\u0447\u0435\u043c \u043d\u0435 \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f.<\/p>\n<p><a class=\"anchor\" name=\"5\" id=\"5\"><\/a><\/p>\n<h3>\u0423\u0441\u0442\u0440\u0430\u043d\u0438\u0442\u044c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u044b<\/h3>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u043f\u0440\u043e\u0448\u043b\u044b\u0435 \u0448\u0430\u0433\u0438 \u0438 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043c\u043e\u0436\u043d\u043e \u0443\u0432\u0438\u0434\u0435\u0442\u044c, \u0447\u0442\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442 \u043c\u0435\u0441\u0442\u043e \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0439 UI. \u0422\u0435\u043f\u0435\u0440\u044c \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u0441\u0430\u043c\u0438\u043c:<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u0412 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u043f\u043e\u0434 Android \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0433\u043e UI \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f <a href=\"https:\/\/developer.android.com\/reference\/android\/view\/WindowInsets\"><em>WindowInsets<\/em><\/a>. <em>Insets<\/em><strong> <\/strong>\u2014 \u044d\u0442\u043e \u043e\u0431\u044a\u0435\u043a\u0442, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0439 \u0438\u0437 \u0441\u0435\u0431\u044f \u043e\u0431\u043b\u0430\u0441\u0442\u044c \u043e\u043a\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u0443\u0435\u0442 \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c. \u041a\u043e\u043d\u0444\u043b\u0438\u043a\u0442\u044b \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0435, \u0438 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0440\u0430\u0437\u043d\u044b\u0435 <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/core\/view\/WindowInsetsCompat.Type\"><u>\u0442\u0438\u043f\u044b<\/u><\/a> <em>insets<\/em><strong> <\/strong>(\u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0436\u0435\u0441\u0442\u043e\u0432, \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0435 \u043f\u0430\u043d\u0435\u043b\u0438, \u0447\u0435\u043b\u043a\u0438 \u0438 \u0442.\u0434.).\u00a0<\/p>\n<p>\u0414\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 <em>insets<\/em><strong> <\/strong>\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043a\u043b\u0430\u0441\u0441 <a href=\"https:\/\/developer.android.com\/reference\/androidx\/core\/view\/WindowInsetsCompat\"><em>WindowInsetsCompat <\/em><\/a>\u0441 \u043e\u0431\u0440\u0430\u0442\u043d\u043e\u0439 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u044c\u044e \u0438 \u0443\u0434\u043e\u0431\u043d\u044b\u043c \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435\u043c \u043d\u0430 <a href=\"https:\/\/developer.android.com\/reference\/kotlin\/androidx\/core\/view\/WindowInsetsCompat.Type\"><u>\u0442\u0438\u043f\u044b<\/u><\/a> insets.<\/p>\n<p>\u0421\u0430\u043c\u0430 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u043f\u0440\u0438\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u0438\u0438 \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044f \u043d\u0430 <em>View<\/em>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442 \u043e\u0431\u044a\u0435\u043a\u0442 <em>insets<\/em>. \u041f\u043e\u0441\u043b\u0435 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0442\u0440\u0435\u0431\u0443\u0435\u043c\u044b\u0435 padding \u0438\u043b\u0438 margin \u043d\u0430 <em>View<\/em>:<\/p>\n<pre><code class=\"kotlin\">ViewCompat.setOnApplyWindowInsetsListener(navBar) { view, insets ->     val systemBarInsets = insets.getInsets(WindowInsetsCompat.Type.systemBars())     view.updatePadding(         bottom = systemBarInsets.bottom,         left = systemBarInsets.left,         right = systemBarInsets.right     )     insets }<\/code><\/pre>\n<p>\u0412 <a href=\"https:\/\/kts.studio\/\"><u>KTS<\/u><\/a> \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><u>insetter<\/u><\/a>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043d\u0430 \u0431\u0430\u0437\u0435 \u044d\u0442\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430. \u0412 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d \u0443\u0434\u043e\u0431\u043d\u044b\u0439 Kotlin DSL applyInsetter \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 <em>insets<\/em>.<\/p>\n<pre><code class=\"kotlin\">toolbar.applyInsetter {     type(navigationBars = true, statusBars = true) {         padding(horizontal = true, top = true)     } }<\/code><\/pre>\n<p>\u0412<strong> <\/strong><em>Jetpack Compose<\/em> \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 <em>instes<\/em><strong> <\/strong>\u0440\u0430\u043d\u0435\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0430\u0441\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u0438\u0437 \u0440\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u044f <a href=\"https:\/\/github.com\/google\/accompanist\/tree\/main\/insets\"><strong><u>accompanist<\/u><\/strong><\/a>, \u043d\u043e \u043e\u043d\u0430 \u0443\u0441\u0442\u0430\u0440\u0435\u043b\u0430, \u0442\u0430\u043a \u043a\u0430\u043a \u0432 <em>Compose 1.2.0<\/em> \u0442\u0435\u043f\u0435\u0440\u044c \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u0430 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u0430\u044f \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 <em>insets<\/em>. \u0415\u0441\u043b\u0438 \u0432\u044b \u0443\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 <a href=\"https:\/\/github.com\/google\/accompanist\/tree\/main\/insets\"><strong><u>accompanist<\/u><\/strong><\/a>, \u0442\u043e \u043d\u0430 \u0441\u0430\u0439\u0442\u0435 \u0435\u0441\u0442\u044c \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0435 <a href=\"https:\/\/google.github.io\/accompanist\/insets\/\"><strong><u>\u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e \u043f\u043e \u043c\u0438\u0433\u0440\u0430\u0446\u0438\u0438<\/u><\/strong><\/a>.<\/p>\n<pre><code class=\"kotlin\">TopAppBar(     contentPadding = WindowInsets.systemBars         .only(WindowInsetsSides.Horizontal + WindowInsetsSides.Top)         .asPaddingValues(),     backgroundColor = MaterialTheme.colors.primary ) {     \/\/ content... }<\/code><\/pre>\n<p><a class=\"anchor\" name=\"6\" id=\"6\"><\/a><\/p>\n<h2>WindowInsets vs fitSystemWindow?<\/h2>\n<p>\u0412 Android \u0435\u0441\u0442\u044c \u0444\u043b\u0430\u0433 <em>fitSystemWindow<\/em>. \u0415\u0441\u043b\u0438 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u0435\u0433\u043e \u0432 \u00abtrue\u00bb, \u0442\u043e \u044d\u0442\u043e\u0442 \u0444\u043b\u0430\u0433 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 padding \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430, \u0443 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0432\u044b \u0443\u043a\u0430\u0437\u0430\u043b\u0438 \u0444\u043b\u0430\u0433.\u00a0<\/p>\n<p><em>FitsSystemWindows<\/em><strong> <\/strong>\u0441\u0431\u0438\u0432\u0430\u0435\u0442 \u0441 \u0442\u043e\u043b\u043a\u0443<strong> <\/strong>\u043c\u043d\u043e\u0433\u0438\u0445 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044d\u0442\u043e\u0442 \u0444\u043b\u0430\u0433 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 CoordinatorLayout \u0438 \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0434\u043b\u044f FrameLayout. FitsSystemWindows = true \u043d\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442 \u0432\u0430\u0448 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043f\u043e\u0434 \u0441\u0442\u0440\u043e\u043a\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f, \u043d\u043e \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0434\u043b\u044f \u0442\u0430\u043a\u0438\u0445 \u043c\u0430\u043a\u0435\u0442\u043e\u0432, \u043a\u0430\u043a CoordinatorLayout \u0438 DrawerLayout, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u043d\u0438 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u041f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442\u043e\u043c \u043e\u043d\u0438 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e\u0442 \u0444\u043b\u0430\u0433\u0438 <code>setSystemUiVisibility<\/code>(<code>View.SYSTEM_UI_FLAG_LAYOUT_STABLE\u00a0 | View.SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN<\/code>) \u0435\u0441\u043b\u0438 fitsSystemWindows \u0440\u0430\u0432\u0435\u043d <em>true<\/em>.\u00a0<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/View#SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN\"><u>SYSTEM_UI_FLAG_LAYOUT_FULLSCREEN<\/u><\/a> \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043f\u043e\u0434 \u0441\u0442\u0440\u043e\u043a\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f<\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/developer.android.com\/reference\/android\/view\/View#SYSTEM_UI_FLAG_LAYOUT_STABLE\"><u>SYSTEM_UI_FLAG_LAYOUT_STABLE<\/u><\/a> \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0445 insets, \u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0442\u0435\u043a\u0443\u0449\u0438\u0435 \u043c\u0435\u043d\u044c\u0448\u0435 \u044d\u0442\u043e\u0433\u043e.<\/p>\n<\/li>\n<\/ul>\n<p>\u0415\u0441\u043b\u0438 \u043c\u044b \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043c \u044d\u0442\u0438 \u0444\u043b\u0430\u0433\u0438 \u043a \u043d\u0430\u0448\u0435\u043c\u0443 rootLayout, \u0442\u043e \u0432\u0441\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0437\u0430\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0434\u0430\u0436\u0435 \u043d\u0430 FrameLayout.<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 <em>fitSystemWindow<\/em><strong> <\/strong>\u0432\u0430\u0436\u043d\u0430 \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u044f: \u0435\u0441\u043b\u0438 \u043a\u0442\u043e-\u0442\u043e \u0438\u0437 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u0435\u0439 \u0432\u044b\u0441\u0442\u0430\u0432\u0438\u043b \u044d\u0442\u043e\u0442 \u0444\u043b\u0430\u0433 \u0432 \u00abtrue\u00bb, \u0434\u0430\u043b\u044c\u0448\u0435 \u0435\u0433\u043e \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0435 \u0431\u0443\u0434\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 \u0443\u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u043b \u043e\u0442\u0441\u0442\u0443\u043f\u044b.<\/p>\n<p>\u041d\u0430 \u0441\u0430\u043c\u043e\u043c \u0434\u0435\u043b\u0435 \u044d\u0442\u043e \u043d\u0435 \u0432\u0441\u0435 \u043d\u044e\u0430\u043d\u0441\u044b \u0438\u0437-\u0437\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0444\u043b\u0430\u0433\u0430 <em>fitSystemWindow<\/em> \u043d\u0435 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f (\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u0445 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 <a href=\"https:\/\/habr.com\/ru\/company\/oleg-bunin\/blog\/488196\/\"><u>\u044d\u0442\u043e\u0439 <\/u><\/a>\u0441\u0442\u0430\u0442\u044c\u0435), \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0447\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0438 \u043d\u0435 \u043e\u0447\u0435\u0432\u0438\u0434\u043d\u043e\u0433\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f, \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u0442\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <em>WindowInsets<\/em><strong>.<\/strong><\/p>\n<p><a class=\"anchor\" name=\"7\" id=\"7\"><\/a><\/p>\n<h2>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 insets<\/h2>\n<p><a class=\"anchor\" name=\"8\" id=\"8\"><\/a><\/p>\n<h3>System Window Insets<\/h3>\n<p>\u042d\u0442\u043e\u0442 \u0442\u0438\u043f <em>insets<\/em> \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u043c. \u041e\u043d\u0438 \u043d\u0443\u0436\u043d\u044b, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043a\u0430\u043a <em>Status Bar<\/em> \u0438 <em>Navigation Bar<\/em>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0437\u0430\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u043d\u0430 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d, toolbar \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043f\u043e\u0434 Status Bar.<\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u00a0<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c <em>insets<\/em> \u0434\u043b\u044f toolbar, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 <a href=\"https:\/\/developer.android.com\/reference\/com\/google\/android\/material\/appbar\/AppBarLayout\"><em>AppBarLayout <\/em><\/a>\u0441 \u043f\u0443\u0440\u043f\u0443\u0440\u043d\u044b\u043c background. \u042d\u0442\u043e \u0434\u0430\u0441\u0442 \u043d\u0430\u043c \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0435\u043d\u0438\u044f AppBar \u0437\u0430 Status Bar. \u0412 \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043d\u0438\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><strong><u>insetter<\/u><\/strong><\/a>.<\/p>\n<pre><code class=\"kotlin\">toolbar.applyInsetter {    type(navigationBars = true, statusBars = true) {        padding(horizontal = true)        margin(top =<\/code><\/pre>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-338424","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/338424","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=338424"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/338424\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=338424"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=338424"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=338424"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}