{"id":392144,"date":"2024-06-29T10:14:46","date_gmt":"2024-06-29T10:14:46","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=392144"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=392144","title":{"rendered":"<span>\u041a\u0430\u043a \u0432\u043d\u0435\u0434\u0440\u0438\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u0441\u0432\u043e\u0451 \u0432 CoordinatorLayout \u0438 \u043d\u0435 \u0443\u043c\u0435\u0440\u0435\u0442\u044c: \u043f\u0443\u0442\u044c Android-\u0441\u0430\u043c\u0443\u0440\u0430\u044f<\/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<p>\u041f\u0440\u0438\u0432\u0435\u0442! \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0410\u043d\u0434\u0440\u0435\u0439 \u0428\u043e\u043a\u043e\u043b\u043e\u0432, \u044f Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a KODE. <\/p>\n<p>\u041a \u043d\u0430\u043c \u043e\u0431\u0440\u0430\u0442\u0438\u043b\u0430\u0441\u044c \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f Forward Leasing \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0433\u043e\u0442\u043e\u0432\u043e\u043c\u0443 \u0434\u0438\u0437\u0430\u0439\u043d\u0443. \u041f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u043b \u0434\u0443\u0433\u0443, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e \u0437\u0430\u0434\u0443\u043c\u043a\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u043b\u0430 \u0441\u0436\u0438\u043c\u0430\u0442\u044c\u0441\u044f \u0432 \u043e\u0434\u043d\u0443 \u043b\u0438\u043d\u0438\u044e \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435. \u0417\u0430 \u043e\u0441\u043d\u043e\u0432\u0443 \u0440\u0435\u0448\u0438\u043b\u0438 \u0432\u0437\u044f\u0442\u044c CoordinatorLayout: \u0443 \u043d\u0430\u0441 \u0443\u0436\u0435 \u0431\u044b\u043b \u043f\u043e\u043b\u043e\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043e\u043f\u044b\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043d\u0438\u043c \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435. \u0415\u0449\u0451 \u0432 \u043d\u0430\u0448\u0435\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u0435 \u0447\u0430\u0441\u0442\u043e \u043b\u044e\u0431\u0438\u043b\u0438 \u0441\u043e\u0440\u0435\u0432\u043d\u043e\u0432\u0430\u0442\u044c\u0441\u044f, \u043a\u0430\u043a\u043e\u0439 \u0436\u0435 Layout \u043b\u0443\u0447\u0448\u0435 \u2014\u00a0CoordinatorLayout \u0438\u043b\u0438 MotionLayout, \u0438 \u0438\u043c\u0435\u043d\u043d\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u043d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0443\u0437\u043d\u0430\u0442\u044c. <\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u044f \u043f\u043e\u043d\u0438\u043c\u0430\u044e, \u0447\u0442\u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0431\u044b\u043b\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u0430 \u043d\u0430 \u0440\u043e\u0432\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u2014\u00a0\u043d\u043e \u044d\u0442\u043e \u044f \u0432\u044b\u044f\u0441\u043d\u0438\u043b \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u044b. <strong>\u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u0441 \u043a\u0430\u043a\u0438\u043c\u0438 7 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438 CoordinatorLayout \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0438 <\/strong><a href=\"#motion\" rel=\"noopener noreferrer nofollow\"><strong>\u043a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0437\u0430 \u043f\u043e\u043b\u0447\u0430\u0441\u0430<\/strong><\/a><strong> \u0442\u043e, \u0441 \u0447\u0435\u043c \u044f \u043f\u0440\u043e\u0432\u043e\u0437\u0438\u043b\u0441\u044f \u0441\u0443\u0442\u043a\u0438.<\/strong><\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/ebe\/380\/b3d\/ebe380b3d9686ce3117fd1b1bda873f4.jpg\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ebe\/380\/b3d\/ebe380b3d9686ce3117fd1b1bda873f4.jpg\" data-blurred=\"true\"\/><figcaption><\/figcaption><\/figure>\n<h2>\u0417\u0430\u0434\u0430\u0447\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h2>\n<p>\u041c\u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c AppBarLayout \u0441 \u0434\u0443\u0433\u043e\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u0441\u044f \u0432 \u043e\u0434\u043d\u0443 \u043b\u0438\u043d\u0438\u044e. \u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0432 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0443\u044e Activity \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f Forward. \u041a\u043e\u0440\u043d\u0435\u0432\u044b\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0434\u043b\u044f \u0433\u043b\u0430\u0432\u043d\u043e\u0439 Activity \u0431\u044b\u043b \u0432\u044b\u0431\u0440\u0430\u043d CoordinatorLayout \u2014\u00a0\u044d\u0442\u043e ViewGroup, \u0446\u0435\u043b\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0446\u0438\u044f \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0445 view-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/91b\/e42\/01b\/91be4201b450efb82ab1b71af3385e57.png\" alt=\"\u0413\u043b\u0430\u0432\u043d\u044b\u0439 \u044d\u043a\u0440\u0430\u043d \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f Forward Leasing\" title=\"\u0413\u043b\u0430\u0432\u043d\u044b\u0439 \u044d\u043a\u0440\u0430\u043d \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f Forward Leasing\" width=\"3840\" height=\"2160\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/91b\/e42\/01b\/91be4201b450efb82ab1b71af3385e57.png\"\/><figcaption>\u0413\u043b\u0430\u0432\u043d\u044b\u0439 \u044d\u043a\u0440\u0430\u043d \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f Forward Leasing<\/figcaption><\/figure>\n<p>\u041f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0435 CoordinatorLayout \u0438 \u0441 \u043a\u0430\u043a\u0438\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u0432 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f, \u043f\u043e\u043a\u0430\u0436\u0443, \u043a\u0430\u043a \u0432 \u0438\u0442\u043e\u0433\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c\u0441\u044f:<\/p>\n<details class=\"spoiler\">\n<summary>\u0424\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a60\/32b\/adb\/a6032badbdec154953d6c340cefafcb8.gif\" width=\"466\" height=\"1000\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a60\/32b\/adb\/a6032badbdec154953d6c340cefafcb8.gif\"\/><figcaption><\/figcaption><\/figure>\n<\/div>\n<\/details>\n<h2>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 CoordinatorLayout \u0441 Default behavior<\/h2>\n<p>CoordinatorLayout \u2014 \u044d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u043e\u0431\u044b\u0447\u043d\u044b\u0439 FrameLayout. \u041d\u0435\u0442, \u043f\u0440\u043e\u0441\u0442\u0438\u0442\u0435: \u043a\u0430\u043a \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043e \u0432 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438, \u044d\u0442\u043e super-powered FrameLayout!<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/549\/7fe\/68e\/5497fe68e0ffb932bc53e33a6a80d783.jpg\" alt=\"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0444\u0438\u0448\u043a\u0430 CoordinatorLayout \u2014 \u0441\u0432\u043e\u0438 Default behaviors\" title=\"\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0444\u0438\u0448\u043a\u0430 CoordinatorLayout \u2014 \u0441\u0432\u043e\u0438 Default behaviors\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/549\/7fe\/68e\/5497fe68e0ffb932bc53e33a6a80d783.jpg\" data-blurred=\"true\"\/><figcaption>\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0444\u0438\u0448\u043a\u0430 CoordinatorLayout \u2014 \u0441\u0432\u043e\u0438 Default behaviors<\/figcaption><\/figure>\n<p>\u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Behaviors \u043c\u043e\u0436\u043d\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0439 View. \u0414\u0443\u043c\u0430\u044e, \u0432\u0441\u0435 \u0432\u0438\u0434\u0435\u043b\u0438 \u044d\u0442\u0438 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043a\u043e\u0433\u0434\u0430 \u0441\u043d\u0438\u0437\u0443 \u0432\u044b\u043f\u043b\u044b\u0432\u0430\u0435\u0442 Snackbar, \u0430 \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u043d\u0438\u043c \u0432\u0432\u0435\u0440\u0445 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u0442\u0441\u044f\u00a0FAB (Floating Action Button). \u0412\u0441\u0451 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043e\u0442\u043b\u0438\u0447\u043d\u043e. \u041d\u043e \u0438\u043c\u0435\u043d\u043d\u043e Behaviors \u0438 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u044f\u0442 \u043c\u0435\u043d\u044f \u043f\u043e\u0437\u0434\u043d\u0435\u0435, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u043e\u0433\u0434\u0430 \u0442\u0435\u0431\u0435 \u043d\u0443\u0436\u043d\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0435 \u0432\u0441\u0451 \u043f\u043e \u0434\u0435\u0444\u043e\u043b\u0442\u0443, \u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u0441\u0432\u043e\u0451, \u0442\u043e \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u044e\u0442 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438. \u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0430\u043a\u043e\u0439 \u0434\u0443\u0433\u0438 \u0431\u044b\u043b \u0441\u043e\u0437\u0434\u0430\u043d \u043a\u043b\u0430\u0441\u0441 RoundedAppBarLayout, \u043d\u0430\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 AppBarLayout.<\/p>\n<h2>\u0427\u0442\u043e \u0434\u0430\u043d\u043e \u0432 RoundedAppBarLayout<\/h2>\n<ul>\n<li>\n<p>Toolbar \u2014\u00a0\u0441\u0430\u043c\u0430\u044f \u043e\u0431\u044b\u0447\u043d\u0430\u044f \u0432\u044c\u044e \u0442\u0443\u043b\u0431\u0430\u0440\u0430 \u0438\u0437 Android.<\/p>\n<\/li>\n<li>\n<p>ContentView, \u0433\u0434\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0432\u0441\u0451, \u0447\u0442\u043e \u0443\u0433\u043e\u0434\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>Arc \u2014 \u043d\u0430\u0448\u0430 \u0434\u0443\u0433\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/879\/68c\/066\/87968c066bf7cf3d6eb061716f38446f.jpg\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/879\/68c\/066\/87968c066bf7cf3d6eb061716f38446f.jpg\" data-blurred=\"true\"\/><figcaption><\/figcaption><\/figure>\n<h2>\u0421 \u043a\u0430\u043a\u0438\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0438 \u043a\u0430\u043a \u0438\u0445 \u0440\u0435\u0448\u0430\u043b<\/h2>\n<h3>\u21161. \u0421\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433<\/h3>\n<p>\u0423 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c RoundedAppBarLayout, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f Toolbar, ContentView \u0438 Arc. \u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0432\u044c\u044e \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c scrollFlags, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0442 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432\u044c\u044e \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435:\u00a0 scroll, snap, expandAlways, expandAlwaysCollapsed, exitUntilCollapsed. \u041a\u0430\u043a \u043e\u043d\u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442? AppBarLayout \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e \u0432\u0441\u0435\u043c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u0432\u044c\u044e \u2014\u00a0child\u2019\u0430\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0443 \u043d\u0435\u0433\u043e \u0435\u0441\u0442\u044c, \u0438 \u0441\u043c\u043e\u0442\u0440\u0438\u0442: \u0435\u0441\u043b\u0438 \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u0435\u043d scroll, \u0442\u043e\u0433\u0434\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0442\u043e, \u0447\u0442\u043e \u044d\u0442\u0430 \u0432\u044c\u044e\u0448\u043a\u0430 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u0441\u044f, \u0435\u0441\u043b\u0438 noScroll \u2014\u00a0return.\u00a0<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043d\u0430 Toolbar \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043e scroll, \u0442\u043e \u043e\u043d \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u0438\u0442\u0441\u044f, \u0430 \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043d\u0438\u0436\u0435 \u043d\u0435\u0433\u043e, \u2014 \u043d\u0435\u0442. \u0421\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0435\u0441\u043b\u0438 \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c scroll \u043d\u0430 Toolbar \u0438 ContentView, \u0442\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u0431\u0443\u0434\u0443\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u043d\u0438. \u041d\u0430\u043c \u0436\u0435 \u043d\u0443\u0436\u043d\u043e \u0440\u043e\u0432\u043d\u043e \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442: \u0447\u0442\u043e\u0431\u044b \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043b\u0430\u0441\u044c \u0434\u0443\u0433\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0451, \u0447\u0442\u043e \u0432\u044b\u0448\u0435 \u043d\u0435\u0451.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p><strong>CollapsingToolbar.<\/strong> \u041e\u043d \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c Toolbar \u043d\u0430\u0432\u0435\u0440\u0445\u0443 \u0438 \u0434\u0430\u0451\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c ContentView, Arc \u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043d\u0438\u0436\u0435. \u042d\u0442\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0445\u043e\u0440\u043e\u0448\u043e, \u0437\u0430 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u0442\u043e\u0433\u043e, \u0447\u0442\u043e Toolbar \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c CollapsingToolbar.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">&lt;?xml version=\"1.0\" encoding=\"utf-8\"?> &lt;merge xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"     xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"     xmlns:tools=\"http:\/\/schemas.android.com\/tools\"     android:layout_width=\"match_parent\"     android:layout_height=\"wrap_content\"     android:background=\"@color\/transparent\"     tools:parentTag=\"com.google.android.material.appbar.AppBarLayout\">       &lt;com.google.android.material.appbar.CollapsingToolbarLayout         android:id=\"@+id\/collapsingToolbar\"         android:layout_width=\"match_parent\"         android:layout_height=\"wrap_content\"         android:background=\"@color\/transparent\"         app:layout_scrollFlags=\"scroll|snap|exitUntilCollapsed\">       &lt;\/com.google.android.material.appbar.CollapsingToolbarLayout> &lt;\/merge><\/code><\/pre>\n<\/div>\n<\/details>\n<h3>\u21162. \u041f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0435 \u0437\u043e\u043d\u044b \u0432 Arc \u0438 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0430 \u0434\u0443\u0433\u0438<\/h3>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443 \u0432 AppBarLayout, \u0432 \u0431\u043b\u043e\u043a\u0435 Arc \u0434\u043e\u043b\u0436\u043d\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0437\u043e\u043d\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c\u0438. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u043c AppBarLayout transparent, \u043a\u0430\u043a \u0438 ContentView: \u043c\u044b \u043d\u0435 \u0437\u043d\u0430\u0435\u043c, \u043a\u0430\u043a\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430 \u043e\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c.<\/p>\n<p>\u041d\u043e \u0435\u0441\u043b\u0438 \u043c\u044b \u043e\u0441\u0442\u0430\u0432\u0438\u043c CollapsingToolbar, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u043b\u043e\u0436\u0435\u043d \u0432 AppBar, \u0431\u0435\u0437 \u0446\u0432\u0435\u0442\u0430, \u043a\u0430\u043a \u0438 \u043d\u0430\u0448 ContentView, \u0442\u043e \u043d\u0430 \u0432\u044b\u0445\u043e\u0434\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u041f\u043e\u043a\u0440\u0430\u0441\u0438\u0442\u044c CollapsingToolbar \u0432 \u043a\u0430\u043a\u043e\u0439-\u0442\u043e \u0446\u0432\u0435\u0442. \u041c\u044b \u0432\u044b\u0431\u0440\u0430\u043b\u0438 \u0444\u0438\u043e\u043b\u0435\u0442\u043e\u0432\u044b\u0439, \u0442\u0430\u043a \u043a\u0430\u043a \u044d\u0442\u043e \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0446\u0432\u0435\u0442 \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u042d\u0442\u0438\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u043c\u044b \u0442\u0430\u043a\u0436\u0435 \u0443\u043b\u0443\u0447\u0448\u0438\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e: \u0442\u0435\u043f\u0435\u0440\u044c \u043f\u0440\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0435 \u0431\u043b\u043e\u043a \u043c\u043e\u0436\u0435\u0442 \u0437\u0430\u0442\u0435\u043c\u043d\u044f\u0442\u044c\u0441\u044f, \u0438 \u044d\u0442\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u043a\u0440\u0430\u0441\u0438\u0432\u043e.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u044d\u0442\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/66c\/19e\/68d\/66c19e68dfdb82a575abb96f7da36f09.gif\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/66c\/19e\/68d\/66c19e68dfdb82a575abb96f7da36f09.gif\"\/><figcaption><\/figcaption><\/figure>\n<\/div>\n<\/details>\n<p><strong>\u041e\u0441\u0442\u0430\u0451\u0442\u0441\u044f \u0432\u043e\u043f\u0440\u043e\u0441 \u0441 \u0434\u0443\u0433\u043e\u0439.<\/strong> \u041c\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0435\u0451 \u0432 \u0432 CollapsingToolbar, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u043d \u0438\u043c\u0435\u0435\u0442 \u0441\u0432\u043e\u0439 \u0446\u0432\u0435\u0442, \u0430 Arc \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c transparent. \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0441\u044f, \u043c\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0434\u0443\u0433\u0443 \u0432 AppBarLayout, \u043d\u043e \u043e\u043d, \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u043c\u043d\u0438\u043c, \u043d\u0435 \u0434\u0430\u0451\u0442 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u044c \u0432\u0441\u0451, \u0447\u0442\u043e \u0432\u043d\u0438\u0437\u0443.\u00a0<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0420\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u043a\u0430\u043d\u0432\u0430\u0441\u0435 \u0438 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u043a\u0440\u043e\u043b\u043b\u0430 \u043f\u0440\u043e\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c, \u043a\u0430\u043a \u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443.\u00a0<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/60c\/eeb\/05b\/60ceeb05b2a81be21e9796f296c59cc0.jpg\" alt=\"\u0421\u043b\u0435\u0432\u0430 \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e, \u043a\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 Layout'\u0430\" title=\"\u0421\u043b\u0435\u0432\u0430 \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e, \u043a\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 Layout'\u0430\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/60c\/eeb\/05b\/60ceeb05b2a81be21e9796f296c59cc0.jpg\" data-blurred=\"true\"\/><figcaption>\u0421\u043b\u0435\u0432\u0430 \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e, \u043a\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 Layout&#8217;\u0430<\/figcaption><\/figure>\n<p>\u042d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 CollapsingToolbar. \u041c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0441\u0440\u0430\u0437\u0443 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u044e\u0434\u0430 Toolbar, \u043d\u043e \u0442\u0430\u043a \u043a\u0430\u043a \u043d\u0443\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u0431\u044b\u043b \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0432 CollapsingToolbarLayout, \u0435\u0433\u043e \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e. \u0422\u043e \u0435\u0441\u0442\u044c \u044f \u0434\u0435\u043b\u0430\u044e Inflate Layout\u2019\u0430 \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0432 \u043a\u043e\u043d\u0435\u0446 CollapsingToolbarLayout.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">private fun addContentView(){         if (childCount > 1) {             val contentChild = this.getChildAt(1)             removeView(contentChild)               val layoutParams = CollapsingToolbarLayout.LayoutParams(contentChild.layoutParams)             with(contentChild) {                 layoutParams.setMargins(                     marginStart,                     marginTop + toolbarHeight,                     marginEnd,                     marginBottom                 )             }             contentChild.setBackgroundColor(context.getColor(R.color.accent2))             contentChild.layoutParams = layoutParams               collapsingToolbar.addView(contentChild)         }     }       override fun onFinishInflate() {         super.onFinishInflate()         addContentView()           val toolbar = LayoutInflater.from(context)             .inflate(R.layout.toolbar_default, collapsingToolbar, false)         removeView(toolbar)         collapsingToolbar.addView(toolbar)     }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0441\u044f \u0442\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 \u043a\u043b\u0430\u0441\u0441, \u0433\u0434\u0435 \u0435\u0441\u0442\u044c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b, title, \u0433\u0434\u0435 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c \u0438\u043a\u043e\u043d\u043a\u0443 \u0434\u043b\u044f Toolbar, \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c ContentView, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 \u0441\u0430\u043c\u043e\u043c \u043d\u0430\u0448\u0435\u043c RoundedAppBarLayout, \u0438 \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/8e5\/588\/54f\/8e558854fd824b4b50dde7c76f5dab47.jpeg\" alt=\"\u0414\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b\" title=\"\u0414\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8e5\/588\/54f\/8e558854fd824b4b50dde7c76f5dab47.jpeg\" data-blurred=\"true\"\/><figcaption>\u0414\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b<\/figcaption><\/figure>\n<h3>\u21163. \u041f\u0443\u0441\u0442\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u043e\u0441\u043b\u0435 ContentView<\/h3>\n<p>\u0421 \u0447\u0435\u043c \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0434\u0430\u043b\u044c\u0448\u0435. \u041f\u043e\u0441\u043b\u0435 Toolbar \u0438 ContentView \u0443 \u043d\u0430\u0441 \u043d\u0435\u0442 \u043d\u0438\u043a\u0430\u043a\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430. \u041f\u043e \u0438\u0434\u0435\u0435, \u0442\u0443\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432\u044c\u044e\u0448\u043a\u0443, \u043d\u043e \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u043d\u0435\u0439 \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435 \u043f\u043e\u044f\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0431\u044b \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430. \u042f \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u043e\u0436\u0438\u0434\u0430\u043b \u0442\u0430\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 AppBarLayout. \u0422\u0430\u043a\u0436\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e appbarBottom, \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443: \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e \u043d\u0438\u0436\u043d\u044e\u044e \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0443 ContentView \u0438 \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u044e AppBarLayout \u0434\u043e \u043a\u043e\u043d\u0446\u0430 \u0431\u043b\u043e\u043a\u0430 Arc. \u0422\u0430\u043a \u043d\u0430\u043c \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u043e\u0431\u043d\u0435\u0435 \u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c. (\u0421\u043f\u043e\u0439\u043b\u0435\u0440: \u044d\u0442\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0432 \u0438\u0442\u043e\u0433\u0435 \u0441\u043e \u043c\u043d\u043e\u0439 \u0441\u044b\u0433\u0440\u0430\u0435\u0442 \u0437\u043b\u0443\u044e \u0448\u0443\u0442\u043a\u0443.)<\/p>\n<details class=\"spoiler\">\n<summary>\u0420\u0430\u0441\u0448\u0438\u0440\u044f\u044e AppBarLayout<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : AppBarLayout(context, attrs, defStyleAttr) {       init {         LayoutInflater.from(context).inflate(R.layout.appbar_rounded_default, this, true)         initView()     }       private fun initView() {         this.post {             layoutParams = CoordinatorLayout.LayoutParams(width, height + arcHeight)             appbarBottom = height.toFloat()             appbarHalfWidth = width \/ 2f         }     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e ContentChild \u0438 Toolbar \u0434\u043b\u044f \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">    override fun onFinishInflate() {         super.onFinishInflate()         if (childCount > 1) {             val contentChild = this.getChildAt(1)             removeView(contentChild)               val layoutParams = CollapsingToolbarLayout.LayoutParams(contentChild.layoutParams)             with(contentChild) {                 layoutParams.setMargins(                     marginStart,                     marginTop + toolbarHeight,                     marginEnd,                     marginBottom                 )             }             contentChild.setBackgroundColor(context.getColor(R.color.accent2))             contentChild.layoutParams = layoutParams               collapsingToolbar.addView(contentChild)         }<\/code><\/pre>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0420\u0438\u0441\u0443\u044e \u0434\u0443\u0433\u0443<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">private fun drawArc(canvas: Canvas) {         val scale = bottom \/ height.toFloat()           arcPath.apply {             reset()             moveTo(0f, appbarBottom)             quadTo(                 appbarHalfWidth,                 \/\/divide by 2 due to arc drawing logic                 (appbarBottom + (arcHeight * 2)) * scale,                 width.toFloat(),                 appbarBottom             )         }         canvas.drawPath(arcPath, arcPaint).apply {             invalidate()         }     }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u041d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u0447\u0438\u0442\u0430\u0442\u044c \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u043a\u043e\u0433\u0434\u0430 AppBarLayout \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0437\u0430\u0441\u043a\u0440\u043e\u043b\u043b\u0435\u043d \u0438 \u043d\u0435\u0434\u043e\u0441\u043a\u0440\u043e\u043b\u0435\u043d. \u0422\u043e \u0435\u0441\u0442\u044c scale = 1 \u2014 \u044d\u0442\u043e AppBarLayout \u0440\u0430\u0441\u043a\u0440\u044b\u0442 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e, \u0430 scale = 0 \u2014 \u0441\u0445\u043b\u043e\u043f\u043d\u0443\u0442. \u0418 \u0440\u0438\u0441\u0443\u044e \u0441\u0430\u043c\u0443 \u0434\u0443\u0433\u0443. \u042f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0437\u0434\u0435\u0441\u044c \u0441 \u043e\u0447\u0435\u043d\u044c \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0439 \u043b\u043e\u0433\u0438\u043a\u043e\u0439: \u0435\u0441\u043b\u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u043e y-\u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0435, \u0447\u0442\u043e \u043a\u0440\u0430\u0439\u043d\u044f\u044f \u0442\u043e\u0447\u043a\u0430 \u0434\u0443\u0433\u0438 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c \u043d\u0430 48 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445, \u0442\u043e \u0432\u0435\u0440\u0448\u0438\u043d\u0430 \u044d\u0442\u043e\u0439 \u0442\u043e\u0447\u043a\u0438 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430 24 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445 \u2014 \u0432 \u0434\u0432\u0430 \u0440\u0430\u0437\u0430 \u043c\u0435\u043d\u044c\u0448\u0435. \u0412 \u0438\u0442\u043e\u0433\u0435 \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u043c\u043d\u043e\u0436\u0430\u0442\u044c \u043d\u0430 \u0434\u0432\u0430 \u2014 \u0440\u0435\u0448\u0438\u043b \u044f, \u043d\u0435 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0432\u0448\u0438\u0441\u044c \u0441 \u043f\u0440\u0438\u0447\u0438\u043d\u043e\u0439.<\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441, \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u044c\u0438, \u044f \u043f\u043e\u043d\u0438\u043c\u0430\u044e, \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0438\u0441\u0443\u0435\u0442 \u043d\u0435 \u0434\u0443\u0433\u0443, \u0430 \u043a\u0440\u0438\u0432\u0443\u044e \u0411\u0435\u0437\u044c\u0435. \u0418 \u043e\u043d\u0430 \u0441\u0442\u0440\u043e\u0438\u0442\u0441\u044f \u043d\u0435 \u0447\u0435\u0440\u0435\u0437 \u043a\u0440\u0430\u0439\u043d\u044e\u044e \u0442\u043e\u0447\u043a\u0443, \u0430 \u043f\u043e\u0441\u0435\u0440\u0435\u0434\u0438\u043d\u0435. \u0412\u043c\u0435\u0441\u0442\u043e Path \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Arc. \u0420\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0442\u043e\u0439 \u0436\u0435, \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u0435\u0437 \u0434\u043e\u043c\u043d\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 2.\u00a0<\/p>\n<details class=\"spoiler\">\n<summary>\u0412\u0435\u0441\u044c \u043a\u043e\u0434 \u043a\u043b\u0430\u0441\u0441\u0430 AppBarLayout<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : AppBarLayout(context, attrs, defStyleAttr) {       private var appbarBottom = 0f     private var appbarHalfWidth = 0f       \/\/region toolbarArc     private val arcHeight = DimensUtils.convertDpToPixel(48f, context)     private val toolbarHeight = DimensUtils.convertDpToPixel(56f, context)       private val arcPaint = Paint().apply {         color = context.getColor(R.color.accent2)         style = Paint.Style.FILL         isAntiAlias = true     }     private val arcPath = Path()     \/\/endregion       init {         LayoutInflater.from(context).inflate(R.layout.appbar_default, this, true)         initView()     }       override fun onDraw(canvas: Canvas) {         super.onDraw(canvas)         drawArc(canvas)     }       override fun onFinishInflate() {         super.onFinishInflate()         if (childCount > 1) {             val contentChild = this.getChildAt(1)             removeView(contentChild)               val layoutParams = CollapsingToolbarLayout.LayoutParams(contentChild.layoutParams)             with(contentChild) {                 layoutParams.setMargins(                     marginStart,                     marginTop + toolbarHeight,                     marginEnd,                     marginBottom                 )             }             contentChild.setBackgroundColor(context.getColor(R.color.accent2))             contentChild.layoutParams = layoutParams               collapsingToolbar.addView(contentChild)         }           val toolbar = LayoutInflater.from(context)             .inflate(R.layout.toolbar_default, collapsingToolbar, false)         removeView(toolbar)         collapsingToolbar.addView(toolbar)     }       private fun initView() {         setBackgroundColor(context.getColor(R.color.transparent))         outlineProvider = null           this.post {             layoutParams = CoordinatorLayout.LayoutParams(width, height + arcHeight)             appbarBottom = height.toFloat()             appbarHalfWidth = width \/ 2f         }     }       private fun drawArc(canvas: Canvas) {         val scale = bottom \/ height.toFloat()           arcPath.apply {             reset()             moveTo(0f, appbarBottom)             quadTo(                 appbarHalfWidth,                 \/\/divide by 2 due to arc drawing logic                 (appbarBottom + (arcHeight * 2)) * scale,                 width.toFloat(),                 appbarBottom             )         }         canvas.drawPath(arcPath, arcPaint).apply {             invalidate()         }     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<h3>\u21164. \u0411\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430 \u043f\u0440\u0438 \u043a\u043e\u043b\u043b\u0430\u043f\u0441\u0435<\/h3>\n<p>\u0422\u043e\u043b\u044c\u043a\u043e \u044f \u043f\u043e\u0440\u0430\u0434\u043e\u0432\u0430\u043b\u0441\u044f, \u0447\u0442\u043e \u0432\u0441\u0451 \u0445\u043e\u0440\u043e\u0448\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442, \u043a\u0430\u043a \u0432\u043d\u0435\u0437\u0430\u043f\u043d\u043e \u043e\u0431\u043d\u0430\u0440\u0443\u0436\u0438\u043b\u0441\u044f \u043a\u043e\u0441\u0442\u044b\u043b\u044c \u0432 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u043c \u043a\u043e\u0434\u0435. \u041a\u043e\u0433\u0434\u0430 \u0442\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u0448\u044c \u044d\u043a\u0440\u0430\u043d, \u0442\u043e \u0431\u0443\u043a\u0432\u0430\u043b\u044c\u043d\u043e \u0437\u0430 \u043f\u0430\u0440\u0443 \u043f\u0438\u043a\u0441\u0435\u043b\u0435\u0439 \u0434\u043e \u043a\u043e\u043d\u0446\u0430 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0431\u0435\u043b\u044b\u0439 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a.<\/p>\n<p>\u041d\u0430\u0447\u0438\u043d\u0430\u0435\u0448\u044c \u0440\u0430\u0437\u0431\u0438\u0440\u0430\u0442\u044c \u2014 \u043f\u043e\u043d\u0438\u043c\u0430\u0435\u0448\u044c, \u0447\u0442\u043e \u044d\u0442\u043e \u043f\u0440\u043e\u0434\u0435\u043b\u043a\u0438 Behavior c AppBarLayout. \u0422\u0430\u043a \u043a\u0430\u043a \u044f \u043e\u0431\u043d\u043e\u0432\u0438\u043b \u0448\u0438\u0440\u0438\u043d\u0443 \u0432\u0441\u0435\u0433\u043e AppBarLayout (\u0442\u0430\u043c \u0442\u0435\u043f\u0435\u0440\u044c AppBarLayout \u0438 \u0448\u0438\u0440\u0438\u043d\u0430 \u043d\u0430\u0448\u0435\u0439 \u0434\u0443\u0433\u0438), \u0442\u043e \u043a\u043e\u0433\u0434\u0430 \u043e\u043d \u043a\u043e\u043b\u043b\u0430\u043f\u0441\u0438\u0442\u0441\u044f, Layout \u0441\u043c\u043e\u0442\u0440\u0438\u0442, \u0447\u0442\u043e AppBarLayout \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u043f\u043e \u0432\u044b\u0441\u043e\u0442\u0435 \u043a\u0430\u043a Toolbar \u0438 \u0434\u0443\u0433\u0430, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b\u0434\u0435\u043b\u044f\u0435\u0442 \u043c\u0435\u0441\u0442\u043e \u0438\u043c\u0435\u043d\u043d\u043e \u043f\u043e\u0434 \u0442\u0430\u043a\u043e\u0439 \u0440\u0430\u0437\u043c\u0435\u0440.\u00a0<\/p>\n<p>\u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u044f \u0434\u0443\u043c\u0430\u043b, \u0447\u0442\u043e \u0442\u0430\u043a \u043a\u0430\u043a AppBarLayout \u0438\u043c\u0435\u0435\u0442 transparent background, \u0442\u043e \u043d\u0438\u043a\u0430\u043a\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442, \u043d\u043e \u043a\u043e\u0433\u0434\u0430 AppBarLayout \u043a\u043e\u043b\u043b\u0430\u043f\u0441\u0438\u0442\u0441\u044f, \u0446\u0432\u0435\u0442 background \u0443\u0436\u0435 \u043d\u0435 \u0438\u0433\u0440\u0430\u0435\u0442 \u0440\u043e\u043b\u0438.\u00a0<\/p>\n<p>\u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u044f \u043d\u0435 \u043f\u043e\u043d\u044f\u043b, \u043f\u043e\u0447\u0435\u043c\u0443 \u0432 AppBarLayout \u0441\u0432\u043e\u0431\u043e\u0434\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043e\u0441\u0442\u0430\u0451\u0442\u0441\u044f \u0431\u0435\u043b\u044b\u043c, \u0430 \u043d\u0435 transparent. \u0412 \u043a\u043e\u0434\u0435 AppBarLayout \u044f \u043d\u0435 \u0441\u043c\u043e\u0433 \u043d\u0430\u0439\u0442\u0438 \u044d\u0442\u043e\u0433\u043e. \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u044d\u0442\u043e \u0443\u0436\u0435 \u0442\u043e\u043d\u043a\u043e\u0441\u0442\u0438 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 CoordinatorLayout.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u042f \u0434\u043e\u043b\u0433\u043e \u0434\u0443\u043c\u0430\u043b, \u043a\u0430\u043a \u044d\u0442\u043e \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c, \u0438 \u0440\u0435\u0448\u0438\u043b \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u043c\u0435\u0442\u043e\u0434 \u00ab\u0438\u043d\u043a\u043e\u0441\u0442\u044b\u043b\u044f\u0446\u0438\u0438\u00bb. \u041e\u043d \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u044f \u043f\u0438\u0448\u0443 \u0441\u0432\u043e\u0439 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 Behavior, \u0438 \u043a\u043e\u0433\u0434\u0430 \u043e\u043d \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 AppBarLayout, \u0442\u043e \u044f \u0432\u044b\u0437\u044b\u0432\u0430\u044e \u043c\u0435\u0442\u043e\u0434 setRoundedAppBarBehavior. \u041f\u043e \u0441\u0443\u0442\u0438 \u044f \u043f\u0440\u043e\u0441\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 margin, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043c\u043e\u0433 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u0432\u0435\u0440\u0445 AppBarLayout.\u00a0<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarBehavior(context: Context, attrs: AttributeSet) :     AppBarLayout.ScrollingViewBehavior(context, attrs) {       private var isInstalled = false       override fun layoutDependsOn(         parent: CoordinatorLayout,         child: View,         dependency: View     ): Boolean {         if (!isInstalled &amp;&amp; dependency is BaseAppBarLayout) {             isInstalled = true             child.setRoundedAppBarBehavior()         }         return super.layoutDependsOn(parent, child, dependency)     } }   fun View.setRoundedAppBarBehavior() {     if (this is ViewGroup) {         val arcHeight = resources.getDimensionPixelSize(R.dimen.toolbar_arc_height)           this.post {             clipToPadding = false               val lp = CoordinatorLayout.LayoutParams(layoutParams)             lp.behavior = AppBarLayout.ScrollingViewBehavior()             lp.setMargins(marginStart, marginTop - arcHeight, marginEnd, marginBottom)             layoutParams = lp         }     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u0412\u0441\u0451 \u0441\u043d\u043e\u0432\u0430 \u0437\u0430\u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e, \u0443\u0440\u0430!<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0438 \u0440\u0435\u0448\u0435\u043d\u0438\u0435<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ba5\/e29\/ed9\/ba5e29ed9ba0ac13a5ab6740e579c6d5.gif\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ba5\/e29\/ed9\/ba5e29ed9ba0ac13a5ab6740e579c6d5.gif\"\/><figcaption><\/figcaption><\/figure>\n<\/div>\n<\/details>\n<h3>\u21165. AppBar \u0431\u0435\u0437 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u043d\u0435 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u0441\u044f<\/h3>\n<p>\u041e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0447\u0442\u043e \u043a\u0430\u0436\u0434\u043e\u0433\u043e AppBarLayout \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u0432\u043d\u0443\u0442\u0440\u0438. \u0418 AppBarLayout \u0434\u0443\u043c\u0430\u0435\u0442: \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 \u043c\u0435\u043d\u044f \u043d\u0438\u043a\u0430\u043a\u043e\u0433\u043e \u043d\u0435\u0442, \u0442\u0430\u043a \u0437\u0430\u0447\u0435\u043c \u043c\u043d\u0435 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u044c\u0441\u044f?<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0420\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0431\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 \u043d\u0430 \u0434\u0432\u0430 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0445: RoundedAppBarLayour \u0438 SimpleRoundedAppBarLayout. \u0412 \u043f\u0435\u0440\u0432\u044b\u0439 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442, \u0430 \u0432\u0442\u043e\u0440\u043e\u0439 \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0431\u0435\u0437 \u043d\u0435\u0433\u043e.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434 \u0431\u0430\u0437\u043e\u0432\u043e\u0433\u043e \u043a\u043b\u0430\u0441\u0441\u0430 AppBarLayout \u0438 2 \u043d\u0430\u0441\u043b\u0435\u0434\u0443\u0435\u043c\u044b\u0445 SimpleRoundedAppBarLayout \u0438 RoundedAppBarLayout<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">abstract class BaseAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : AppBarLayout(context, attrs, defStyleAttr) {       var title: String? = null         set(value) {             field = value             titleToolbar?.text = value ?: \"\"         }     var navigationIcon: Int? = null       var isEnableCollapsingBehaviour: Boolean = false       \/\/ The value from which the arc is drawn     protected var appbarBottom = 0f     protected var appbarHalfWidth = 0f       \/\/region toolbarArc     protected val arcHeight = context.resources.getDimensionPixelSize(R.dimen.toolbar_arc_height)     protected val toolbarHeight = context.resources.getDimensionPixelSize(R.dimen.toolbar_height)     val nonScrollableHeight = arcHeight + toolbarHeight       protected val arcPaint = Paint().apply {         color = context.getColor(R.color.accent2)         style = Paint.Style.FILL         isAntiAlias = true     }     protected val arcPath = Path()     \/\/endregion       var contentChild: View? = null       override fun onDraw(canvas: Canvas) {         super.onDraw(canvas)         drawArc(canvas)     }       fun updateToolbarTitleMargin(         marginStart: Int = 0,         marginTop: Int = 0,         marginEnd: Int = 0,         marginBottom: Int = 0     ) {         titleToolbar.layoutParams = Toolbar.LayoutParams(titleToolbar.layoutParams).apply {             setMargins(marginStart, marginTop, marginEnd, marginBottom)         }     }       protected fun initToolbar(toolbar: Toolbar) {         navigationIcon?.let {             toolbar.navigationIcon = ContextCompat.getDrawable(context, it)             toolbar.setNavigationOnClickListener {                 (context as? Activity)?.onBackPressed()             }         }           toolbar.findViewById&lt;TextView>(R.id.titleToolbar)?.let { textView ->             textView.text = title               if (navigationIcon != null) {                 textView.layoutParams = Toolbar.LayoutParams(textView.layoutParams).apply {                     setMargins(0, 0, 64.dp, 0)                 }             }         }     }       protected fun initAttrs(attrs: AttributeSet? = null, defStyleAttr: Int = 0, defStyle: Int = 0) {         context.withStyledAttributes(             attrs,             R.styleable.RoundedAppBarLayout,             defStyleAttr,             defStyle         ) {             val defValue = -1               title = getString(R.styleable.RoundedAppBarLayout_ral_title)             getResourceId(R.styleable.RoundedAppBarLayout_ral_navigate_icon, defValue).apply {                 if (this != defValue) navigationIcon = this             }             isEnableCollapsingBehaviour =                 getBoolean(R.styleable.RoundedAppBarLayout_ral_collapsing_behaviour, false)         }     }       protected open fun drawArc(canvas: Canvas) {         val scale = (bottom - nonScrollableHeight) \/ (height - nonScrollableHeight).toFloat()           contentChild?.alpha = max(0f, scale - (1 - scale))           if (isEnableCollapsingBehaviour) collapsingBehaviour(scale)           arcPath.apply {             reset()             moveTo(0f, appbarBottom)             quadTo(                 appbarHalfWidth,                 \/\/multiply by 2 due to arc drawing logic                 appbarBottom + (arcHeight * 2) * scale,                 width.toFloat(),                 appbarBottom             )         }         canvas.drawPath(arcPath, arcPaint).apply {             invalidate()         }     }       private fun collapsingBehaviour(scale: Float) {         titleToolbar?.alpha = 1 - scale         contentChild?.y = (toolbarHeight - arcHeight).toFloat().dp     } }   class SimpleRoundedAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : BaseAppBarLayout(context, attrs, defStyleAttr) {       init {         LayoutInflater.from(context).inflate(R.layout.appbar_rounded_simple, this, true)         initView()         initAttrs(attrs, defStyleAttr)     }       override fun onFinishInflate() {         super.onFinishInflate()           toolbar.setBackgroundColor(ContextCompat.getColor(context, R.color.accent2))         initToolbar(toolbar)     }       override fun drawArc(canvas: Canvas) {         val scale = (bottom - toolbarHeight) \/ (height - toolbarHeight).toFloat()         val startDrawingHeight = appbarBottom + arcHeight * (1 - scale)           arcPath.apply {             reset()             moveTo(0f, startDrawingHeight)             quadTo(                 appbarHalfWidth,                 \/\/multiply by 2 due to arc drawing logic                 appbarBottom + (arcHeight * 2) * scale,                 width.toFloat(),                 startDrawingHeight             )         }         canvas.drawPath(arcPath, arcPaint).apply {             invalidate()         }     }       private fun initView() {         setBackgroundColor(context.getColor(R.color.transparent))         backgroundTintMode = PorterDuff.Mode.OVERLAY         outlineProvider = null           this.post {             appbarBottom = height - arcHeight.toFloat()             appbarHalfWidth = width \/ 2f         }     } }   class RoundedAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : BaseAppBarLayout(context, attrs, defStyleAttr) {       private var isArcDrawn = false       init {         LayoutInflater.from(context).inflate(R.layout.appbar_rounded_default, this, true)         initView()         initAttrs(attrs, defStyleAttr)     }       override fun onFinishInflate() {         super.onFinishInflate()         if (childCount > 1) addContentView()           val toolbar = LayoutInflater.from(context)             .inflate(R.layout.toolbar_default, collapsingToolbar, false)         removeView(toolbar)         collapsingToolbar.addView(toolbar)           (toolbar as? Toolbar)?.let { initToolbar(it) }     }       private fun initView() {         setBackgroundColor(context.getColor(R.color.transparent))         backgroundTintMode = PorterDuff.Mode.OVERLAY         outlineProvider = null           this.post {             layoutParams = CoordinatorLayout.LayoutParams(width, height + arcHeight)             appbarBottom = height.toFloat()             appbarHalfWidth = width \/ 2f             isArcDrawn = true         }     }       private fun addContentView() {         val contentChild = this.getChildAt(1)         removeView(contentChild)           val layoutParams = CollapsingToolbarLayout.LayoutParams(contentChild.layoutParams)             layoutParams.setMargins(                 marginStart,                 marginTop + toolbarHeight,                 marginEnd,                 marginBottom             )           contentChild.setBackgroundColor(context.getColor(R.color.accent2))         contentChild.layoutParams = layoutParams         this.contentChild = contentChild           collapsingToolbar.addView(contentChild)     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u0422\u043e\u0442 Toolbar, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043d\u0435\u0442 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u0442\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0446\u0432\u0435\u0442\u043e\u043c. \u0414\u0435\u043b\u0430\u0435\u043c \u044d\u0442\u043e \u043f\u043e\u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u0442\u0435\u043f\u0435\u0440\u044c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0437\u0430\u0442\u0435\u043c\u043d\u0435\u043d\u0438\u044f, \u043a\u0430\u043a \u0431\u044b\u043b\u043e \u043d\u0430 \u0433\u0438\u0444\u043a\u0435 \u0432 \u043f\u0435\u0440\u0432\u043e\u043c \u043f\u0443\u043d\u043a\u0442\u0435 (\u0442\u0430\u043a \u043a\u0430\u043a \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u043a\u0440\u043e\u043c\u0435 Toolbar, \u043d\u0435\u0442), \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e \u0437\u0430\u0434\u0430\u0442\u044c \u0446\u0432\u0435\u0442, \u0438 \u0432\u0441\u0451 \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c. \u0417\u0434\u0435\u0441\u044c \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e, \u043a\u0430\u043a \u0432 \u0438\u0442\u043e\u0433\u0435 \u0431\u044b\u043b\u043e \u0441\u0434\u0435\u043b\u0430\u043d\u043e.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/7f7\/259\/6ab\/7f72596ab8dd6f160b9c40c5a1fc4c63.jpeg\" alt=\"\u0421\u0445\u0435\u043c\u0430 AppBar\" title=\"\u0421\u0445\u0435\u043c\u0430 AppBar\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7f7\/259\/6ab\/7f72596ab8dd6f160b9c40c5a1fc4c63.jpeg\" data-blurred=\"true\"\/><figcaption>\u0421\u0445\u0435\u043c\u0430 AppBar<\/figcaption><\/figure>\n<p>\u0417\u0434\u0435\u0441\u044c \u044f \u0443\u0436\u0435 \u043c\u043e\u0433 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c ArcView \u2014\u00a0\u0441\u0430\u043c\u0443 \u0432\u044c\u044e\u0448\u043a\u0443 \u0434\u0443\u0433\u0438 \u2014 \u0438 \u043d\u0435 \u0431\u0435\u0441\u043f\u043e\u043a\u043e\u0438\u0442\u044c\u0441\u044f \u0441 \u0442\u0435\u043c, \u0447\u0442\u043e \u0442\u0430\u043c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u0442\u0440\u0430\u043d\u0441\u043f\u0430\u0440\u0435\u043d\u0442\u043d\u043e\u0433\u043e \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u044f. \u0422\u0435\u043f\u0435\u0440\u044c CollapsingToolbar \u0431\u0443\u0434\u0435\u0442 transparent, Toolbar \u043e\u0441\u0442\u0430\u0451\u0442\u0441\u044f \u0441 \u0446\u0432\u0435\u0442\u043e\u043c, \u0430 AppBarLayout \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w780q1\/getpro\/habr\/upload_files\/087\/b70\/d5e\/087b70d5ed3a742423510ee3ef4197f3.jpg\" alt=\"\u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440 Layout'\u043e\u0432\" title=\"\u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440 Layout'\u043e\u0432\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/087\/b70\/d5e\/087b70d5ed3a742423510ee3ef4197f3.jpg\" data-blurred=\"true\"\/><figcaption>\u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440 Layout&#8217;\u043e\u0432<\/figcaption><\/figure>\n<p>\u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435, \u0447\u0442\u043e \u043d\u0430\u043c \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0432 \u043a\u043e\u0434\u0435, \u2014 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0432\u044b\u0441\u043e\u0442\u0443 \u0438 \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u0430\u0442\u044c \u0440\u0438\u0441\u043e\u0432\u0430\u043d\u0438\u0435 \u0434\u0443\u0433\u0438, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0442\u0430\u043a \u043a\u0430\u043a \u0442\u0430\u043c \u043d\u0435\u0442 Child, \u0442\u043e \u043d\u0435 \u043d\u0430\u0434\u043e \u043d\u0438\u0447\u0435\u0433\u043e \u0437\u0430\u0442\u0435\u043c\u043d\u044f\u0442\u044c.\u00a0<\/p>\n<details class=\"spoiler\">\n<summary>XML-\u043a\u043e\u0434 \u0434\u043b\u044f SimpleRoundedAppBarLayout \u0438 RoundedAppBarLayout<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"xml\">&lt;?xml version=\"1.0\" encoding=\"utf-8\"?> &lt;merge xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"     xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"     xmlns:tools=\"http:\/\/schemas.android.com\/tools\"     android:layout_width=\"match_parent\"     android:layout_height=\"wrap_content\"     android:background=\"@color\/transparent\"     android:orientation=\"vertical\"     tools:parentTag=\"com.google.android.material.appbar.AppBarLayout\">       &lt;com.google.android.material.appbar.CollapsingToolbarLayout         android:id=\"@+id\/collapsingToolbar\"         android:layout_width=\"match_parent\"         android:layout_height=\"wrap_content\"         android:background=\"@color\/transparent\"         app:layout_scrollFlags=\"scroll|snap|exitUntilCollapsed\">           &lt;View             android:id=\"@+id\/arcView\"             android:layout_width=\"match_parent\"             android:layout_height=\"48dp\"             android:layout_marginTop=\"56dp\"             android:background=\"@color\/transparent\" \/>           &lt;include             android:id=\"@+id\/toolbar\"             layout=\"@layout\/toolbar_default\"             android:layout_width=\"match_parent\"             android:layout_height=\"56dp\"             android:layout_gravity=\"top\"             app:layout_collapseMode=\"pin\" \/>       &lt;\/com.google.android.material.appbar.CollapsingToolbarLayout> &lt;\/merge>   &lt;?xml version=\"1.0\" encoding=\"utf-8\"?> &lt;merge xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"     xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"     xmlns:tools=\"http:\/\/schemas.android.com\/tools\"     android:layout_width=\"match_parent\"     android:layout_height=\"wrap_content\"     android:background=\"@color\/transparent\"     tools:parentTag=\"com.google.android.material.appbar.AppBarLayout\">       &lt;com.google.android.material.appbar.CollapsingToolbarLayout         android:id=\"@+id\/collapsingToolbar\"         android:layout_width=\"match_parent\"         android:layout_height=\"wrap_content\"         android:background=\"@color\/accent2\"         app:layout_scrollFlags=\"scroll|snap|exitUntilCollapsed\">       &lt;\/com.google.android.material.appbar.CollapsingToolbarLayout> &lt;\/merge><\/code><\/pre>\n<\/div>\n<\/details>\n<h3>\u21166. \u041f\u0440\u0438 \u0441\u043a\u0440\u044b\u0442\u0438\u0438 \u0438 \u043f\u043e\u043a\u0430\u0437\u0435 AppBarLayout \u0432 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430<\/h3>\n<p>\u0414\u0430\u043b\u0435\u0435 \u0443 \u043d\u0430\u0441 \u0432\u043e\u0437\u043d\u0438\u043a\u043b\u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u0441\u0442\u0432\u0438\u044f \u043c\u0435\u0442\u043e\u0434\u0430 \u00ab\u0438\u043d\u043a\u043e\u0441\u0442\u044b\u043b\u044f\u0446\u0438\u0438\u00bb \u043f\u0440\u0438 \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438 visibility.\u00a0<\/p>\n<p>\u0423 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c \u043e\u0434\u043d\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u0438 \u043d\u0430 \u043d\u0435\u0439 \u043c\u043d\u043e\u0433\u043e \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u043e\u0432. \u0421\u0432\u0435\u0440\u0445\u0443 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f RoundedAppBarLayout, \u0430 \u0432\u043d\u0438\u0437\u0443 \u2014\u00a0\u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 \u0434\u043b\u044f \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u043e\u0432. \u0415\u0441\u043b\u0438 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u043c\u0435\u043d\u044f\u0442\u044c visibility, \u0442\u043e \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430.\u00a0<\/p>\n<p>\u041f\u0440\u0438\u0447\u0438\u043d\u0430 \u2014\u00a0\u0443 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 \u0434\u043b\u044f \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0430 \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u044f\u043b\u0441\u044f margin. \u0411\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430 \u2014\u00a0\u044d\u0442\u043e \u0438 \u0435\u0441\u0442\u044c \u0442\u043e\u0442 \u0441\u0430\u043c\u044b\u0439 margin.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/0f1\/a3b\/52f\/0f1a3b52fd8c5d4733f5f6ee19391939.png\" alt=\"\u041f\u0440\u0438 \u0441\u043a\u0440\u044b\u0442\u0438\u0438 \u0438 \u043f\u043e\u043a\u0430\u0437\u0435 AppBarLayout \u0432 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430\" title=\"\u041f\u0440\u0438 \u0441\u043a\u0440\u044b\u0442\u0438\u0438 \u0438 \u043f\u043e\u043a\u0430\u0437\u0435 AppBarLayout \u0432 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430\" width=\"1500\" height=\"844\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/0f1\/a3b\/52f\/0f1a3b52fd8c5d4733f5f6ee19391939.png\"\/><figcaption>\u041f\u0440\u0438 \u0441\u043a\u0440\u044b\u0442\u0438\u0438 \u0438 \u043f\u043e\u043a\u0430\u0437\u0435 AppBarLayout \u0432 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430<\/figcaption><\/figure>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 Behavior \u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 \u043d\u0435\u0433\u043e VisibilityListener. <\/p>\n<details class=\"spoiler\">\n<summary>\u041d\u043e\u0432\u044b\u0439 \u043a\u043e\u0434 Behavoir<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarBehavior(context: Context, attrs: AttributeSet) :     AppBarLayout.ScrollingViewBehavior(context, attrs) {       private var isInstalled = false       override fun layoutDependsOn(         parent: CoordinatorLayout,         child: View,         dependency: View     ): Boolean {         if (!isInstalled &amp;&amp; dependency is BaseAppBarLayout) {             isInstalled = true             child.setRoundedAppBarBehavior()             addVisibilityListener(dependency, child)         }         return super.layoutDependsOn(parent, child, dependency)     }       private fun addVisibilityListener(appBarLayout: AppBarLayout, child: View) {         var isVisibleSaved = appBarLayout.isVisible           val visibilityListener = ViewTreeObserver.OnGlobalLayoutListener {             if (isVisibleSaved != appBarLayout.isVisible) {                 isVisibleSaved = appBarLayout.isVisible                   if (isVisibleSaved) {                     child.setRoundedAppBarBehavior()                 } else {                     child.removeRoundedAppBarBehavior()                 }             }         }           appBarLayout.viewTreeObserver.addOnGlobalLayoutListener(visibilityListener)         appBarLayout.doOnDetach {             appBarLayout.viewTreeObserver.removeOnGlobalLayoutListener(visibilityListener)         }     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u0417\u0434\u0435\u0441\u044c \u044f \u043f\u043e\u0434\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0441\u044c \u043d\u0430 GlobalLayout, \u043a\u043e\u0433\u0434\u0430 doOnDetach \u2014 \u043e\u0442\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0441\u044c \u043e\u0442 \u043d\u0435\u0433\u043e. \u0415\u0441\u043b\u0438 \u043e\u043d \u0432\u0438\u0434\u0438\u043c, \u0442\u043e\u0433\u0434\u0430 \u044f \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0435\u043c\u0443 RoundedBehavior, \u0442\u043e \u0435\u0441\u0442\u044c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e margin, \u0435\u0441\u043b\u0438 \u043e\u043d \u043d\u0435\u0432\u0438\u0434\u0438\u043c \u2014 \u044f \u0443\u0431\u0438\u0440\u0430\u044e \u0438\u0445. \u042d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u043b\u0438 \u0443\u0442\u0435\u0447\u043a\u0438 \u043f\u0430\u043c\u044f\u0442\u0438 \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<h3>\u21167. \u0411\u0435\u043b\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u0440\u0438 \u043d\u0435\u0441\u043a\u0440\u043e\u043b\u043b\u044f\u0449\u0435\u043c\u0441\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0435 \u0432 Child<\/h3>\n<p>\u041f\u0440\u0438\u043b\u0435\u0442\u0435\u043b \u0435\u0449\u0451 \u043e\u0434\u0438\u043d \u0431\u0430\u0433. \u0412 \u043f\u0440\u043e\u0444\u0438\u043b\u0435 \u043a\u043b\u0438\u0435\u043d\u0442\u0430 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430, \u0435\u0441\u043b\u0438 child \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043d\u0435\u0441\u043a\u0440\u043e\u043b\u043b\u044f\u0449\u0438\u0439\u0441\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442.\u00a0<\/p>\n<p>\u041a\u043e\u0433\u0434\u0430 \u044f \u0440\u0430\u0431\u043e\u0442\u0430\u043b \u0441\u043e \u0441\u043f\u0438\u0441\u043a\u0430\u043c\u0438, \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u043b\u0441\u044f \u043c\u043e\u0439 Behavior \u2014 \u0432\u0435\u0441\u044c \u0441\u043f\u0438\u0441\u043e\u043a \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u043b\u0441\u044f, \u0438 \u0432\u0441\u0451 \u0440\u0430\u0431\u043e\u0442\u0430\u043b\u043e \u043e\u0442\u043b\u0438\u0447\u043d\u043e. \u041a\u0430\u043a \u0442\u043e\u043b\u044c\u043a\u043e \u0432 Layout, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u043b\u0441\u044f behaviour, \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0447\u0430\u0441\u0442\u044c, \u0442\u043e margin \u0441\u0432\u0435\u0440\u0445\u0443 \u043e\u0441\u0442\u0430\u0432\u0430\u043b\u0441\u044f.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 ScrollListener. \u041e\u043d \u0441\u0434\u0435\u043b\u0430\u043b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 AppBarLayout \u0435\u0449\u0451 \u0431\u043e\u043b\u0435\u0435 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u043c, \u0432 \u0441\u043a\u0440\u043e\u043b\u043b \u2014 \u043f\u043b\u0430\u0432\u043d\u044b\u043c.<\/p>\n<details class=\"spoiler\">\n<summary>\u041e\u0431\u043d\u043e\u0432\u043b\u0451\u043d\u043d\u044b\u0439 \u043a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarBehavior(context: Context, attrs: AttributeSet) :     AppBarLayout.ScrollingViewBehavior(context, attrs) {       private var isInstalled = false       private val arcHeight = context.resources.getDimensionPixelSize(R.dimen.toolbar_arc_height)       override fun layoutDependsOn(         parent: CoordinatorLayout,         child: View,         dependency: View     ): Boolean {         if (!isInstalled &amp;&amp; dependency is BaseAppBarLayout) {             isInstalled = true             child.setRoundedAppBarBehavior()             addVisibilityListener(dependency, child)             addOnScrollListener(dependency, child)         }         return super.layoutDependsOn(parent, child, dependency)     }       private fun addOnScrollListener(appBarLayout: BaseAppBarLayout, child: View) {         val scrollListener = AppBarLayout.OnOffsetChangedListener { _, _ ->             val divider = (appBarLayout.height - appBarLayout.nonScrollableHeight).toFloat()             val scale =                 if (divider == 0f) 1f else (appBarLayout.bottom - appBarLayout.nonScrollableHeight) \/ divider               child.setPadding(                 child.paddingLeft,                 max(0, (arcHeight * scale).toInt()),                 child.paddingEnd,                 child.paddingBottom             )         }           appBarLayout.addOnOffsetChangedListener(scrollListener)         appBarLayout.doOnDetach {             appBarLayout.removeOnOffsetChangedListener(scrollListener)         }     }       private fun addVisibilityListener(appBarLayout: AppBarLayout, child: View) {         var isVisibleSaved = appBarLayout.isVisible           val visibilityListener = ViewTreeObserver.OnGlobalLayoutListener {             if (isVisibleSaved != appBarLayout.isVisible) {                 isVisibleSaved = appBarLayout.isVisible                   if (isVisibleSaved) {                     child.setRoundedAppBarBehavior()                 } else {                     child.removeRoundedAppBarBehavior()                 }             }         }           appBarLayout.viewTreeObserver.addOnGlobalLayoutListener(visibilityListener)         appBarLayout.doOnDetach {             appBarLayout.viewTreeObserver.removeOnGlobalLayoutListener(visibilityListener)         }     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u0417\u0434\u0435\u0441\u044c \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0442\u0430\u043a\u0438\u0435 \u0436\u0435, \u043a\u0430\u043a \u0441 \u0440\u0438\u0441\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0434\u0443\u0433\u0438: \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f, \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442 \u0441\u043a\u0440\u043e\u043b\u043b\u0430 scale, \u0433\u0434\u0435 0 \u2014\u00a0\u044d\u0442\u043e \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0441\u043a\u0440\u044b\u0442\u0430\u044f \u0434\u0443\u0433\u0430, \u0430 1 \u2014\u00a0\u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u0430\u044f \u0434\u0443\u0433\u0430. \u0422\u0435\u043f\u0435\u0440\u044c \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0434\u043e \u0434\u0443\u0433\u0438 \u0431\u0443\u0434\u0435\u0442 \u0442\u043e\u0447\u043d\u043e \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u043a\u0440\u043e\u043b\u043b\u0430.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0438 \u0440\u0435\u0448\u0435\u043d\u0438\u0435<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5b1\/4e6\/57c\/5b14e657ceb3bbff9626b8d978f827f1.gif\" width=\"1920\" height=\"1080\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5b1\/4e6\/57c\/5b14e657ceb3bbff9626b8d978f827f1.gif\"\/><figcaption><\/figcaption><\/figure>\n<\/div>\n<\/details>\n<p><a class=\"anchor\" name=\"motion\" id=\"motion\"><\/a><\/p>\n<h2>\u041a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0437\u0430 \u043f\u043e\u043b\u0447\u0430\u0441\u0430 \u0442\u043e, \u0441 \u0447\u0435\u043c \u044f \u043f\u0440\u043e\u0432\u043e\u0437\u0438\u043b\u0441\u044f \u0441\u0443\u0442\u043a\u0438<\/h2>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/957\/0a9\/7e5\/9570a97e59ea82b7aa828b33c1ff7928.png\" width=\"1000\" height=\"563\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/957\/0a9\/7e5\/9570a97e59ea82b7aa828b33c1ff7928.png\"\/><figcaption><\/figcaption><\/figure>\n<p>\u042f \u043f\u0440\u0438\u043a\u0438\u0434\u044b\u0432\u0430\u043b \u043c\u043d\u043e\u0433\u043e \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432, \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u043e\u0445\u043e\u0436\u0435\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0441 CoordinatorLayout, \u043d\u043e, \u043a \u0441\u043e\u0436\u0430\u043b\u0435\u043d\u0438\u044e, \u0432 AppBarLayout \u043d\u0435\u043b\u044c\u0437\u044f \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0443 \u0443 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043d\u0438\u0436\u0435 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0433\u043e. \u0414\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0434\u0432\u0430 AppBarLayout, \u043e\u043d\u0438 \u0432\u0441\u0451 \u0440\u0430\u0432\u043d\u043e \u0431\u0443\u0434\u0443\u0442 \u043a\u0440\u0438\u0432\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c.\u00a0<\/p>\n<p>\u041a\u043e\u0433\u0434\u0430 \u043c\u044b \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043b\u0438, \u043a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043d\u0430 \u0433\u043b\u0430\u0432\u043d\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435, \u0442\u043e \u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0447\u0442\u043e \u0441 \u0437\u0430\u0434\u0430\u0447\u0435\u0439 \u043d\u0435 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0435\u0442 \u043d\u0438\u043a\u0430\u043a\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c. \u0422\u043e\u043b\u044c\u043a\u043e \u0432 \u0445\u043e\u0434\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u043d\u0430\u0447\u0430\u043b\u0438 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0435 \u0431\u0430\u0433\u0438 \u0432 \u0442\u043e\u043c \u043c\u0435\u0442\u043e\u0434\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u044b \u0432\u044b\u0431\u0440\u0430\u043b\u0438, \u0438 \u043f\u043e\u043d\u044f\u043b\u0438, \u0447\u0442\u043e \u0435\u0441\u0442\u044c \u043c\u043d\u043e\u0433\u043e \u043a\u0435\u0439\u0441\u043e\u0432, \u0433\u0434\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043d\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442. <\/p>\n<p>\u0421 \u043a\u0430\u0436\u0434\u044b\u043c \u043d\u043e\u0432\u044b\u043c \u0431\u0430\u0433\u043e\u043c \u043c\u044b \u0432\u043d\u043e\u0441\u0438\u043b\u0438 \u043d\u043e\u0432\u044b\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f, \u0434\u043e\u043f\u0438\u0441\u044b\u0432\u0430\u043b\u0438 \u0438 \u0434\u043e\u0434\u0435\u043b\u044b\u0432\u0430\u043b\u0438. \u0423\u0436\u0435 \u0432 \u0444\u0438\u043d\u0430\u043b\u0435 \u043c\u044b \u043e\u0441\u043e\u0437\u043d\u0430\u043b\u0438, \u0447\u0442\u043e \u043b\u0443\u0447\u0448\u0435 \u0431\u044b\u043b\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0434\u0440\u0443\u0433\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435. <strong>\u0422\u043e\u0433\u0434\u0430 \u044f \u0431\u044b \u0441\u043c\u043e\u0433 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0437\u0430\u0434\u0430\u0447\u0443 \u0437\u0430 \u043f\u043e\u043b\u0447\u0430\u0441\u0430 \u0432\u043c\u0435\u0441\u0442\u043e \u0441\u0443\u0442\u043e\u043a.<\/strong><\/p>\n<h4>\u041d\u0430 \u043a\u0430\u043a\u0438\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u044f \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u044e \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435:<\/h4>\n<p>1) <strong>\u041d\u0430\u043f\u0438\u0441\u0430\u0442\u044c \u0441\u0432\u043e\u0439 \u043d\u0430\u0441\u043b\u0435\u0434\u043d\u0438\u043a FrameLayout<\/strong><\/p>\n<p>\u0421 \u043d\u0438\u043c \u043c\u043e\u0436\u043d\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u0432\u0441\u0451, \u0447\u0442\u043e \u0443\u0433\u043e\u0434\u043d\u043e: \u0438 \u043d\u0430 \u043a\u0430\u043d\u0432\u0430\u0441\u0435 \u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c, \u0438 \u0434\u0432\u0438\u0433\u0430\u0442\u044c \u0432\u044c\u044e\u0448\u043a\u0438, \u043a\u0430\u043a \u0445\u043e\u0447\u0435\u0442\u0441\u044f.<\/p>\n<p>2)\u00a0<strong>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c MotionLayout<\/strong><\/p>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f MotionLayout, \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443 \u0432 AppBarLayout \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u043a\u0432\u0430\u043b\u044c\u043d\u043e \u0437\u0430 30 \u043c\u0438\u043d\u0443\u0442!\u00a0\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0432\u0441\u0435 \u043d\u0443\u0436\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0435 \u0438\u043b\u0438 \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438, \u0430 \u043f\u043e\u0442\u043e\u043c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b, \u0437\u0430\u0434\u0430\u0442\u044c \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.\u00a0<\/p>\n<blockquote>\n<p>? <strong>\u041f\u0440\u0438\u043c\u0435\u0440 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0434\u0443\u0433\u0438 \u0432 Motion Layout \u2014 \u043d\u0430 <\/strong><a href=\"https:\/\/github.com\/appKODE\/motion-layout-android-samurai-example\" rel=\"noopener noreferrer nofollow\"><strong>\u0413\u0438\u0442\u0445\u0430\u0431\u0435<\/strong><\/a><strong>.<\/strong><\/p>\n<\/blockquote>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \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\/articles\/591009\/\"> https:\/\/habr.com\/ru\/articles\/591009\/<\/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<p>\u041f\u0440\u0438\u0432\u0435\u0442! \u041c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0410\u043d\u0434\u0440\u0435\u0439 \u0428\u043e\u043a\u043e\u043b\u043e\u0432, \u044f Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a KODE. <\/p>\n<p>\u041a \u043d\u0430\u043c \u043e\u0431\u0440\u0430\u0442\u0438\u043b\u0430\u0441\u044c \u043a\u043e\u043c\u043f\u0430\u043d\u0438\u044f Forward Leasing \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u0433\u043e\u0442\u043e\u0432\u043e\u043c\u0443 \u0434\u0438\u0437\u0430\u0439\u043d\u0443. \u041f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u043b \u0434\u0443\u0433\u0443, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e \u0437\u0430\u0434\u0443\u043c\u043a\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u043b\u0430 \u0441\u0436\u0438\u043c\u0430\u0442\u044c\u0441\u044f \u0432 \u043e\u0434\u043d\u0443 \u043b\u0438\u043d\u0438\u044e \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435. \u0417\u0430 \u043e\u0441\u043d\u043e\u0432\u0443 \u0440\u0435\u0448\u0438\u043b\u0438 \u0432\u0437\u044f\u0442\u044c CoordinatorLayout: \u0443 \u043d\u0430\u0441 \u0443\u0436\u0435 \u0431\u044b\u043b \u043f\u043e\u043b\u043e\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043e\u043f\u044b\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043d\u0438\u043c \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u043c \u043f\u0440\u043e\u0435\u043a\u0442\u0435. \u0415\u0449\u0451 \u0432 \u043d\u0430\u0448\u0435\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u0435 \u0447\u0430\u0441\u0442\u043e \u043b\u044e\u0431\u0438\u043b\u0438 \u0441\u043e\u0440\u0435\u0432\u043d\u043e\u0432\u0430\u0442\u044c\u0441\u044f, \u043a\u0430\u043a\u043e\u0439 \u0436\u0435 Layout \u043b\u0443\u0447\u0448\u0435 \u2014\u00a0CoordinatorLayout \u0438\u043b\u0438 MotionLayout, \u0438 \u0438\u043c\u0435\u043d\u043d\u043e \u0441\u0435\u0439\u0447\u0430\u0441 \u043d\u0430\u0441\u0442\u0430\u043b\u043e \u0432\u0440\u0435\u043c\u044f \u0443\u0437\u043d\u0430\u0442\u044c. <\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u044f \u043f\u043e\u043d\u0438\u043c\u0430\u044e, \u0447\u0442\u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u0431\u044b\u043b\u0430 \u0441\u043e\u0437\u0434\u0430\u043d\u0430 \u043d\u0430 \u0440\u043e\u0432\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435, \u2014\u00a0\u043d\u043e \u044d\u0442\u043e \u044f \u0432\u044b\u044f\u0441\u043d\u0438\u043b \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u044b. <strong>\u0412 \u0441\u0442\u0430\u0442\u044c\u0435 \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u0441 \u043a\u0430\u043a\u0438\u043c\u0438 7 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438 CoordinatorLayout \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0438 <\/strong><a href=\"#motion\" rel=\"noopener noreferrer nofollow\"><strong>\u043a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0437\u0430 \u043f\u043e\u043b\u0447\u0430\u0441\u0430<\/strong><\/a><strong> \u0442\u043e, \u0441 \u0447\u0435\u043c \u044f \u043f\u0440\u043e\u0432\u043e\u0437\u0438\u043b\u0441\u044f \u0441\u0443\u0442\u043a\u0438.<\/strong><\/p>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<h2>\u0417\u0430\u0434\u0430\u0447\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0430<\/h2>\n<p>\u041c\u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c AppBarLayout \u0441 \u0434\u0443\u0433\u043e\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u0441\u044f \u0432 \u043e\u0434\u043d\u0443 \u043b\u0438\u043d\u0438\u044e. \u0424\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0432 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0443\u044e Activity \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f Forward. \u041a\u043e\u0440\u043d\u0435\u0432\u044b\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0434\u043b\u044f \u0433\u043b\u0430\u0432\u043d\u043e\u0439 Activity \u0431\u044b\u043b \u0432\u044b\u0431\u0440\u0430\u043d CoordinatorLayout \u2014\u00a0\u044d\u0442\u043e ViewGroup, \u0446\u0435\u043b\u044c\u044e \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0446\u0438\u044f \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0445 view-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<figure class=\"full-width\"><figcaption>\u0413\u043b\u0430\u0432\u043d\u044b\u0439 \u044d\u043a\u0440\u0430\u043d \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f Forward Leasing<\/figcaption><\/figure>\n<p>\u041f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u044f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443, \u0447\u0442\u043e \u0442\u0430\u043a\u043e\u0435 CoordinatorLayout \u0438 \u0441 \u043a\u0430\u043a\u0438\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u0432 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f, \u043f\u043e\u043a\u0430\u0436\u0443, \u043a\u0430\u043a \u0432 \u0438\u0442\u043e\u0433\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c\u0441\u044f:<\/p>\n<details class=\"spoiler\">\n<summary>\u0424\u0438\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"\"><figcaption><\/figcaption><\/figure>\n<\/div>\n<\/details>\n<h2>\u0427\u0442\u043e \u0442\u0430\u043a\u043e\u0435 CoordinatorLayout \u0441 Default behavior<\/h2>\n<p>CoordinatorLayout \u2014 \u044d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u043e\u0431\u044b\u0447\u043d\u044b\u0439 FrameLayout. \u041d\u0435\u0442, \u043f\u0440\u043e\u0441\u0442\u0438\u0442\u0435: \u043a\u0430\u043a \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043e \u0432 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438, \u044d\u0442\u043e super-powered FrameLayout!<\/p>\n<figure class=\"full-width\"><figcaption>\u0413\u043b\u0430\u0432\u043d\u0430\u044f \u0444\u0438\u0448\u043a\u0430 CoordinatorLayout \u2014 \u0441\u0432\u043e\u0438 Default behaviors<\/figcaption><\/figure>\n<p>\u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Behaviors \u043c\u043e\u0436\u043d\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0439 View. \u0414\u0443\u043c\u0430\u044e, \u0432\u0441\u0435 \u0432\u0438\u0434\u0435\u043b\u0438 \u044d\u0442\u0438 \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043a\u043e\u0433\u0434\u0430 \u0441\u043d\u0438\u0437\u0443 \u0432\u044b\u043f\u043b\u044b\u0432\u0430\u0435\u0442 Snackbar, \u0430 \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u043d\u0438\u043c \u0432\u0432\u0435\u0440\u0445 \u043f\u043e\u0434\u043d\u0438\u043c\u0430\u0435\u0442\u0441\u044f\u00a0FAB (Floating Action Button). \u0412\u0441\u0451 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043e\u0442\u043b\u0438\u0447\u043d\u043e. \u041d\u043e \u0438\u043c\u0435\u043d\u043d\u043e Behaviors \u0438 \u043f\u043e\u0434\u0441\u0442\u0430\u0432\u044f\u0442 \u043c\u0435\u043d\u044f \u043f\u043e\u0437\u0434\u043d\u0435\u0435, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043a\u043e\u0433\u0434\u0430 \u0442\u0435\u0431\u0435 \u043d\u0443\u0436\u043d\u043e \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0435 \u0432\u0441\u0451 \u043f\u043e \u0434\u0435\u0444\u043e\u043b\u0442\u0443, \u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u0441\u0432\u043e\u0451, \u0442\u043e \u0432\u043e\u0437\u043d\u0438\u043a\u0430\u044e\u0442 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438. \u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0430\u043a\u043e\u0439 \u0434\u0443\u0433\u0438 \u0431\u044b\u043b \u0441\u043e\u0437\u0434\u0430\u043d \u043a\u043b\u0430\u0441\u0441 RoundedAppBarLayout, \u043d\u0430\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 AppBarLayout.<\/p>\n<h2>\u0427\u0442\u043e \u0434\u0430\u043d\u043e \u0432 RoundedAppBarLayout<\/h2>\n<ul>\n<li>\n<p>Toolbar \u2014\u00a0\u0441\u0430\u043c\u0430\u044f \u043e\u0431\u044b\u0447\u043d\u0430\u044f \u0432\u044c\u044e \u0442\u0443\u043b\u0431\u0430\u0440\u0430 \u0438\u0437 Android.<\/p>\n<\/li>\n<li>\n<p>ContentView, \u0433\u0434\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0432\u0441\u0451, \u0447\u0442\u043e \u0443\u0433\u043e\u0434\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>Arc \u2014 \u043d\u0430\u0448\u0430 \u0434\u0443\u0433\u0430.<\/p>\n<\/li>\n<\/ul>\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<h2>\u0421 \u043a\u0430\u043a\u0438\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0438 \u043a\u0430\u043a \u0438\u0445 \u0440\u0435\u0448\u0430\u043b<\/h2>\n<h3>\u21161. \u0421\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433<\/h3>\n<p>\u0423 \u043d\u0430\u0441 \u0435\u0441\u0442\u044c RoundedAppBarLayout, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f Toolbar, ContentView \u0438 Arc. \u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0432\u044c\u044e \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c scrollFlags, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0442 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432\u044c\u044e \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435:\u00a0 scroll, snap, expandAlways, expandAlwaysCollapsed, exitUntilCollapsed. \u041a\u0430\u043a \u043e\u043d\u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442? AppBarLayout \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e \u0432\u0441\u0435\u043c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u0432\u044c\u044e \u2014\u00a0child\u2019\u0430\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0443 \u043d\u0435\u0433\u043e \u0435\u0441\u0442\u044c, \u0438 \u0441\u043c\u043e\u0442\u0440\u0438\u0442: \u0435\u0441\u043b\u0438 \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u0435\u043d scroll, \u0442\u043e\u0433\u0434\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0442\u043e, \u0447\u0442\u043e \u044d\u0442\u0430 \u0432\u044c\u044e\u0448\u043a\u0430 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u0441\u044f, \u0435\u0441\u043b\u0438 noScroll \u2014\u00a0return.\u00a0<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043d\u0430 Toolbar \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043e scroll, \u0442\u043e \u043e\u043d \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u0438\u0442\u0441\u044f, \u0430 \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043d\u0438\u0436\u0435 \u043d\u0435\u0433\u043e, \u2014 \u043d\u0435\u0442. \u0421\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0435\u0441\u043b\u0438 \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c scroll \u043d\u0430 Toolbar \u0438 ContentView, \u0442\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u0431\u0443\u0434\u0443\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u043d\u0438. \u041d\u0430\u043c \u0436\u0435 \u043d\u0443\u0436\u043d\u043e \u0440\u043e\u0432\u043d\u043e \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442: \u0447\u0442\u043e\u0431\u044b \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043b\u0430\u0441\u044c \u0434\u0443\u0433\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0451, \u0447\u0442\u043e \u0432\u044b\u0448\u0435 \u043d\u0435\u0451.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p><strong>CollapsingToolbar.<\/strong> \u041e\u043d \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0441\u0442\u0430\u0432\u0438\u0442\u044c Toolbar \u043d\u0430\u0432\u0435\u0440\u0445\u0443 \u0438 \u0434\u0430\u0451\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c ContentView, Arc \u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043d\u0438\u0436\u0435. \u042d\u0442\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0445\u043e\u0440\u043e\u0448\u043e, \u0437\u0430 \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435\u043c \u0442\u043e\u0433\u043e, \u0447\u0442\u043e Toolbar \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c CollapsingToolbar.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">&lt;?xml version=\"1.0\" encoding=\"utf-8\"?> &lt;merge xmlns:android=\"http:\/\/schemas.android.com\/apk\/res\/android\"     xmlns:app=\"http:\/\/schemas.android.com\/apk\/res-auto\"     xmlns:tools=\"http:\/\/schemas.android.com\/tools\"     android:layout_width=\"match_parent\"     android:layout_height=\"wrap_content\"     android:background=\"@color\/transparent\"     tools:parentTag=\"com.google.android.material.appbar.AppBarLayout\">       &lt;com.google.android.material.appbar.CollapsingToolbarLayout         android:id=\"@+id\/collapsingToolbar\"         android:layout_width=\"match_parent\"         android:layout_height=\"wrap_content\"         android:background=\"@color\/transparent\"         app:layout_scrollFlags=\"scroll|snap|exitUntilCollapsed\">       &lt;\/com.google.android.material.appbar.CollapsingToolbarLayout> &lt;\/merge><\/code><\/pre>\n<\/div>\n<\/details>\n<h3>\u21162. \u041f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0435 \u0437\u043e\u043d\u044b \u0432 Arc \u0438 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0430 \u0434\u0443\u0433\u0438<\/h3>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443 \u0432 AppBarLayout, \u0432 \u0431\u043b\u043e\u043a\u0435 Arc \u0434\u043e\u043b\u0436\u043d\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0437\u043e\u043d\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c\u0438. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u043c AppBarLayout transparent, \u043a\u0430\u043a \u0438 ContentView: \u043c\u044b \u043d\u0435 \u0437\u043d\u0430\u0435\u043c, \u043a\u0430\u043a\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430 \u043e\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c.<\/p>\n<p>\u041d\u043e \u0435\u0441\u043b\u0438 \u043c\u044b \u043e\u0441\u0442\u0430\u0432\u0438\u043c CollapsingToolbar, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u043b\u043e\u0436\u0435\u043d \u0432 AppBar, \u0431\u0435\u0437 \u0446\u0432\u0435\u0442\u0430, \u043a\u0430\u043a \u0438 \u043d\u0430\u0448 ContentView, \u0442\u043e \u043d\u0430 \u0432\u044b\u0445\u043e\u0434\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u041f\u043e\u043a\u0440\u0430\u0441\u0438\u0442\u044c CollapsingToolbar \u0432 \u043a\u0430\u043a\u043e\u0439-\u0442\u043e \u0446\u0432\u0435\u0442. \u041c\u044b \u0432\u044b\u0431\u0440\u0430\u043b\u0438 \u0444\u0438\u043e\u043b\u0435\u0442\u043e\u0432\u044b\u0439, \u0442\u0430\u043a \u043a\u0430\u043a \u044d\u0442\u043e \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0446\u0432\u0435\u0442 \u043f\u0440\u043e\u0435\u043a\u0442\u0430. \u042d\u0442\u0438\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u043c\u044b \u0442\u0430\u043a\u0436\u0435 \u0443\u043b\u0443\u0447\u0448\u0438\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e: \u0442\u0435\u043f\u0435\u0440\u044c \u043f\u0440\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0435 \u0431\u043b\u043e\u043a \u043c\u043e\u0436\u0435\u0442 \u0437\u0430\u0442\u0435\u043c\u043d\u044f\u0442\u044c\u0441\u044f, \u0438 \u044d\u0442\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u043a\u0440\u0430\u0441\u0438\u0432\u043e.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u0430\u043a \u044d\u0442\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442<\/summary>\n<div class=\"spoiler__content\">\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<\/div>\n<\/details>\n<p><strong>\u041e\u0441\u0442\u0430\u0451\u0442\u0441\u044f \u0432\u043e\u043f\u0440\u043e\u0441 \u0441 \u0434\u0443\u0433\u043e\u0439.<\/strong> \u041c\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u043c \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0435\u0451 \u0432 \u0432 CollapsingToolbar, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u043d \u0438\u043c\u0435\u0435\u0442 \u0441\u0432\u043e\u0439 \u0446\u0432\u0435\u0442, \u0430 Arc \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c transparent. \u041f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0441\u044f, \u043c\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0434\u0443\u0433\u0443 \u0432 AppBarLayout, \u043d\u043e \u043e\u043d, \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u043c\u043d\u0438\u043c, \u043d\u0435 \u0434\u0430\u0451\u0442 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u0442\u044c \u0432\u0441\u0451, \u0447\u0442\u043e \u0432\u043d\u0438\u0437\u0443.\u00a0<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0420\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u043a\u0430\u043d\u0432\u0430\u0441\u0435 \u0438 \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u043a\u0440\u043e\u043b\u043b\u0430 \u043f\u0440\u043e\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c, \u043a\u0430\u043a \u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443.\u00a0<\/p>\n<figure class=\"full-width\"><figcaption>\u0421\u043b\u0435\u0432\u0430 \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e, \u043a\u0430\u043a \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 Layout&#8217;\u0430<\/figcaption><\/figure>\n<p>\u042d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 CollapsingToolbar. \u041c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0441\u0440\u0430\u0437\u0443 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u044e\u0434\u0430 Toolbar, \u043d\u043e \u0442\u0430\u043a \u043a\u0430\u043a \u043d\u0443\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u0431\u044b\u043b \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0432 CollapsingToolbarLayout, \u0435\u0433\u043e \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e. \u0422\u043e \u0435\u0441\u0442\u044c \u044f \u0434\u0435\u043b\u0430\u044e Inflate Layout\u2019\u0430 \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044e \u0432 \u043a\u043e\u043d\u0435\u0446 CollapsingToolbarLayout.<\/p>\n<details class=\"spoiler\">\n<summary>\u041a\u043e\u0434<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">private fun addContentView(){         if (childCount > 1) {             val contentChild = this.getChildAt(1)             removeView(contentChild)               val layoutParams = CollapsingToolbarLayout.LayoutParams(contentChild.layoutParams)             with(contentChild) {                 layoutParams.setMargins(                     marginStart,                     marginTop + toolbarHeight,                     marginEnd,                     marginBottom                 )             }             contentChild.setBackgroundColor(context.getColor(R.color.accent2))             contentChild.layoutParams = layoutParams               collapsingToolbar.addView(contentChild)         }     }       override fun onFinishInflate() {         super.onFinishInflate()         addContentView()           val toolbar = LayoutInflater.from(context)             .inflate(R.layout.toolbar_default, collapsingToolbar, false)         removeView(toolbar)         collapsingToolbar.addView(toolbar)     }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0441\u044f \u0442\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u0441\u0442\u0435\u043d\u044c\u043a\u0438\u0439 \u043a\u043b\u0430\u0441\u0441, \u0433\u0434\u0435 \u0435\u0441\u0442\u044c \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b, title, \u0433\u0434\u0435 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c \u0438\u043a\u043e\u043d\u043a\u0443 \u0434\u043b\u044f Toolbar, \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c ContentView, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432 \u0441\u0430\u043c\u043e\u043c \u043d\u0430\u0448\u0435\u043c RoundedAppBarLayout, \u0438 \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443.<\/p>\n<figure class=\"full-width\"><figcaption>\u0414\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0435 \u043c\u0435\u0442\u043e\u0434\u044b<\/figcaption><\/figure>\n<h3>\u21163. \u041f\u0443\u0441\u0442\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u043e\u0441\u043b\u0435 ContentView<\/h3>\n<p>\u0421 \u0447\u0435\u043c \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0434\u0430\u043b\u044c\u0448\u0435. \u041f\u043e\u0441\u043b\u0435 Toolbar \u0438 ContentView \u0443 \u043d\u0430\u0441 \u043d\u0435\u0442 \u043d\u0438\u043a\u0430\u043a\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430. \u041f\u043e \u0438\u0434\u0435\u0435, \u0442\u0443\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u0431\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432\u044c\u044e\u0448\u043a\u0443, \u043d\u043e \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u043d\u0435\u0439 \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435 \u043f\u043e\u044f\u0432\u043b\u044f\u043b\u0430\u0441\u044c \u0431\u044b \u0431\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043e\u0441\u0430. \u042f \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u043e\u0436\u0438\u0434\u0430\u043b \u0442\u0430\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435.<\/p>\n<h4>\u0420\u0435\u0448\u0435\u043d\u0438\u0435<\/h4>\n<p>\u0420\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 AppBarLayout. \u0422\u0430\u043a\u0436\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e appbarBottom, \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c \u0434\u0443\u0433\u0443: \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e \u043d\u0438\u0436\u043d\u044e\u044e \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0443 ContentView \u0438 \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u044e AppBarLayout \u0434\u043e \u043a\u043e\u043d\u0446\u0430 \u0431\u043b\u043e\u043a\u0430 Arc. \u0422\u0430\u043a \u043d\u0430\u043c \u0431\u0443\u0434\u0435\u0442 \u0443\u0434\u043e\u0431\u043d\u0435\u0435 \u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c. (\u0421\u043f\u043e\u0439\u043b\u0435\u0440: \u044d\u0442\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435 \u0432 \u0438\u0442\u043e\u0433\u0435 \u0441\u043e \u043c\u043d\u043e\u0439 \u0441\u044b\u0433\u0440\u0430\u0435\u0442 \u0437\u043b\u0443\u044e \u0448\u0443\u0442\u043a\u0443.)<\/p>\n<details class=\"spoiler\">\n<summary>\u0420\u0430\u0441\u0448\u0438\u0440\u044f\u044e AppBarLayout<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : AppBarLayout(context, attrs, defStyleAttr) {       init {         LayoutInflater.from(context).inflate(R.layout.appbar_rounded_default, this, true)         initView()     }       private fun initView() {         this.post {             layoutParams = CoordinatorLayout.LayoutParams(width, height + arcHeight)             appbarBottom = height.toFloat()             appbarHalfWidth = width \/ 2f         }     } }<\/code><\/pre>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u044e ContentChild \u0438 Toolbar \u0434\u043b\u044f \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">    override fun onFinishInflate() {         super.onFinishInflate()         if (childCount > 1) {             val contentChild = this.getChildAt(1)             removeView(contentChild)               val layoutParams = CollapsingToolbarLayout.LayoutParams(contentChild.layoutParams)             with(contentChild) {                 layoutParams.setMargins(                     marginStart,                     marginTop + toolbarHeight,                     marginEnd,                     marginBottom                 )             }             contentChild.setBackgroundColor(context.getColor(R.color.accent2))             contentChild.layoutParams = layoutParams               collapsingToolbar.addView(contentChild)         }<\/code><\/pre>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0420\u0438\u0441\u0443\u044e \u0434\u0443\u0433\u0443<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">private fun drawArc(canvas: Canvas) {         val scale = bottom \/ height.toFloat()           arcPath.apply {             reset()             moveTo(0f, appbarBottom)             quadTo(                 appbarHalfWidth,                 \/\/divide by 2 due to arc drawing logic                 (appbarBottom + (arcHeight * 2)) * scale,                 width.toFloat(),                 appbarBottom             )         }         canvas.drawPath(arcPath, arcPaint).apply {             invalidate()         }     }<\/code><\/pre>\n<\/div>\n<\/details>\n<p>\u041d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u0447\u0438\u0442\u0430\u0442\u044c \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u043a\u043e\u0433\u0434\u0430 AppBarLayout \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0437\u0430\u0441\u043a\u0440\u043e\u043b\u043b\u0435\u043d \u0438 \u043d\u0435\u0434\u043e\u0441\u043a\u0440\u043e\u043b\u0435\u043d. \u0422\u043e \u0435\u0441\u0442\u044c scale = 1 \u2014 \u044d\u0442\u043e AppBarLayout \u0440\u0430\u0441\u043a\u0440\u044b\u0442 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e, \u0430 scale = 0 \u2014 \u0441\u0445\u043b\u043e\u043f\u043d\u0443\u0442. \u0418 \u0440\u0438\u0441\u0443\u044e \u0441\u0430\u043c\u0443 \u0434\u0443\u0433\u0443. \u042f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0437\u0434\u0435\u0441\u044c \u0441 \u043e\u0447\u0435\u043d\u044c \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0439 \u043b\u043e\u0433\u0438\u043a\u043e\u0439: \u0435\u0441\u043b\u0438 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u043e y-\u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0435, \u0447\u0442\u043e \u043a\u0440\u0430\u0439\u043d\u044f\u044f \u0442\u043e\u0447\u043a\u0430 \u0434\u0443\u0433\u0438 \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c \u043d\u0430 48 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445, \u0442\u043e \u0432\u0435\u0440\u0448\u0438\u043d\u0430 \u044d\u0442\u043e\u0439 \u0442\u043e\u0447\u043a\u0438 \u0431\u0443\u0434\u0435\u0442 \u043d\u0430 24 \u043f\u0438\u043a\u0441\u0435\u043b\u044f\u0445 \u2014 \u0432 \u0434\u0432\u0430 \u0440\u0430\u0437\u0430 \u043c\u0435\u043d\u044c\u0448\u0435. \u0412 \u0438\u0442\u043e\u0433\u0435 \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u043c\u043d\u043e\u0436\u0430\u0442\u044c \u043d\u0430 \u0434\u0432\u0430 \u2014 \u0440\u0435\u0448\u0438\u043b \u044f, \u043d\u0435 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0432\u0448\u0438\u0441\u044c \u0441 \u043f\u0440\u0438\u0447\u0438\u043d\u043e\u0439.<\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441, \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u044c\u0438, \u044f \u043f\u043e\u043d\u0438\u043c\u0430\u044e, \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0438\u0441\u0443\u0435\u0442 \u043d\u0435 \u0434\u0443\u0433\u0443, \u0430 \u043a\u0440\u0438\u0432\u0443\u044e \u0411\u0435\u0437\u044c\u0435. \u0418 \u043e\u043d\u0430 \u0441\u0442\u0440\u043e\u0438\u0442\u0441\u044f \u043d\u0435 \u0447\u0435\u0440\u0435\u0437 \u043a\u0440\u0430\u0439\u043d\u044e\u044e \u0442\u043e\u0447\u043a\u0443, \u0430 \u043f\u043e\u0441\u0435\u0440\u0435\u0434\u0438\u043d\u0435. \u0412\u043c\u0435\u0441\u0442\u043e Path \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Arc. \u0420\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0442\u043e\u0439 \u0436\u0435, \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u0435\u0437 \u0434\u043e\u043c\u043d\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 2.\u00a0<\/p>\n<details class=\"spoiler\">\n<summary>\u0412\u0435\u0441\u044c \u043a\u043e\u0434 \u043a\u043b\u0430\u0441\u0441\u0430 AppBarLayout<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">class RoundedAppBarLayout @JvmOverloads constructor(     context: Context,     attrs: AttributeSet? = null,     defStyleAttr: Int = 0 ) : AppBarLayout(context, attrs, defStyleAttr) {       private var appbarBottom = 0f     private var appbarHalfWidth = 0f       \/\/region toolbarArc     private val arcHeight = DimensUtils.convertDpToPixel(48f, context)     private val toolbarHeight =<\/code><\/pre>\n<\/div>\n<\/details>\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-392144","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/392144","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=392144"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/392144\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=392144"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=392144"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=392144"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}