{"id":311762,"date":"2020-10-20T15:01:09","date_gmt":"2020-10-20T15:01:09","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=311762"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=311762","title":{"rendered":"Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c: \u043a\u0430\u043a \u0441\u043e\u043a\u0440\u0430\u0442\u0438\u0442\u044c \u0432\u0440\u0435\u043c\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0441 \u043f\u0430\u0440\u044b \u043c\u0435\u0441\u044f\u0446\u0435\u0432 \u0434\u043e \u043d\u0435\u0434\u0435\u043b\u0438"},"content":{"rendered":"\n<div class=\"post__text post__text_v2\" id=\"post-content-body\" data-io-article-url=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/523916\/\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5a2\/4e6\/475\/5a24e6475d0214360b2205238e8be27a.jpg\" width=\"7917\" height=\"4184\"><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u0438\u0432\u0435\u0442, \u043c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0412\u043b\u0430\u0434 \u0428\u0438\u043f\u0443\u0433\u0438\u043d, \u044f Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 Redmadrobot. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0445\u043e\u0447\u0443 \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u0441\u044f \u043e\u043f\u044b\u0442\u043e\u043c \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0443\u0434\u043e\u0431\u043d\u043e\u0433\u043e UI Kit, \u043a\u0430\u043a \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438, \u0442\u0430\u043a \u0438 \u0434\u043b\u044f \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u0432. \u042f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u043f\u0440\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 Material Components \u0438 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 Vector Drawable. \u0422\u0430\u043a\u0436\u0435 \u0432\u044b \u0443\u0437\u043d\u0430\u0435\u0442\u0435, \u043a\u0430\u043a \u0431\u044b\u0441\u0442\u0440\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c edge-to-edge \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c Window Insets \u0438 \u043f\u043e\u0437\u043d\u0430\u043a\u043e\u043c\u0438\u0442\u0435\u0441\u044c \u0441 \u043c\u043e\u0435\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u043e\u0439 \u2014 <a href=\"https:\/\/github.com\/RedMadRobot\/edge-to-edge-decorator\"><u>edge-to-edge-decorator<\/u><\/a>.<\/p>\n<p>\u0413\u0434\u0435-\u0442\u043e \u043f\u043e\u043b\u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434 \u043c\u044b \u043d\u0430\u0447\u0430\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0434\u043b\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f <a href=\"https:\/\/play.google.com\/store\/apps\/details?id=ru.rt.key\"><u>\u00ab\u0420\u043e\u0441\u0442\u0435\u043b\u0435\u043a\u043e\u043c \u041a\u043b\u044e\u0447\u00bb<\/u><\/a>. \u041d\u0430\u0448\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0443\u0436\u0435 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/510164\/\"><u>\u043f\u0438\u0441\u0430\u043b\u0438<\/u><\/a> \u043f\u0440\u043e \u0446\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u043a\u0430\u043a \u0435\u0451 \u0441\u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0443 \u0440\u0430\u0441\u0441\u043a\u0430\u0437 \u043e\u0442 \u043b\u0438\u0446\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u0441 \u043a\u0430\u043a\u0438\u043c\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438 \u043c\u044b \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u043f\u043e\u0447\u0435\u043c\u0443 \u044d\u0442\u043e \u0437\u0430\u043d\u044f\u043b\u043e \u0443 \u043d\u0430\u0441 3 \u043c\u0435\u0441\u044f\u0446\u0430 \u0438 \u043a\u0430\u043a \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443 \u0432\u0441\u0435\u0433\u043e \u0437\u0430 \u043e\u0434\u043d\u0443 \u043d\u0435\u0434\u0435\u043b\u044e.<\/p>\n<p>\u042d\u0442\u043e\u0439 \u043e\u0441\u0435\u043d\u044c\u044e Android 10 \u0438\u0441\u043f\u043e\u043b\u043d\u0438\u043b\u0441\u044f \u0433\u043e\u0434, \u0438 \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f, \u0447\u0442\u043e\u0431\u044b \u0438\u0437\u0443\u0447\u0438\u0442\u044c \u0432\u0441\u0435 \u043d\u043e\u0432\u0438\u043d\u043a\u0438, \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u0438 \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u0431\u0443\u0434\u0435\u0442 \u0436\u0438\u0432\u043e\u0439 \u043e\u043f\u044b\u0442 \u0438\u0437 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432.<\/p>\n<p>\u041d\u0435 \u0432\u0430\u0436\u043d\u043e, \u0434\u0430\u0432\u043d\u043e \u043b\u0438 \u0432\u044b \u043d\u0430\u0447\u0430\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043f\u043e\u0434 Android \u0438\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u0435\u043b\u0430\u0435\u0442\u0435 \u0432\u0430\u0448\u0435 \u043f\u0435\u0440\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u0434\u0443\u043c\u0430\u044e, \u0432\u0430\u043c \u0431\u0443\u0434\u0435\u0442 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432 \u043d\u0435\u0439 \u044f \u043f\u043e\u0434\u0435\u043b\u0438\u043b\u0441\u044f \u0432\u0441\u0435\u043c \u043d\u0430\u043a\u043e\u043f\u043b\u0435\u043d\u043d\u044b\u043c \u043e\u043f\u044b\u0442\u043e\u043c \u0438 \u0441\u0430\u043c\u044b\u043c \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u043e\u0432 \u043f\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0443 Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439.<\/p>\n<h2>\u041a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u0439 UI Kit<\/h2>\n<p>\u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u0443 \u043d\u0430\u0441 \u0431\u044b\u043b \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u043f\u043b\u0430\u043d: \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0434\u0435\u043b\u0430\u044e\u0442 \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443, \u0430 \u043c\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0444\u0430\u0439\u043b <em>value-night\/color.xml<\/em> \u0438 \u0432\u0441\u0451. \u041d\u043e \u043f\u043e\u0437\u0436\u0435 \u043c\u044b \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438. \u0418 \u0442\u0435\u043f\u0435\u0440\u044c, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u0430\u0432\u043d\u043e \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043d\u043e \u0432 \u0441\u0442\u043e\u0440\u0435, \u044f \u043c\u043e\u0433\u0443 \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c \u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0438 \u044d\u0442\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c, \u0447\u0442\u043e\u0431\u044b \u0432\u044b \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u043d\u0430\u0441\u0442\u0443\u043f\u0430\u043b\u0438 \u043d\u0430 \u043d\u0430\u0448\u0438 \u0433\u0440\u0430\u0431\u043b\u0438.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21161: \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u0438 \u0432\u044b\u0431\u043e\u0440\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0439 \u0434\u043b\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432<\/h3>\n<p>\u041f\u0435\u0440\u0432\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432 \u2014 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u043a\u0430\u043a \u0435\u0441\u0442\u044c: \u201crealblue\u201d, \u201cdarkgrey\u201d \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/926\/efc\/71e\/926efc71ebec4455d9bec0a30b668a18\" alt=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin\" title=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin\" width=\"1600\" height=\"970\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin<\/figcaption><\/figure>\n<p>\u0414\u0443\u043c\u0430\u044e, \u043a\u0430\u0436\u0434\u044b\u0439 \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u0442\u0430\u043a\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430, \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c, \u043f\u0440\u0438 \u0440\u0435\u0434\u0438\u0437\u0430\u0439\u043d\u0435, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0441\u044f, \u0447\u0442\u043e \u201crealblue\u201d \u043c\u0435\u043d\u044f\u0435\u0442 \u0441\u0432\u043e\u0439 hex \u043d\u0430 hex \u043a\u0440\u0430\u0441\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430 \u0438\u043b\u0438 \u0436\u0451\u043b\u0442\u043e\u0433\u043e. \u042d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c, \u0435\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0432\u043e \u0432\u0441\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438, \u043d\u043e \u0442\u043e\u0433\u0434\u0430 \u0432\u043e\u0437\u0440\u0430\u0441\u0442\u0430\u0435\u0442 \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c \u043e\u0448\u0438\u0431\u0438\u0442\u044c\u0441\u044f, \u0430 \u043e\u0442\u043b\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 \u043a\u0440\u0430\u0439\u043d\u0435 \u0442\u044f\u0436\u0435\u043b\u043e.<\/p>\n<p>\u0412\u0442\u043e\u0440\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u044d\u0442\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f, \u043c\u044b \u0440\u0435\u0448\u0438\u043b\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c C1, C2 (\u0421 \u2014 \u043e\u0442 \u0441\u043b\u043e\u0432\u0430 Color) \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435. \u042d\u0442\u0430 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0446\u0438\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0442\u0432\u044f\u0437\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u043e\u0442 \u0435\u0433\u043e \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f. \u0421\u0435\u0433\u043e\u0434\u043d\u044f \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043a\u0440\u0430\u0441\u043d\u044b\u0439, \u0430 \u043f\u043e\u0442\u043e\u043c \u0436\u0435\u043b\u0442\u044b\u0439 \u2014 \u044d\u0442\u043e \u043d\u0435 \u0432\u0430\u0436\u043d\u043e, \u0438 \u0432\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u0442\u044c \u0432\u0441\u0451 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1dd\/600\/266\/1dd60026607a9e23fc8d3f8613332a17\" alt=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin\" title=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin\" width=\"1600\" height=\"1105\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin<\/figcaption><\/figure>\n<p>\u041d\u043e \u0442\u0443\u0442 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u0440\u0443\u0433\u0430\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u2014 \u0442\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u0448\u044c \u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0442\u0430\u0431\u043b\u0438\u0446\u0443 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0439 \u0446\u0432\u0435\u0442\u043e\u0432 \u0432 \u0433\u043e\u043b\u043e\u0432\u0435. \u041f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u0441\u0451 \u0432\u0440\u0435\u043c\u044f \u0435\u0451 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c: \u043f\u0440\u0438 \u043e\u0431\u0441\u0443\u0436\u0434\u0435\u043d\u0438\u0438 \u0441 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u043c \u0438\u043b\u0438 \u043f\u0440\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u2014 \u0432\u0441\u0435\u0433\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0420\u0435\u0434\u043a\u043e, \u043a\u043e\u0433\u0434\u0430 \u0443\u0434\u0430\u0435\u0442\u0441\u044f \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u0443\u044e \u0446\u0438\u0444\u0440\u0443 \u0446\u0432\u0435\u0442\u0430. \u00ab\u041a\u0430\u043a\u043e\u0439 \u0442\u0443\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0446\u0432\u0435\u0442: \u04214 \u0438\u043b\u0438 \u04217?\u00bb \u2014 \u0441\u0442\u0430\u043d\u0435\u0442 \u0441\u0430\u043c\u044b\u043c \u0447\u0430\u0441\u0442\u044b\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u043c \u043d\u0430 \u043e\u0431\u0441\u0443\u0436\u0434\u0435\u043d\u0438\u044f\u0445 \u0434\u0438\u0437\u0430\u0439\u043d\u0430. \u041c\u044b \u0434\u043e\u043b\u0433\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043f\u044b\u0442\u0430\u043b\u0438\u0441\u044c \u043d\u0430\u0439\u0442\u0438 \u0431\u0430\u043b\u0430\u043d\u0441 \u043c\u0435\u0436\u0434\u0443 \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435\u043c \u0446\u0432\u0435\u0442\u0430, \u0442\u0430\u043a\u0438\u043c \u043a\u0430\u043a \u201crealblue\u201d \u0438 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u044b \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430 \u0438 \u0440\u0435\u0434\u0438\u0437\u0430\u0439\u043d\u0430: \u04211, C2, C3 \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435.<\/p>\n<p>\u0415\u0441\u0442\u044c \u0438 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439, \u0442\u0440\u0435\u0442\u0438\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u043a\u043e\u0433\u0434\u0430 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432 \u0437\u0430\u0432\u0438\u0441\u044f\u0442 \u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u2014 \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0433\u0430\u0439\u0434\u043b\u0430\u0439\u043d\u044b Material Design \u0438\u043b\u0438 Apple HIG.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/787\/129\/42d\/78712942def7b75f8d133114c96af851\" alt=\"material.io\" title=\"material.io\" width=\"1600\" height=\"1446\"><figcaption>material.io<\/figcaption><\/figure>\n<p>\u042d\u0442\u043e\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043a\u0430\u0437\u0430\u043b\u0441\u044f \u0441\u0430\u043c\u044b\u043c \u043b\u043e\u0433\u0438\u0447\u043d\u044b\u043c, \u043d\u043e \u0432 \u043d\u0451\u043c \u0431\u044b\u043b\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u0441\u0435\u0433\u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c:<\/p>\n<ol>\n<li>\n<p>\u0426\u0432\u0435\u0442\u0430 \u0434\u0430\u0451\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440. \u0418 \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0449\u0438\u043c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430\u043c \u0441\u043b\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u044b\u0432\u0430\u0442\u044c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432, \u0430 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0432\u0441\u0435\u0433\u0434\u0430 \u0430\u0440\u0442-\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0430 \u0434\u043b\u044f \u0442\u0430\u043a\u043e\u0439 \u043c\u0435\u043b\u043e\u0447\u0438 \u043d\u0435\u0432\u044b\u0433\u043e\u0434\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0446\u0432\u0435\u0442\u0430 \u043c\u043e\u0433\u0443\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u0439 hex. \u0412 \u0446\u0435\u043b\u043e\u043c, \u0432 \u044d\u0442\u043e\u043c \u043d\u0435\u0442 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043d\u043e \u043a\u0430\u043a \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0432 \u043f\u0430\u043b\u0438\u0442\u0440\u0435 \u0446\u0432\u0435\u0442\u043e\u0432 Zeplin \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c\u0441\u044f \u0434\u0432\u0430 \u0446\u0432\u0435\u0442\u0430 \u0441 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u043c hex, \u043d\u043e \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0438\u0442\u044c \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438 Material Design \u0438 Apple HIG \u0432 \u043e\u0434\u043d\u0443 \u043f\u0430\u043b\u0438\u0442\u0440\u0443, \u0434\u0430 \u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0434\u043b\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ol>\n<p>\u041c\u043d\u043e\u0433\u043e \u0432\u0441\u0442\u0440\u0435\u0447 \u043f\u0440\u043e\u0448\u043b\u043e \u0437\u0430 \u043e\u0431\u0441\u0443\u0436\u0434\u0435\u043d\u0438\u0435\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0439 \u0446\u0432\u0435\u0442\u043e\u0432. \u041e\u043d\u0438 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u043b\u0438 \u0431\u044b\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u043c\u0438 \u0434\u043b\u044f \u0432\u0441\u0435\u0445: Android- \u0438 iOS-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u0432. \u0427\u0435\u0440\u0435\u0437 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043c\u044b \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b\u0438\u0441\u044c \u043d\u0430 \u0442\u0440\u0435\u0442\u044c\u0435\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435, \u043d\u043e \u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0447\u0451\u0442\u043a\u0438\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u043f\u043e \u043d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044e \u0446\u0432\u0435\u0442\u043e\u0432, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0442\u0440\u0430\u0442\u0438\u0442\u044c \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043f\u0440\u0438\u0434\u0443\u043c\u044b\u0432\u0430\u043d\u0438\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f. \u0422\u0430\u043a\u0436\u0435 \u043c\u044b \u0434\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043b\u0438\u0441\u044c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0446\u0432\u0435\u0442\u0430 \u0441 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u043c hex \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u043c\u0441\u044f \u043d\u0430 \u0435\u0434\u0438\u043d\u0438\u0446\u0443.<\/p>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"center\"><strong>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>iOS<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>Android<\/strong><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>text\/primary<\/p>\n<\/td>\n<td>\n<p>textPrimary<\/p>\n<\/td>\n<td>\n<p>text_primary<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>button\/pressed<\/p>\n<\/td>\n<td>\n<p>buttonPressed<\/p>\n<\/td>\n<td>\n<p>button_pressed<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0438\u0437 Zeplin:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2cd\/c84\/436\/2cdc84436c520972255600bfe771653a\" alt=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0438\u0437 Zeplin\" title=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0438\u0437 Zeplin\" width=\"1600\" height=\"1453\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0438\u0437 Zeplin<\/figcaption><\/figure>\n<p>\u041f\u043e\u0437\u0436\u0435 \u043c\u044b \u043e\u0442\u043a\u0430\u0437\u0430\u043b\u0438\u0441\u044c \u043e\u0442 Zeplin \u0438 \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043d\u0430 Figma. \u0412\u043e\u0442 \u0442\u0430\u043a\u0430\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u0430 \u0432 Figma \u0443 \u043d\u0430\u0441 <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A39419\"><u>\u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0430\u0441\u044c<\/u><\/a>. \u0410 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043f\u0440\u043e \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u0441 Zeplin \u043d\u0430 Figma \u0443\u0436\u0435 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/514118\/\"><u>\u043f\u0438\u0441\u0430\u043b<\/u><\/a> \u043d\u0430\u0448 iOS \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0414\u0430\u043d\u0438\u0438\u043b \u0421\u0443\u0431\u0431\u043e\u0442\u0438\u043d <a class=\"mention\" href=\"\/users\/subdan\">@subdan<\/a> \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u0440\u043e \u0443\u0442\u0438\u043b\u0438\u0442\u0443 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0430 UI Kit \u0438\u0437 Figma \u2014 <a href=\"https:\/\/github.com\/RedMadRobot\/figma-export\"><u>figma-export<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21162: \u043d\u0435\u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0435 \u0441\u0442\u0438\u043b\u0438 \u0448\u0440\u0438\u0444\u0442\u043e\u0432<\/h3>\n<p>\u041e\u0441\u043e\u0431\u044b\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441\u043e \u0448\u0442\u0438\u0444\u0442\u043e\u0432\u044b\u043c\u0438 \u0441\u0442\u0438\u043b\u044f\u043c\u0438 \u0443 \u043d\u0430\u0441 \u043d\u0435 \u0431\u044b\u043b\u043e. \u0414\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043e\u0431\u044b\u0447\u043d\u043e \u0437\u0430\u043d\u043e\u0441\u044f\u0442 \u0432\u0441\u0435 \u0448\u0440\u0438\u0444\u0442\u043e\u0432\u044b\u0435 \u0441\u0442\u0438\u043b\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0432 UI Kit, \u043d\u043e \u0438\u0445 \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043d\u0435 \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u0443\u0435\u0442, \u0447\u0442\u043e \u0432 \u043c\u0430\u043a\u0435\u0442\u0430\u0445 \u0431\u0443\u0434\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u043d\u0438. \u041f\u0435\u0440\u0438\u043e\u0434\u0438\u0447\u0435\u0441\u043a\u0438 \u0442\u043e \u0442\u0430\u043c, \u0442\u043e \u0442\u0443\u0442, Zeplin \u043d\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u043b \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0439 \u0448\u0440\u0438\u0444\u0442 \u0438 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u043b\u043e\u0441\u044c \u043e\u0442\u0432\u043b\u0435\u043a\u0430\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430, \u0447\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c \u043a\u0430\u043a\u043e\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0448\u0440\u0438\u0444\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c.<\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u0432 \u043c\u0430\u043a\u0435\u0442\u0430\u0445 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u0438\u043b\u0438 \u0448\u0440\u0438\u0444\u0442\u043e\u0432. \u0414\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0434\u043e\u0431\u0438\u043b\u0438\u0441\u044c \u044d\u0442\u043e\u0433\u043e \u0437\u0430 \u0441\u0447\u0451\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430 \u0441\u043e Sketch + Zeplin \u043d\u0430 Figma \u2014 \u043e\u043d\u0430 \u043b\u0443\u0447\u0448\u0435 \u0440\u0430\u0441\u043f\u043e\u0437\u043d\u0430\u0435\u0442 \u0448\u0440\u0438\u0444\u0442\u043e\u0432\u044b\u0435 \u0441\u0442\u0438\u043b\u0438.&nbsp;<\/p>\n<p>\u0414\u0430, \u0438\u043d\u043e\u0433\u0434\u0430 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u044e\u0442\u0441\u044f, \u043d\u043e \u044d\u0442\u043e \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043a\u0440\u0430\u0439\u043d\u0435 \u0440\u0435\u0434\u043a\u043e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432\u0441\u0435 \u0448\u0440\u0438\u0444\u0442\u044b \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u043d\u044b \u0432 \u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 \u0438 UI Kit. \u042d\u0442\u043e \u0443\u0436\u0435 \u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u0432. \u0415\u0441\u043b\u0438 \u044f \u043d\u0430\u0445\u043e\u0434\u0438\u043b \u043e\u0448\u0438\u0431\u043a\u0443, \u0442\u043e \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u043b \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0439 \u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0432\u0441\u0451 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u044f\u043b.&nbsp;<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430\u0448\u0438\u0445 \u0448\u0440\u0438\u0444\u0442\u043e\u0432\u044b\u0445 \u0441\u0442\u0438\u043b\u0435\u0439 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A39912\"><u>\u0442\u0443\u0442<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21163: \u0434\u0443\u0431\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0438\u043a\u043e\u043d\u043e\u043a \u0438 \u0442\u0440\u0443\u0434\u043d\u043e\u0441\u0442\u0438 \u0441 \u0438\u0445 \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0435\u043c<\/h3>\n<p>\u041f\u043e\u043a\u0430 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u044b\u0432\u0430\u043b\u0438 \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432, \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0441 \u043d\u043e\u0432\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439 \u2014 \u0438\u043a\u043e\u043d\u043a\u0438 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c \u0442\u0435\u043c\u044b. \u0421\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u044d\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0438\u043a\u043e\u043d\u043e\u043a \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e <em>drawable-night<\/em>. \u041d\u043e \u0437\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0443 \u043d\u0443\u0436\u043d\u043e \u043f\u043b\u0430\u0442\u0438\u0442\u044c:<\/p>\n<ol>\n<li>\n<p>\u041a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0438\u043a\u043e\u043d\u043e\u043a \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u0434\u0432\u0430 \u0440\u0430\u0437\u0430, \u0430 \u0437\u043d\u0430\u0447\u0438\u0442, \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432\u0435\u0441\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435. \u0418 App Bundle \u043d\u0435 \u043f\u043e\u043c\u043e\u0436\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0442\u0435\u043c\u0430 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u0438 \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0434\u043e\u043b\u0436\u043d\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u0438\u0442\u043e\u0433\u043e\u0432\u043e\u043c APK.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0438\u043a\u043e\u043d\u043e\u043a \u0440\u0430\u0437\u043d\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432 \u0434\u043e\u043b\u0436\u043d\u044b \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u0442\u044c. \u0415\u0441\u043b\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u043e\u043f\u0435\u0447\u0430\u0442\u0430\u043b\u0441\u044f \u0438\u043b\u0438 \u0438\u0437\u043c\u0435\u043d\u0438\u043b \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435, \u0442\u043e \u0432\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0435 \u043d\u043e\u0432\u0443\u044e \u0438\u043a\u043e\u043d\u043a\u0443 \u0440\u044f\u0434\u043e\u043c, \u0430 \u043d\u0435 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u0435 \u0441\u0442\u0430\u0440\u0443\u044e. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0438\u0441\u043a\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443 \u043f\u0440\u0438\u0434\u0435\u0442\u0441\u044f \u0432\u0440\u0443\u0447\u043d\u0443\u044e, \u0430 \u044d\u0442\u043e \u0441\u043b\u043e\u0436\u043d\u043e \u0438 \u0434\u043e\u043b\u0433\u043e.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0441\u0435\u0433\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043f\u0440\u043e \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0435 \u0446\u0432\u0435\u0442\u0430 \u0438\u043a\u043e\u043d\u043e\u043a. \u0415\u0441\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0448\u044c \u043d\u043e\u0432\u0443\u044e \u0438\u043a\u043e\u043d\u043a\u0443, \u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0432\u0441\u0435\u0433\u0434\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0435\u0451 \u0434\u043b\u044f \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u0438 \u043d\u0430 \u0440\u0430\u043d\u043d\u0435\u043c \u044d\u0442\u0430\u043f\u0435 \u043c\u044b \u043e\u0431 \u044d\u0442\u043e\u043c \u0447\u0430\u0441\u0442\u043e \u0437\u0430\u0431\u044b\u0432\u0430\u043b\u0438<\/p>\n<\/li>\n<\/ol>\n<p>\u042d\u0442\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b \u0438 \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043c\u0435\u043d\u044f \u0441\u0440\u0430\u0437\u0443 \u043d\u0435 \u0443\u0441\u0442\u0440\u043e\u0438\u043b. \u041f\u043e\u0437\u0436\u0435 \u044f \u043d\u0430\u0442\u043a\u043d\u0443\u043b\u0441\u044f \u043d\u0430 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438 Google \u0438 Apple. \u041e\u043d\u0438 \u0441\u043e\u0432\u0435\u0442\u0443\u044e\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430: \u0447\u0435\u0440\u043d\u043e\u0433\u043e \u0438\u043b\u0438 \u0431\u0435\u043b\u043e\u0433\u043e, \u0438 \u043f\u0435\u0440\u0435\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0438\u0445 \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0432 \u0440\u0430\u043d\u0442\u0430\u0439\u043c\u0435.&nbsp;<\/p>\n<p>\u041c\u044b \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0438\u043a\u043e\u043d\u043a\u0438 \u0431\u0435\u043b\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u043d\u043e \u043f\u043e\u0442\u043e\u043c \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438 \u0438\u0445 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438. \u0412 Figma \u043c\u044b \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u043b\u0438 \u0438\u0445 \u043d\u0430 \u0447\u0435\u0440\u043d\u044b\u0439 \u0444\u043e\u043d, \u0430 \u0432\u043e\u0442 \u0432 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u0447\u0435\u0440\u043d\u044b\u0439 \u0444\u043e\u043d \u0435\u0441\u0442\u044c \u043d\u0435 \u0432\u0435\u0437\u0434\u0435, \u0438 \u0438\u043a\u043e\u043d\u043e\u043a \u0431\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0435 \u0432\u0438\u0434\u043d\u043e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043d\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0447\u0435\u0440\u043d\u044b\u0445 \u0438\u043a\u043e\u043d\u043e\u043a.<\/p>\n<p>\u0415\u0449\u0451 \u043e\u0434\u043d\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u2014 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0438\u043a\u043e\u043d\u043e\u043a \u043f\u0440\u0438\u0434\u0443\u043c\u044b\u0432\u0430\u044e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0438 \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u043d\u0438 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u044e\u0442 \u0441 \u0445\u043e\u0434\u043e\u043c \u043c\u044b\u0441\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432: \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043d\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0438\u043a\u043e\u043d\u043a\u0443 \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0435\u0439, \u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u044b\u0432\u0430\u044e\u0442 \u0438\u043a\u043e\u043d\u043a\u0438 \u0443 \u0441\u0435\u0431\u044f \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435.&nbsp;<\/p>\n<p>\u0415\u0449\u0451 \u0431\u044b\u0432\u0430\u044e\u0442 \u043c\u043e\u043c\u0435\u043d\u0442\u044b, \u043a\u043e\u0433\u0434\u0430 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0441\u0430\u043c \u0440\u0435\u0448\u0430\u0435\u0442 \u043f\u043e\u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0438 \u0437\u0430\u0431\u044b\u0432\u0430\u0435\u0442 \u0441\u043e\u043e\u0431\u0449\u0438\u0442\u044c \u043e\u0431 \u044d\u0442\u043e\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c. \u0412\u0441\u0435 \u044d\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043f\u0440\u0438\u0432\u043e\u0434\u044f\u0442 \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u0438\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438 \u0438\u043a\u043e\u043d\u043e\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f \u0434\u0443\u0431\u043b\u0435\u0440 \u0438\u043a\u043e\u043d\u043a\u0438, \u043d\u043e \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435\u043c. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043f\u0440\u0438\u0434\u0435\u0442\u0441\u044f \u043f\u043e\u0442\u0440\u0430\u0442\u0438\u0442\u044c \u043d\u0430 \u043f\u043e\u0438\u0441\u043a\u0438 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u0445 \u0438\u043a\u043e\u043d\u043e\u043a.&nbsp;<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u0442\u0430\u043a\u043e\u0433\u043e \u043d\u0435 \u0431\u044b\u043b\u043e, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0441\u0440\u0430\u0437\u0443 \u0434\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u0442\u044c\u0441\u044f \u043e \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u043c \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0438 \u0438\u043a\u043e\u043d\u043e\u043a. \u041c\u044b \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b\u0438\u0441\u044c \u043d\u0430 \u0442\u0430\u043a\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435:&nbsp;<\/p>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"center\"><strong>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0438\u043a\u043e\u043d\u043a\u0438<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>iOS<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>Android<\/strong><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>ic\/24\/flash_on<\/p>\n<\/td>\n<td>\n<p>ic24flashOn<\/p>\n<\/td>\n<td>\n<p>ic_24_flash_on<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>ic\/24\/flash_off<\/p>\n<\/td>\n<td>\n<p>ic24flashOff<\/p>\n<\/td>\n<td>\n<p>ic_24_flash_off<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0441 \u043d\u0430\u0448\u0438\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u0438\u043a\u043e\u043d\u043e\u043a \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A39960\"><u>\u0437\u0434\u0435\u0441\u044c<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21164: \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439<\/h3>\n<p>\u041f\u0435\u0440\u0435\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0438\u043a\u043e\u043d\u043a\u0438 \u0443\u0434\u043e\u0431\u043d\u043e, \u043d\u043e \u0435\u0441\u043b\u0438 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043e\u0434\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u0442\u043e \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043d\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u044e \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430 \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e drawable-night \u0438 \u043f\u043e\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430 \u043f\u043e\u0434\u0433\u043e\u0442\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u043e\u0439 \u0442\u0435\u043c\u0435.<\/p>\n<p>\u0423 \u043d\u0430\u0441 \u0431\u044b\u043b\u0438 \u0441\u043b\u0443\u0447\u0430\u0438, \u043a\u043e\u0433\u0434\u0430 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439 \u043d\u0435 \u0445\u0432\u0430\u0442\u0430\u043b\u043e \u0438\u043b\u0438 \u043e\u043d\u0438 \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043b\u0438\u0441\u044c \u043a\u0440\u0438\u0432\u043e. \u0427\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043e\u043a, \u043c\u044b \u0441\u043e\u0431\u0440\u0430\u043b\u0438 \u0432\u0441\u0435 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 \u043e\u0434\u043d\u043e\u043c \u0443\u0434\u043e\u0431\u043d\u043e\u043c \u0434\u043b\u044f QA \u043c\u0435\u0441\u0442\u0435, \u0438 \u0432\u043a\u043b\u044e\u0447\u0438\u043b\u0438 \u0438\u0445 \u0432 \u0440\u0443\u0447\u043d\u043e\u0435 \u0440\u0435\u0433\u0440\u0435\u0441\u0441\u0438\u043e\u043d\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435. \u041f\u043e\u0437\u0436\u0435 \u044d\u0442\u043e\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442\u043d\u043e\u0433\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A40305\"><u>\u043f\u043e\u043b\u0443\u0447\u0438\u043b\u043e\u0441\u044c<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21165: \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438\u043b\u0438 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0435 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435<\/h3>\n<p>\u041f\u0440\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u0435\u043b\u0430\u0435\u0442 \u044d\u043a\u0440\u0430\u043d\u044b, \u0430 \u043f\u043e\u0442\u043e\u043c \u043f\u0435\u0440\u0435\u043d\u043e\u0441\u0438\u0442 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 UI Kit. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043d\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0443\u0434\u0435\u043b\u044f\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0435\u0439 \u043f\u0440\u0438 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0438 \u044d\u0442\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u0412 UI Kit \u043c\u043e\u0433\u0443\u0442 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u0432\u0441\u0442\u0440\u0435\u0442\u0438\u0442\u044c \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u044d\u043a\u0440\u0430\u043d\u043e\u0432. \u0422\u0430\u043a\u043e\u0439 UI Kit \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u0435\u043f\u043e\u043b\u043d\u044b\u043c, \u0438 \u0435\u0441\u043b\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0441\u0440\u0430\u0437\u0443 \u043d\u0435 \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u0445\u043e\u0440\u043e\u0448\u0438\u0439 UI Kit, \u0442\u043e \u043f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0442\u043e\u0442 \u0438 \u0432\u043e\u0432\u0441\u0435 \u043f\u0435\u0440\u0435\u0441\u0442\u0430\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c\u0441\u044f.&nbsp;<\/p>\n<blockquote>\n<p>\u041f\u0440\u0438 \u0434\u0430\u043d\u043d\u043e\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u0435 UI Kit \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0435\u0434\u0438\u043d\u044b\u043c \u00ab\u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u043c \u043f\u0440\u0430\u0432\u0434\u044b\u00bb. \u041c\u043e\u0436\u043d\u043e \u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u2014 \u044d\u0442\u043e UI Kit \u0434\u043b\u044f \u00ab\u0433\u0430\u043b\u043e\u0447\u043a\u0438\u00bb, \u0438 \u0442\u0430\u043a \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0435\u043b\u044c\u0437\u044f.<\/p>\n<\/blockquote>\n<p>\u041d\u043e \u043a\u0430\u043a \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u0438\u0437\u0430\u0439\u043d-\u043c\u0430\u043a\u0435\u0442\u044b \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443, \u0442\u043e \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c \u00ab\u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u043c \u043f\u0440\u0430\u0432\u0434\u044b\u00bb \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u0442\u0430\u0442\u044c UI Kit \u0438 <a href=\"https:\/\/medium.com\/figma-design\/components-in-figma-e7e80fcf6fd2\"><u>\u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b<\/u><\/a> \u0432 \u043d\u0435\u043c. \u0418\u043d\u0430\u0447\u0435 UI Kit \u0431\u0443\u0434\u0435\u0442 \u0432\u0430\u043c \u043c\u0435\u0448\u0430\u0442\u044c \u0438 \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443, \u0430 \u043d\u0435 \u0443\u0441\u043a\u043e\u0440\u044f\u0442\u044c \u0435\u0451.<\/p>\n<p>\u0426\u0435\u043d\u043d\u043e\u0441\u0442\u044c UI Kit \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0432\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0435 \u0432\u0441\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u0430 \u043f\u043e\u0442\u043e\u043c \u0438\u0437 \u044d\u0442\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0435 \u044d\u043a\u0440\u0430\u043d\u044b. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 Figma, \u0438 styles \u0438\u043b\u0438 CustomViews \u0432 Android. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 UI Kit \u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u043c \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0430 \u043f\u043e\u043b\u043d\u044b\u0439 UI Kit \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A28502\"><u>\u0442\u0443\u0442<\/u><\/a>.&nbsp;<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b6c\/dde\/848\/b6cdde848cf441f4b63f1a3b80a99322\" alt=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\" title=\"\u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\" width=\"1600\" height=\"966\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/figcaption><\/figure>\n<h2>\u041a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c UI Kit<\/h2>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430\u043c\u0438 UI Kit \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0442\u044c\u0441\u044f \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c. \u041c\u043e\u0439 \u043f\u043b\u0430\u043d \u043f\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 UI Kit \u0441 \u0443\u0447\u0435\u0442\u043e\u043c \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0431\u044b\u043b \u0442\u0430\u043a\u043e\u0439:<\/p>\n<ol>\n<li>\n<p>\u041f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u0446\u0432\u0435\u0442\u0430, \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0432 \u043f\u043e\u0440\u044f\u0434\u043e\u043a.<\/p>\n<ul>\n<li>\n<p>\u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432 (<em>color.xml<\/em>);<\/p>\n<\/li>\n<li>\n<p>\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p>\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442 \u0431\u0430\u0437\u043e\u0432\u043e\u0439 \u0442\u0435\u043c\u044b.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0417\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u043d\u0430 \u0447\u0435\u0440\u043d\u044b\u0439 \u0438 \u043e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0438\u0445 \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0435 \u0446\u0432\u0435\u0442\u0430 <em>values-night\/color.xml<\/em>.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432\u044b\u0431\u043e\u0440 \u0442\u0435\u043c\u044b \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ol>\n<p>\u042f \u0443\u0436\u0435 \u043f\u0438\u0441\u0430\u043b \u0432\u044b\u0448\u0435 \u043f\u0440\u043e \u0443\u0442\u0438\u043b\u0438\u0442\u0443 <a href=\"https:\/\/github.com\/RedMadRobot\/figma-export\"><u>Figma-export<\/u><\/a> \u0438 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/523096\/\"><u>\u0441\u0442\u0430\u0442\u044c\u044e<\/u><\/a><u>,<\/u> \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u044b \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0441\u0442\u0438 \u0435\u0451 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438. \u042d\u0442\u0430 \u0443\u0442\u0438\u043b\u0438\u0442\u0430 \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u043e\u043c \u0446\u0432\u0435\u0442\u043e\u0432, \u0438\u043a\u043e\u043d\u043e\u043a \u0438 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439 \u0438\u0437 Figma. \u0421 \u0435\u0451 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u044d\u043a\u0441\u043f\u043e\u0440\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0447\u0435\u043b\u043e\u0432\u0435\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u0430\u043a\u0442\u043e\u0440 \u0438\u0437 \u044d\u0442\u043e\u0433\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430.&nbsp;<\/p>\n<h3>\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432<\/h3>\n<p>\u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e Figma-export \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043e\u0434\u043d\u043e\u0439 \u043a\u043e\u043c\u0430\u043d\u0434\u043e\u0439:<\/p>\n<pre><code class=\"bash\">.\/figma-export colors -i figma-export.yaml<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0441\u044f \u0438\u043b\u0438 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u0441\u044f \u0444\u0430\u0439\u043b color.xml.<\/p>\n<h3>\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h3>\n<p>\u0414\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0435\u043c\u044b \u0432 Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 \u201c<a href=\"https:\/\/github.com\/material-components\/material-components-android\"><u>material-components<\/u><\/a>\u201d. \u0418\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a \u044f \u0438 \u043f\u043e\u0441\u0442\u0443\u043f\u0438\u043b: \u0441\u043e\u0437\u0434\u0430\u043b \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432 \u0432 <em>color.xml<\/em> \u0438 \u043d\u0430\u0447\u0430\u043b \u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041d\u043e \u043f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439 \u2014 <code>toolbar<\/code>, cardview \u0438 \u0435\u0449\u0451 \u043f\u0430\u0440\u0443 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438\u043c\u0435\u043b\u0438 \u043d\u0435 \u0442\u043e\u0442 \u0446\u0432\u0435\u0442.<\/p>\n<blockquote>\n<p>\u041f\u0440\u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u0432\u0441\u0435 \u0446\u0432\u0435\u0442\u0430 \u043f\u043e \u043c\u0435\u0441\u0442\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430 \u043c\u043d\u0435 \u043f\u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c \u043f\u043b\u043e\u0445\u0438\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u2014 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u043c\u043d\u043e\u0433\u043e \u0434\u0443\u0431\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<\/blockquote>\n<p>\u041d\u0430 \u0442\u043e\u0442 \u043c\u043e\u043c\u0435\u043d\u0442, \u0432 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0435 \u201cmaterial-components\u201d, \u0435\u0449\u0451 \u043d\u0435 \u0431\u044b\u043b\u043e \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u043f\u043e \u0442\u0435\u043c\u0430\u043c \u0438 \u0441\u0442\u0438\u043b\u044f\u043c. \u041a\u0430\u043a \u0438 \u043c\u043d\u043e\u0433\u0438\u0435 Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438, \u044f \u043d\u0435 \u0437\u043d\u0430\u043b, \u043a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0438\u0437 Google \u0434\u0430\u0436\u0435 <a href=\"https:\/\/www.youtube.com\/watch?v=Owkf8DhAOSo&amp;feature=youtu.be&amp;t=99\"><u>\u0448\u0443\u0442\u0438\u043b\u0438<\/u><\/a> \u043f\u0440\u043e \u044d\u0442\u043e \u043d\u0430 Android Dev Summit 2019.&nbsp;<\/p>\n<p>\u041c\u043e\u044f \u0442\u0435\u043c\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0431\u044b\u043b\u0430 \u043e\u043f\u0438\u0441\u0430\u043d\u0430 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0438 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a \u043a\u043d\u043e\u043f\u043a\u0438, \u0438\u043a\u043e\u043d\u043a\u0438 \u0438 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0435 \u043f\u043e\u043b\u044f, \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u043b\u0438 \u043d\u0435 \u0442\u0430\u043a, \u043a\u0430\u043a \u044f \u043f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u043b. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0446\u0432\u0435\u0442 <code>toolbar<\/code> \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0446\u0432\u0435\u0442 primary \u0434\u043b\u044f \u0441\u0432\u0435\u0442\u043b\u043e\u0439 \u0442\u0435\u043c\u044b \u0438, \u043f\u043e\u0447\u0435\u043c\u0443-\u0442\u043e, \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u043b\u0441\u044f \u043d\u0430 <code>surface<\/code> \u0432 \u0442\u0435\u043c\u043d\u043e\u0439.<\/p>\n<p>\u041f\u043e\u0437\u0436\u0435 \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0447\u0442\u043e \u0432 \u0442\u0435\u043c\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0446\u0432\u0435\u0442 <code>toolbar<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u0440\u0430\u0432\u043d\u043e\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0443 <code>?attr\/colorPrimarySurface<\/code>. \u0422\u043e\u0433\u0434\u0430, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043d\u044f\u0442\u044c \u043f\u043e\u0447\u0435\u043c\u0443 \u0442\u0430\u043a \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442, \u043c\u043d\u0435 \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u043a\u043e\u0432\u044b\u0440\u044f\u0442\u044c\u0441\u044f \u0432 \u0438\u0441\u0445\u043e\u0434\u043d\u0438\u043a\u0430\u0445 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u041c\u043d\u0435 \u0443\u0434\u0430\u043b\u043e\u0441\u044c \u043f\u043e\u043d\u044f\u0442\u044c, \u043a\u0430\u043a\u043e\u0439 \u0441\u043c\u044b\u0441\u043b \u0432\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u043b\u0438 \u0430\u0432\u0442\u043e\u0440\u044b \u0432 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0438 \u043f\u043e\u0442\u043e\u043c \u0441\u0442\u0430\u0442\u044c\u044f \u043f\u0440\u043e \u0442\u0435\u043c\u044b \u0438 \u0441\u0442\u0438\u043b\u0438 \u0432 Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/461201\/\"><u>\u043f\u043e\u0434\u0442\u0432\u0435\u0440\u0434\u0438\u043b\u0430<\/u><\/a> \u043c\u043e\u0438 \u0434\u043e\u0433\u0430\u0434\u043a\u0438.&nbsp;<\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 <a href=\"https:\/\/medium.com\/androiddevelopers\/dark-theme-with-mdc-4c6fc357d956\"><u>\u0443\u0437\u043d\u0430\u0442\u044c<\/u><\/a> \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u0434\u0435\u0442\u0430\u043b\u0438 \u0432 \u043d\u043e\u0432\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u043e \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c \u043e\u0442 Google. \u041a\u0430\u0440\u0442\u0438\u043d\u043a\u0430 \u0438\u0437 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0438 \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442, \u043a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u0435\u043c\u0430 \u0441 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u043c <code>colorPrimarySurface<\/code>.<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/33c\/506\/6d9\/33c5066d9db79274e18def8def279a81\" alt=\"\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0440\u0430\u0431\u043e\u0442\u044b PrimarySurface \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430\" title=\"\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0440\u0430\u0431\u043e\u0442\u044b PrimarySurface \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430\" width=\"1600\" height=\"900\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u0440\u0430\u0431\u043e\u0442\u044b PrimarySurface \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430<\/figcaption><\/figure>\n<p>\u041f\u0440\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0432\u0430\u0436\u043d\u043e \u043f\u043e\u043d\u044f\u0442\u044c \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0438 \u0446\u0432\u0435\u0442\u043e\u0432 \u0438 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u0442\u0435\u043c\u044b \u0438 \u0441\u0442\u0438\u043b\u0435\u0439. \u0421\u0435\u0439\u0447\u0430\u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0435\u0439 \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0435\u0442. \u042f \u043d\u0435 \u0441\u0442\u0430\u043d\u0443 \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u044d\u0442\u0438 \u0432\u0435\u0449\u0438 \u0432 \u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c\u0441\u044f.<\/p>\n<p>Google \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u043b\u0438 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0443\u044e \u0441\u0435\u0440\u0438\u044e \u0441\u0442\u0430\u0442\u0435\u0439 \u043f\u043e \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u044f \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u044e \u0438\u0445 \u043a \u043f\u0440\u043e\u0447\u0442\u0435\u043d\u0438\u044e. \u041e\u043d\u0438 \u043f\u043e\u043c\u043e\u0433\u0443\u0442 \u0432\u0430\u043c \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0442\u0435\u043c\u044b \u0434\u043b\u044f Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439:<\/p>\n<details class=\"spoiler\">\n<summary>\u0414\u043e\u043f. \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043f\u043e \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u0442\u0443\u0442 \u0438 \u0432 \u043a\u043e\u043d\u0446\u0435 \u0441\u0442\u0430\u0442\u044c\u0438:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p><a href=\"https:\/\/youtu.be\/sNSlDfaNq-0\">Android Dev Summit &#8217;18: &#171;Best Practices for Themes and Styles&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/youtu.be\/Owkf8DhAOSo\">Android Dev Summit &#8217;19: &#171;Developing themes with style&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/youtu.be\/64OD1PAqELg\">Google Design Tutorials: Migrating your app to Material Components for Android<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/461201\/\">\u0421\u0442\u0430\u0442\u044c\u044f \u043e\u0442 Redmadrobot: &#171;\u0422\u0435\u043c\u044b \u0438 \u0441\u0442\u0438\u043b\u0438 \u0432 Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/tagged\/design\">\u0421\u0435\u0440\u0438\u044f \u0441\u0442\u0430\u0442\u0435\u0439 \u043d\u0430 Medium Android developers<\/a><\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/whats-your-text-s-appearance-f3a1729192d\">What\u2019s your text\u2019s appearance?<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/android-styling-themes-vs-styles-ebe05f917578\">Android styling: themes vs styles<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/android-styling-common-theme-attributes-8f7c50c9eaba\">Android styling: common theme attributes<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/android-styling-prefer-theme-attributes-412caa748774\">Android Styling: prefer theme attributes<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/android-styling-themes-overlay-1ffd57745207\">Android Styling: themes overlay<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/migrating-to-material-components-for-android-ec6757795351\">Migrating to Material Components for Android<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/we-recommend-material-design-components-81e6d165c2dd\">We Recommend Material Design Components<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/material-theming-with-mdc-color-860dbba8ce2f\">Material Theming with MDC: Color<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/material-theming-with-mdc-shape-126c4e5cd7b4\">Material Theming with MDC: Shape<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/material-theming-with-mdc-type-8c2013430247\">Material Theming with MDC: Type<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/material-motion-with-mdc-c1f09bb90bf9\">Material Motion with MDC<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/dark-theme-with-mdc-4c6fc357d956\">Dark Theme with MDC<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/@olku\/my-quick-cheat-list-for-refreshing-understanding-the-android-styles-themes-6da649cfad4a\">\u0413\u0440\u0430\u0444\u0438\u043a \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0435\u0439 \u0438 \u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0445 \u0442\u0435\u043c \u0438 \u0441\u0442\u0438\u043b\u0435\u0439 \u0432 Android<\/a><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<p>\u0422\u0430\u043a\u0436\u0435, \u043f\u0440\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043f\u043e\u043c\u043e\u0433 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0441\u043a\u043e\u043d\u0432\u0435\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u0443\u044e \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432 \u0434\u043b\u044f \u0434\u0438\u0437\u0430\u0439\u043d\u0430, \u0432 \u0442\u0435\u043c\u0443 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u0417\u0434\u0435\u0441\u044c \u043d\u0430 \u043f\u043e\u043c\u043e\u0449\u044c <a href=\"https:\/\/material.io\/design\/color\/the-color-system.html#color-theme-creation\"><u>\u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442<\/u><\/a> \u0440\u0430\u0437\u0434\u0435\u043b \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, <a href=\"https:\/\/github.com\/material-components\/material-components-android-examples\/tree\/develop\/MaterialThemeBuilder\"><u>MaterialThemeBuilder<\/u><\/a> \u0438 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043e\u0442 Google:<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/github.com\/material-components\/material-components-android-examples\"><u>\u0420\u0435\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0438\u0439<\/u><\/a> \u0441 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u043c\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f Material Components \u043e\u0442 Google<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/github.com\/material-components\/material-components-android-examples\/tree\/develop\/Reply\"><u>Reply<\/u><\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/github.com\/material-components\/material-components-android-examples\/tree\/develop\/Owl\"><u>Owl<\/u><\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>Material Components <a href=\"https:\/\/github.com\/material-components\/material-components-android\/blob\/master\/docs\/catalog-app.md\"><u>Catalog App<\/u><\/a><\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u0438\u0442\u043e\u0433\u0435, \u044f \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b\u0441\u044f \u043d\u0430 \u0442\u0430\u043a\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0442\u0435\u043c\u044b \u0438 \u0441\u0442\u0438\u043b\u0435\u0439.<\/p>\n<p>\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432:<\/p>\n<ol>\n<li>\n<p><em>colors.xml<\/em> \u2014 \u0446\u0432\u0435\u0442\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p><em>type.xml<\/em> \u2014 \u0448\u0440\u0438\u0444\u0442\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p><em>shape.xml<\/em> \u2014 \u0444\u043e\u0440\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p><em>themes.xml<\/em> \u2014 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p><em>styles_button.xml<\/em> \u2014 \u043a\u043d\u043e\u043f\u043a\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p><em>styles_text_input.xml<\/em> \u2014 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0435 \u043f\u043e\u043b\u044f;<\/p>\n<\/li>\n<li>\n<p><em>styles_list_item.xml<\/em> \u2014 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0441\u043f\u0438\u0441\u043a\u043e\u0432;<\/p>\n<\/li>\n<li>\n<p><em>styles.xml<\/em> \u2014 \u043f\u0440\u043e\u0447\u0438\u0435 \u0441\u0442\u0438\u043b\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<details class=\"spoiler\">\n<summary>\u0418\u0442\u043e\u0433\u043e\u0432\u0430\u044f \u0442\u0435\u043c\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"xml\">&lt;style name=\"Theme.App\" parent=\"Theme.MaterialComponents.DayNight.NoActionBar\"&gt;     &lt;!-- Base color attributes --&gt;     &lt;item name=\"colorPrimary\"&gt;@color\/tint&lt;\/item&gt;     &lt;item name=\"colorSecondary\"&gt;@color\/tint&lt;\/item&gt;     &lt;item name=\"colorControlHighlight\"&gt;@color\/tint_ripple&lt;\/item&gt;      &lt;item name=\"android:colorBackground\"&gt;@color\/background_primary&lt;\/item&gt;     &lt;item name=\"colorSurface\"&gt;@color\/background_secondary&lt;\/item&gt;     &lt;item name=\"colorError\"&gt;@color\/error&lt;\/item&gt;      &lt;item name=\"colorOnPrimary\"&gt;@color\/text_primary&lt;\/item&gt;     &lt;item name=\"colorOnSecondary\"&gt;@color\/text_primary&lt;\/item&gt;     &lt;item name=\"colorOnBackground\"&gt;@color\/text_secondary&lt;\/item&gt;     &lt;item name=\"colorOnError\"&gt;@color\/text_primary&lt;\/item&gt;     &lt;item name=\"colorOnSurface\"&gt;@color\/text_secondary&lt;\/item&gt;      &lt;item name=\"android:windowBackground\"&gt;@color\/background_primary&lt;\/item&gt;     &lt;item name=\"android:statusBarColor\"&gt;@android:color\/black&lt;\/item&gt;     &lt;item name=\"android:navigationBarColor\"&gt;@android:color\/black&lt;\/item&gt;     &lt;item name=\"android:enforceNavigationBarContrast\" tools:targetApi=\"q\"&gt;false&lt;\/item&gt;      &lt;item name=\"android:listDivider\"&gt;@drawable\/divider_horizontal_primary&lt;\/item&gt;      &lt;!--Material shape attributes--&gt;     &lt;item name=\"shapeAppearanceSmallComponent\"&gt;@style\/ShapeAppearance.App.SmallComponent&lt;\/item&gt;     &lt;item name=\"shapeAppearanceMediumComponent\"&gt;@style\/ShapeAppearance.App.MediumComponent&lt;\/item&gt;     &lt;item name=\"shapeAppearanceLargeComponent\"&gt;@style\/ShapeAppearance.App.LargeComponent&lt;\/item&gt;      &lt;!--Component styles--&gt;     &lt;item name=\"appBarLayoutStyle\"&gt;@style\/Widget.App.AppBarLayout&lt;\/item&gt;     &lt;item name=\"toolbarStyle\"&gt;@style\/Widget.App.Toolbar&lt;\/item&gt;     &lt;item name=\"drawerArrowStyle\"&gt;@style\/Widget.App.DrawerArrowToggle&lt;\/item&gt;     &lt;item name=\"toolbarNavigationButtonStyle\"&gt;@style\/Widget.App.Toolbar.Button.Navigation.Tinted&lt;\/item&gt;     &lt;item name=\"bottomNavigationStyle\"&gt;@style\/Widget.App.BottomNavigationView&lt;\/item&gt;     &lt;item name=\"cardViewStyle\"&gt;@style\/Widget.App.CardView&lt;\/item&gt;     &lt;item name=\"textInputStyle\"&gt;@style\/Widget.App.TextInputLayout&lt;\/item&gt;     &lt;item name=\"editTextStyle\"&gt;@style\/Widget.App.TextInputEditText&lt;\/item&gt;     &lt;item name=\"switchStyle\"&gt;@style\/Widget.App.Switch&lt;\/item&gt;      &lt;item name=\"materialCalendarTheme\"&gt;@style\/ThemeOverlay.App.Calendar&lt;\/item&gt;     &lt;item name=\"dialogTheme\"&gt;@style\/ThemeOverlay.App.Dialog&lt;\/item&gt; &lt;\/style&gt;<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<h3>\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u0441\u0442\u0438\u043b\u0438 \u0448\u0440\u0438\u0444\u0442\u043e\u0432<\/h3>\n<p>\u0412 \u0442\u0435\u043c\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0441 material-components \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u0434\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0448\u0440\u0438\u0444\u0442\u043e\u0432 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f textAppearance. \u0412 \u043d\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0432 \u0434\u0432\u0430 \u0440\u0430\u0437\u0430 \u043c\u0435\u043d\u044c\u0448\u0435 \u0448\u0440\u0438\u0444\u0442\u043e\u0432 \u0438 \u0432\u0441\u0435\u0433\u043e \u0442\u0440\u0438 \u0446\u0432\u0435\u0442\u0430 \u0434\u043b\u044f \u0442\u0435\u043a\u0441\u0442\u0430. \u0410 \u0435\u0449\u0451 textAppearance \u043c\u043e\u0436\u043d\u043e \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u043d\u0435 \u0432\u0441\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b \u2014 \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0442\u0430\u043c \u043d\u0435\u0442 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 <code>android:lineSpacingMultiplier<\/code>. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u044f \u0440\u0435\u0448\u0438\u043b \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>textAppearance<\/code>, \u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u043f\u0440\u043e\u0441\u0442\u043e \u0441\u0442\u0438\u043b\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0440\u043e\u043f\u0438\u0441\u044b\u0432\u0430\u043b\u0438\u0441\u044c \u043a\u0430\u0436\u0434\u043e\u043c\u0443 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u043c\u0443 \u043f\u043e\u043b\u044e.&nbsp;<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043d\u0438\u0433\u0434\u0435 \u043d\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0441\u0442\u0438\u043b\u044c <code>Header2<\/code> \u0438 \u0432\u043c\u0435\u0441\u0442\u043e \u043d\u0435\u0433\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u043b\u0438 \u0443\u043d\u0430\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043e\u0442 \u043d\u0435\u0433\u043e \u0441\u0442\u0438\u043b\u044c \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0446\u0432\u0435\u0442\u0430: <code>Header2.Primary<\/code> \u0438\u043b\u0438 <code>Header2.Secondary<\/code>. \u0422\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u043b \u0441\u0440\u0430\u0437\u0443 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0438 \u0446\u0432\u0435\u0442 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0433\u043e \u043f\u043e\u043b\u044f \u0438 \u0435\u0433\u043e \u0448\u0440\u0438\u0444\u0442.<\/p>\n<p>\u0418\u043d\u043e\u0433\u0434\u0430 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u043b\u043e\u0441\u044c \u0434\u0435\u043b\u0430\u0442\u044c \u0438\u0441\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u044f \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e \u0441\u0442\u0438\u043b\u044c, \u043a\u0430\u043a <code>Header2<\/code>, \u0441 \u0443\u043a\u0430\u0437\u0430\u043d\u0438\u0435\u043c \u0446\u0432\u0435\u0442\u0430 \u043f\u0440\u044f\u043c\u043e \u0432 \u0432\u0435\u0440\u0441\u0442\u043a\u0435 \u044d\u043a\u0440\u0430\u043d\u0430, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043e\u0448\u0438\u0431\u043e\u043a, \u043d\u043e \u0442\u0430\u043a\u0438\u0445 \u043c\u0435\u0441\u0442 \u0432\u0441\u0435\u0433\u043e 2\u20133 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<p>\u0421\u0442\u0438\u043b\u044c \u0448\u0440\u0438\u0444\u0442\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u044b:<\/p>\n<ul>\n<li>\n<p><code>textSize<\/code><em> <\/em>\u2014 \u0440\u0430\u0437\u043c\u0435\u0440;<\/p>\n<\/li>\n<li>\n<p><code>lineHeight<\/code><em> <\/em>\u2014 \u043c\u0435\u0436\u0441\u0442\u0440\u043e\u0447\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b, \u043a\u043e\u0433\u0434\u0430 \u0432 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u043c \u043f\u043e\u043b\u0435 \u0434\u0432\u0435 \u0441\u0442\u0440\u043e\u043a\u0438;<\/p>\n<\/li>\n<li>\n<p><code>android:minHeight<\/code><em> \u0438 <\/em><code>android:gravity<\/code><em> <\/em>\u2014 \u043d\u0443\u0436\u043d\u044b, \u0447\u0442\u043e\u0431\u044b \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u043c\u0435\u0436\u0441\u0442\u0440\u043e\u0447\u043d\u044b\u0439 \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b, \u043a\u043e\u0433\u0434\u0430 \u0432 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u043c \u043f\u043e\u043b\u0435 \u0432\u0441\u0435\u0433\u043e \u043e\u0434\u043d\u0430 \u0441\u0442\u0440\u043e\u043a\u0430 (\u0434\u0430, <code>lineHeight<\/code> \u0432 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0438\u0433\u043d\u043e\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0438 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u044b\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u043e\u0441\u0442\u044b\u043b\u044f\u043c\u0438 :))<\/p>\n<\/li>\n<li>\n<p><code>android:fontFamily<\/code><em> <\/em>\u2014 \u043d\u0430\u0447\u0435\u0440\u0442\u0430\u043d\u0438\u0435 \u0448\u0440\u0438\u0444\u0442\u0430.<\/p>\n<p>\u0412\u043e\u0442 \u043e\u0434\u0438\u043d \u0438\u0437 \u043f\u0440\u0438\u043c\u0435\u0440\u0432 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0448\u0440\u0438\u0444\u0442\u0430:<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"xml\">&lt;style name=\"Header2\"&gt;     &lt;item name=\"android:textSize\"&gt;18sp&lt;\/item&gt;     &lt;item name=\"lineHeight\"&gt;24sp&lt;\/item&gt;     &lt;item name=\"android:minHeight\"&gt;24sp&lt;\/item&gt;     &lt;item name=\"android:gravity\"&gt;center_vertical&lt;\/item&gt;     &lt;item name=\"android:fontFamily\"&gt;@font\/basis_grotesque_pro_bold&lt;\/item&gt; &lt;\/style&gt;  &lt;style name=\"Header2.Primary\"&gt;     &lt;item name=\"android:textColor\"&gt;@color\/text_primary&lt;\/item&gt; &lt;\/style&gt;  &lt;style name=\"Header2.Secondary\"&gt;     &lt;item name=\"android:textColor\"&gt;@color\/text_secondary&lt;\/item&gt; &lt;\/style&gt;<\/code><\/pre>\n<h3>\u041f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0438\u043a\u043e\u043d\u043a\u0438 \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u043e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u043d\u0438\u044f<\/h3>\n<p>\u041a\u0430\u043a \u044f \u043f\u0438\u0441\u0430\u043b \u0440\u0430\u043d\u0435\u0435, \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0434\u0435\u043b\u0430\u0442\u044c \u043e\u0434\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u0438 \u043f\u043e\u0442\u043e\u043c \u0438\u0445 \u0440\u0430\u0441\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c. \u0427\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0438\u0437 Figm\u0430, \u0432\u043d\u043e\u0432\u044c \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u0441\u044f \u0443\u0442\u0438\u043b\u0438\u0442\u043e\u0439 Figma-export:<\/p>\n<pre><code class=\"bash\">.\/figma-export icons -i figma-export.yaml<\/code><\/pre>\n<p>\u041f\u043e\u0441\u043b\u0435 \u044d\u0442\u043e\u0433\u043e \u0432\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435, \u043a\u0430\u043a\u0438\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0443\u0434\u0430\u043b\u044f\u0442\u0441\u044f, \u0430 \u043a\u0430\u043a\u0438\u0435 \u0434\u043e\u0431\u0430\u0432\u044f\u0442\u0441\u044f \u0438\u043b\u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u0441\u044f. \u041e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043a\u0440\u0430\u0441\u0438\u0442\u044c \u0438\u0445 \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u0446\u0432\u0435\u0442.<\/p>\n<p>\u0412 Android \u0434\u0430\u0432\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u043b\u0438 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u043f\u0435\u0440\u0435\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u043d\u0438\u044f \u0438\u043a\u043e\u043d\u043e\u043a, \u044d\u0442\u043e \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 <em>tint<\/em>, \u043d\u043e \u0434\u043e \u0441\u0438\u0445 \u043f\u043e\u0440 \u044d\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043f\u043b\u043e\u0445\u043e \u0438 \u043d\u0435 \u043d\u0430 \u0432\u0441\u0435\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 Android, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043b extension \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 <em>drawable<\/em> \u0447\u0435\u0440\u0435\u0437 <em>drawable compat<\/em>, \u0438 \u043f\u0440\u0438\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u043b\u0441\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0433\u043e \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c\u0430:<\/p>\n<ol>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u043c\u043e\u0436\u0435\u0448\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c <code>tint<\/code> \u0432 \u0432\u0435\u0440\u0441\u0442\u043a\u0435 \u2014 \u0434\u0435\u043b\u0430\u0439 <code>tint<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u044d\u0442\u043e \u043a\u043d\u043e\u043f\u043a\u0430 \u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 \u0441 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438, \u0442\u043e \u0442\u0443\u0442 \u043f\u043e\u043c\u043e\u0436\u0435\u0442 <code>selector<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u0430\u044f \u0441\u043c\u0435\u043d\u0430 \u0446\u0432\u0435\u0442\u0430, \u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>DrawableCompat<\/code> \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e\u0439 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u0446\u0432\u0435\u0442\u0430, \u0438 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c <code>mutate<\/code>, \u0438\u043d\u0430\u0447\u0435 \u0438\u043a\u043e\u043d\u043a\u0430 \u0437\u0430\u043a\u0435\u0448\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u0438 \u043f\u043e\u043c\u0435\u043d\u044f\u0435\u0442 \u0446\u0432\u0435\u0442 \u0432\u043e \u0432\u0441\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043b \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 extension-\u0444\u0443\u043d\u043a\u0446\u0438\u0438:<\/p>\n<\/li>\n<\/ol>\n<pre><code class=\"kotlin\">fun Drawable.withTint(context: Context, @ColorRes color: Int): Drawable {     return DrawableCompat.wrap(this).mutate().apply {         DrawableCompat.setTint(this, ContextCompat.getColor(context, color))     } }  fun Int.toDrawableWithTint(context: Context, @ColorRes color: Int): Drawable {     return requireNotNull(AppCompatResources.getDrawable(context, this)).withTint(context, color) }<\/code><\/pre>\n<h3>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438<\/h3>\n<p>\u0421 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439 \u0442\u043e\u0436\u0435 \u0432\u0441\u0451 \u043f\u0440\u043e\u0441\u0442\u043e. \u0412 Figma-export \u0435\u0441\u0442\u044c \u043d\u0443\u0436\u043d\u0430\u044f \u043a\u043e\u043c\u0430\u043d\u0434\u0430 \u0434\u043b\u044f \u0438\u0445 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432 \u043f\u0440\u043e\u0435\u043a\u0442:<\/p>\n<pre><code class=\"bash\">.\/figma-export images -i figma-export.yaml<\/code><\/pre>\n<p>\u0412\u044b\u0437\u044b\u0432\u0430\u0435\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u0443, \u0438 \u043e\u043d\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 <em>values<\/em> \u0438, \u0435\u0441\u043b\u0438, \u0432\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0435 \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443, \u0442\u043e \u0438 \u0432 <em>values-night<\/em>.<\/p>\n<h3>\u0420\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u043c \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432<\/h3>\n<p>\u042f \u0443\u0436\u0435 \u0432\u044b\u0448\u0435 \u0434\u0435\u043b\u0438\u043b\u0441\u044f \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u0430\u043c\u0438 \u043f\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0441\u0442\u0438\u043b\u0435\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u0415\u0441\u043b\u0438 \u0432\u044b \u0438\u0445 \u043f\u043e\u0447\u0438\u0442\u0430\u0435\u0442\u0435, \u0442\u043e \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u0432 \u0443 \u0432\u0430\u0441 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0443\u0442\u044c \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u043e.&nbsp;<\/p>\n<details class=\"spoiler\">\n<summary>\u041f\u0440\u0438\u043c\u0435\u0440 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u044f \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u043b \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u043a\u043d\u043e\u043f\u043e\u043a \u0432 styles-button.xml<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"xml\">&lt;resources&gt;     &lt;style name=\"Widget.AppTheme.Button\" parent=\"Widget.MaterialComponents.Button.UnelevatedButton\"&gt;        &lt;item name=\"backgroundTint\"&gt;@drawable\/selector_button&lt;\/item&gt;        &lt;item name=\"rippleColor\"&gt;@color\/button_ripple&lt;\/item&gt;         &lt;item name=\"android:textAllCaps\"&gt;false&lt;\/item&gt;        &lt;item name=\"android:textAppearance\"&gt;@style\/Body1&lt;\/item&gt;        &lt;item name=\"android:textColor\"&gt;@color\/button_text_color&lt;\/item&gt;         &lt;item name=\"android:paddingStart\"&gt;16dp&lt;\/item&gt;        &lt;item name=\"android:paddingTop\"&gt;12dp&lt;\/item&gt;        &lt;item name=\"android:paddingEnd\"&gt;16dp&lt;\/item&gt;        &lt;item name=\"android:paddingBottom\"&gt;12dp&lt;\/item&gt;         &lt;item name=\"android:insetTop\"&gt;0dp&lt;\/item&gt;        &lt;item name=\"android:insetBottom\"&gt;0dp&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.Button.Secondary\"&gt;        &lt;item name=\"backgroundTint\"&gt;@color\/background_secondary&lt;\/item&gt;        &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;        &lt;item name=\"android:textColor\"&gt;@color\/button_secondary_text_color&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.Button.Onboarding\"&gt;        &lt;item name=\"backgroundTint\"&gt;@color\/onboarding_button&lt;\/item&gt;        &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;        &lt;item name=\"android:textColor\"&gt;@color\/button_secondary_text_color&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.Button.Accent\"&gt;        &lt;item name=\"backgroundTint\"&gt;@color\/accent&lt;\/item&gt;        &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.TextButton\" parent=\"Widget.MaterialComponents.Button.TextButton\"&gt;        &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;         &lt;item name=\"android:textAllCaps\"&gt;false&lt;\/item&gt;        &lt;item name=\"android:textAppearance\"&gt;@style\/Body1&lt;\/item&gt;         &lt;item name=\"android:insetTop\"&gt;0dp&lt;\/item&gt;        &lt;item name=\"android:insetBottom\"&gt;0dp&lt;\/item&gt;        &lt;item name=\"android:paddingStart\"&gt;16dp&lt;\/item&gt;        &lt;item name=\"android:paddingEnd\"&gt;16dp&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.Button.TextButton.Dialog\" parent=\"Widget.MaterialComponents.Button.TextButton.Dialog\"&gt;        &lt;item name=\"android:textAllCaps\"&gt;true&lt;\/item&gt;        &lt;item name=\"android:textAppearance\"&gt;@style\/Body1&lt;\/item&gt;         &lt;item name=\"android:paddingStart\"&gt;16dp&lt;\/item&gt;        &lt;item name=\"android:paddingEnd\"&gt;16dp&lt;\/item&gt;         &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.TextButton.Icon\" parent=\"Widget.MaterialComponents.Button.TextButton.Icon\"&gt;        &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;         &lt;item name=\"android:textAllCaps\"&gt;false&lt;\/item&gt;        &lt;item name=\"android:textAppearance\"&gt;@style\/Body1&lt;\/item&gt;        &lt;item name=\"android:textColor\"&gt;@color\/tint&lt;\/item&gt;         &lt;item name=\"android:insetTop\"&gt;0dp&lt;\/item&gt;        &lt;item name=\"android:insetBottom\"&gt;0dp&lt;\/item&gt;        &lt;item name=\"android:paddingStart\"&gt;16dp&lt;\/item&gt;        &lt;item name=\"android:paddingEnd\"&gt;16dp&lt;\/item&gt;    &lt;\/style&gt;     &lt;style name=\"Widget.AppTheme.ToolbarButton\" parent=\"Widget.MaterialComponents.Button.TextButton\"&gt;        &lt;item name=\"rippleColor\"&gt;@color\/tint_ripple&lt;\/item&gt;         &lt;item name=\"android:textAllCaps\"&gt;false&lt;\/item&gt;        &lt;item name=\"android:textAppearance\"&gt;@style\/Header1&lt;\/item&gt;        &lt;item name=\"android:textColor\"&gt;@color\/toolbar_button_text_color&lt;\/item&gt;         &lt;item name=\"android:paddingStart\"&gt;16dp&lt;\/item&gt;        &lt;item name=\"android:paddingEnd\"&gt;16dp&lt;\/item&gt;    &lt;\/style&gt;  &lt;\/resources&gt; <\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0441\u0442\u043e\u0438\u0442 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c, \u0447\u0442\u043e \u0432 \u0432\u0435\u0440\u0441\u0442\u043a\u0435 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e <code>Button<\/code> \u0438\u043b\u0438 <code>AppCompatButton<\/code>, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0435\u0441\u0442\u044c \u0442\u0430\u043a\u043e\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442, \u043a\u0430\u043a <a href=\"https:\/\/github.com\/material-components\/material-components-android\/blob\/master\/lib\/java\/com\/google\/android\/material\/theme\/MaterialComponentsViewInflater.java\"><u>MaterialComponentsViewInflater<\/u><\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0431\u0443\u0434\u0435\u0442 \u043f\u0435\u0440\u0435\u0432\u043e\u0434\u0438\u0442\u044c \u0438\u0445 \u0432 <code>MaterialButton<\/code>, \u0435\u0441\u043b\u0438 \u0432\u0430\u0448\u0430 \u0442\u0435\u043c\u0430 \u043d\u0430\u0441\u043b\u0435\u0434\u0443\u0435\u0442\u0441\u044f \u043e\u0442 &#171;material-components&#187;.<\/p>\n<p>\u0412\u043e\u0442 \u043a\u0443\u0441\u043e\u0447\u0435\u043a \u043a\u043e\u0434\u0430 \u0438\u0437 \u043d\u0435\u0433\u043e: <\/p>\n<pre><code class=\"java\">@NonNull @Override protected AppCompatButton createButton(     @NonNull Context context,      @NonNull AttributeSet attrs   ) {      if (shouldInflateAppCompatButton(context, attrs)) {     return new AppCompatButton(context, attrs);   }    return new MaterialButton(context, attrs); }<\/code><\/pre>\n<h2>\u041a\u0430\u043a \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c&nbsp;edge-to-edge<\/h2>\n<p>\u041d\u0430 \u044d\u0442\u0430\u043f\u0435 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432, \u043d\u0430\u043c \u043e\u0447\u0435\u043d\u044c \u0441\u0438\u043b\u044c\u043d\u043e \u043c\u0435\u0448\u0430\u043b\u0438 \u0446\u0432\u0435\u0442\u0430 <code>statusBar<\/code>, \u0434\u0430 \u0438 \u0432 \u0446\u0435\u043b\u043e\u043c, \u043e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u043d\u0438\u0435 <code>statusBar<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u043b\u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 Android. \u0420\u0430\u043d\u044c\u0448\u0435 \u0435\u0433\u043e \u0446\u0432\u0435\u0442 \u0431\u044b\u043b \u0440\u0430\u0432\u0435\u043d <code>colorPrimaryDark<\/code>, \u0430 \u0442\u0435\u043f\u0435\u0440\u044c Google \u043e\u0442\u043a\u0430\u0437\u0430\u043b\u0438\u0441\u044c \u043e\u0442 \u044d\u0442\u043e\u0433\u043e \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u0438 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u044e\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c edge-to-edge. \u041a\u0440\u043e\u043c\u0435 \u044d\u0442\u043e\u0433\u043e, \u043c\u043e\u0439 OnePlus \u043f\u043e\u043b\u0443\u0447\u0438\u043b \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u043e Android 10, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u044f \u0440\u0435\u0448\u0438\u043b \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0440\u0435\u0436\u0438\u043c\u0430 edge-to-edge.<\/p>\n<p>\u0420\u0435\u0436\u0438\u043c <strong>edge-to-edge<\/strong> \u2014 \u044d\u0442\u043e \u043d\u043e\u0432\u0430\u044f \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u044f \u0438\u0437 \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0432\u044b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0435\u0442\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043f\u043e\u0434 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u043c\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c\u0438: <code>statusBar<\/code> \u0438 <code>navigationBar<\/code>  \u2014 \u0438 \u0442\u0435\u043b\u0435\u0444\u043e\u043d \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u0431\u043e\u043b\u0435\u0435 \u0431\u0435\u0437\u0440\u0430\u043c\u043e\u0447\u043d\u044b\u043c.&nbsp;<\/p>\n<p>\u041e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0430 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u043f\u043e\u0434 <code>statusBar<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0447\u0435\u043b\u043e\u043a \u0438 \u0432\u044b\u0440\u0435\u0437\u043e\u0432 \u043f\u043e\u0434 \u043a\u0430\u043c\u0435\u0440\u0443, \u0430 \u043f\u043e\u0434 <code>navigationBar<\/code> \u2014 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u0443\u043b\u0443\u0447\u0448\u0430\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u0436\u0435\u0441\u0442\u0430\u043c\u0438 \u0438\u0437 \u043d\u043e\u0432\u043e\u0439 \u0436\u0435\u0441\u0442\u043e\u0432\u043e\u0439 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438 \u0432 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 Android.<\/p>\n<p>\u0414\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0440\u0435\u0436\u0438\u0432\u0430 edge-to-edge \u0432 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043d\u0443\u0436\u043d\u043e:<\/p>\n<ol>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0445 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 (<code>insets<\/code>).<\/p>\n<\/li>\n<li>\n<p>\u0410\u043a\u0442\u0438\u0432\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c edge-to-edge \u0434\u043b\u044f <code>statusBar<\/code> \u0438 <code>navigationBar<\/code>. \u041f\u043e \u0444\u0430\u043a\u0442\u0443 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0438\u0445 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c\u0438.<\/p>\n<\/li>\n<\/ol>\n<h3>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 Window Insets<\/h3>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0440\u043e\u0441\u0442\u044b\u043c\u0438 \u0441\u043b\u043e\u0432\u0430\u043c\u0438, \u0442\u043e \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 <em>Window Insets<\/em>, \u0432\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0435 \u0440\u0430\u0437\u043c\u0435\u0440 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438 \u0432\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0435 \u0438\u0445 \u043a\u0430\u043a padding \u0432 \u0432\u0435\u0440\u0441\u0442\u043a\u0443 \u0434\u043b\u044f \u0432\u0430\u0448\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u044d\u043a\u0440\u0430\u043d\u0430 <code>AppBar<\/code> \u0438\u043b\u0438 <code>RootView<\/code>. <code>Insets<\/code> \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0441\u0435\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c\u0438 Android, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u044e edge-to-edge \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439. \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0441\u0442\u0438 \u043c\u043e\u0436\u043d\u043e <a href=\"https:\/\/habr.com\/ru\/company\/oleg-bunin\/blog\/488196\/\"><u>\u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c<\/u><\/a> \u0438\u043b\u0438 <a href=\"https:\/\/youtu.be\/6Djql74drwk\"><u>\u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c<\/u><\/a> \u0432 \u0434\u043e\u043a\u043b\u0430\u0434\u0435 \u041a\u043e\u043d\u0441\u0442\u0430\u043d\u0442\u0438\u043d\u0430 \u0426\u0445\u043e\u0432\u0440\u0435\u0431\u043e\u0432\u0430 \u0441 AppsConf.&nbsp;<\/p>\n<p>\u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b \u0435\u0433\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0435, \u0430 \u043f\u043e\u0442\u043e\u043c, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b\u0448\u043b\u0430 \u043d\u043e\u0432\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 <a href=\"https:\/\/github.com\/chrisbanes\/insetter\"><u>Insetter<\/u><\/a> \u043e\u0442 \u041a\u0440\u0438\u0441\u0430 \u0411\u044d\u0439\u043d\u0441\u0430, \u043f\u0435\u0440\u0435\u0448\u0435\u043b \u043d\u0430 \u043d\u0435\u0451. \u0412\u0430\u043c \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u044e \u0441\u0440\u0430\u0437\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c Insetter.<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u044f \u0441\u043e\u0431\u0440\u0430\u043b \u043f\u0430\u0440\u0443 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0445 \u0441\u0442\u0430\u0442\u0435\u0439, \u043d\u0430 \u0441\u043b\u0443\u0447\u0430\u0439, \u0435\u0441\u043b\u0438 \u0432\u044b \u0437\u0430\u0445\u043e\u0442\u0438\u0442\u0435 \u0440\u0430\u0437\u043e\u0431\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u044d\u0442\u043e\u043c \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u0435\u0435:<\/p>\n<details class=\"spoiler\">\n<summary>\u041c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u043f\u043e \u0440\u0435\u0436\u0438\u043c\u0443 edge-to-edge \u043b\u0435\u0436\u0430\u0442 \u0442\u0443\u0442 \u0438 \u0432 \u043a\u043e\u043d\u0446\u0435 \u0441\u0442\u0430\u0442\u044c\u0438:<\/summary>\n<div class=\"spoiler__content\">\n<ul>\n<li>\n<p><a href=\"https:\/\/github.com\/material-components\/material-components-android\/blob\/master\/catalog\/java\/io\/material\/catalog\/windowpreferences\/WindowPreferencesManager.java\">\u041f\u0440\u0438\u043c\u0435\u0440 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 edge-to-edge \u0438\u0437 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0430 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/windowinsets-listeners-to-layouts-8f9ccc8fa4d1\">Medium Android developers: &#171;WindowInsets \u2014 Listeners to layouts&#187;<\/a><\/p>\n<\/li>\n<li>\n<p>\u0421\u0435\u0440\u0438\u044f \u0441\u0442\u0430\u0442\u0435\u0439 \u043d\u0430 Medium Android developers \u043f\u0440\u043e Gesture Navigation<\/p>\n<ul>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/gesture-navigation-going-edge-to-edge-812f62e4e83e\">Medium Android developers: Gesture Navigation: Going edge-to-edge (I)<\/a> \u0438 <a href=\"https:\/\/habr.com\/ru\/company\/otus\/blog\/479948\/\">\u043f\u0435\u0440\u0435\u0432\u043e\u0434<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/gesture-navigation-handling-visual-overlaps-4aed565c134c\">Gesture Navigation: Handling visual overlaps (II)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/gesture-navigation-handling-gesture-conflicts-8ee9c2665c69\">Gesture Navigation: Handling gesture conflicts (III)<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/gesture-navigation-immersive-modes-43f2d37a925d\">Gesture Navigation: Immersive Modes (IV)<\/a><\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><a href=\"https:\/\/chris.banes.dev\/talks\/2017\/becoming-a-master-window-fitter-lon\/\">\u0414\u043e\u043a\u043b\u0430\u0434 \u041a\u0440\u0438\u0441\u0430 \u0411\u0435\u043d\u0435\u0441\u0430 \u043f\u0440\u043e insets: &#171;Becoming a master window fitter&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/github.com\/chrisbanes\/insetter\">\u0411\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430 \u041a\u0440\u0438\u0441\u0430 \u0411\u0435\u043d\u0435\u0441\u0430 insetter<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/oleg-bunin\/blog\/488196\/\">\u0414\u043e\u043a\u043b\u0430\u0434 \u043e\u0442 \u041a\u043e\u0441\u0442\u0438 \u0426\u0445\u043e\u0432\u0440\u0435\u0431\u043e\u0432\u0430: &#171;Android insets: \u0440\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u043c\u0441\u044f \u0441\u043e \u0441\u0442\u0440\u0430\u0445\u0430\u043c\u0438 \u0438 \u0433\u043e\u0442\u043e\u0432\u0438\u043c\u0441\u044f \u043a Android Q&#187;<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/gitlab.com\/terrakok\/gitlab-client\/-\/commit\/f2843cc101e7a74f10f313b846d5ebf23252cd44\">\u041f\u0440\u0438\u043c\u0435\u0440 \u0432 gitfox<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/habr.com\/ru\/company\/surfstudio\/blog\/464373\/\">\u0421\u0442\u0430\u0442\u044c\u044f \u043e\u0442 serf<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/proandroiddev.com\/exploring-windowinsets-on-android-11-a80cf8fe19be\">\u041e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0432 android 11<\/a><\/p>\n<\/li>\n<li>\n<p><a href=\"https:\/\/medium.com\/androiddevelopers\/why-would-i-want-to-fitssystemwindows-4e26d9ce1eec\">fitssystemwindows<\/a><\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/details>\n<h3>\u041e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u043c statusBar \u0438 navigationBar<\/h3>\n<p>\u042d\u0444\u0444\u0435\u043a\u0442 \u0431\u0435\u0437\u0440\u0430\u043c\u043e\u0447\u043d\u043e\u0441\u0442\u0438 \u0432 \u0440\u0435\u0436\u0438\u043c\u0435 <strong>edge-to-edge<\/strong> \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u0437\u0430 \u0441\u0447\u0435\u0442 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0432\u044b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0435\u0442\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u043f\u043e\u0434 <code>statusBar<\/code> \u0438 <code>navigationBar<\/code> \u0438 \u0434\u0435\u043b\u0430\u0435\u0442\u0435 \u0438\u0445 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c\u0438. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c, \u043d\u0443\u0436\u043d\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0438\u043a\u043e\u043d\u043e\u043a \u0432 \u044d\u0442\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445.&nbsp;<\/p>\n<p>\u0422\u0443\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043e\u0434\u043d\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0433\u043b\u0443\u0431\u043e\u043a\u043e \u0432 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u0438 \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c \u0435\u0451 \u043f\u043e\u0441\u043b\u0435 \u0440\u0435\u043b\u0438\u0437\u0430 OS \u0443\u0436\u0435 \u043d\u0435\u043b\u044c\u0437\u044f. \u042d\u0442\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0438\u043a\u043e\u043d\u043e\u043a \u0432 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 (<code>statusBar<\/code> \u0438 <code>navigationBar<\/code>) \u0441\u043e \u0441\u0432\u0435\u0442\u043b\u043e\u0433\u043e \u043d\u0430 \u0442\u0435\u043c\u043d\u044b\u0439. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u043d\u0443\u0436\u043d\u043e \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430, \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0432\u0435\u0440\u0441\u0438\u0438 Android:<\/p>\n<ul>\n<li>\n<p>\u0434\u043e 6.0 \u0432\u0435\u0440\u0441\u0438\u0438 Android \u0438\u043a\u043e\u043d\u043a\u0438 <code>statusBar<\/code> \u0438 <code>navigationBar<\/code> \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u0435\u0442\u043b\u044b\u0435 \u0438 \u043f\u0435\u0440\u0435\u043a\u0440\u0430\u0441\u0438\u0442\u044c \u0438\u0445 \u0432 \u0442\u0435\u043c\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u043d\u0435\u043b\u044c\u0437\u044f. \u0424\u043b\u0430\u0433 <code>View.SYSTEM_UI_FLAG_LIGHT_STATUS_BAR<\/code> \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0441 <em>23 API<\/em>. \u0415\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u0432\u0441\u0435\u0433\u0434\u0430 \u0442\u0435\u043c\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u0442\u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u043d\u0435 \u0431\u0443\u0434\u0435\u0442. \u041d\u043e \u0447\u0442\u043e\u0431\u044b \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u044c \u0438\u043a\u043e\u043d\u043e\u043a \u043d\u0430 \u0444\u043e\u043d\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u0430 \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u043d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0444\u043e\u043d\u0430, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0447\u0435\u0440\u043d\u043e\u0433\u043e \u0444\u043e\u043d\u0430 \u0441 50% \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438;<\/p>\n<\/li>\n<li>\n<p>\u0441 \u0432\u0435\u0440\u0441\u0438\u0438 Android 6.0 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c, \u043a\u0430\u043a\u0438\u043c\u0438 \u0431\u0443\u0434\u0443\u0442 \u0438\u043a\u043e\u043d\u043a\u0438 \u0432 <code>statusBar<\/code>: \u0431\u0435\u043b\u044b\u043c\u0438 \u0438\u043b\u0438 \u0447\u0435\u0440\u043d\u044b\u043c\u0438. \u041e\u0434\u043d\u0430\u043a\u043e navigationBar \u0431\u0443\u0434\u0435\u0442 \u0432\u0435\u0441\u0442\u0438 \u0441\u0435\u0431\u044f \u043a\u0430\u043a \u0432 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0443\u0431\u0440\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f <code>statusBar<\/code>. \u0424\u043b\u0430\u0433 <code>View.SYSTEM_UI_FLAG_LIGHT_NAVIGATION_BAR<\/code> \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0441 <em>26 API<\/em>;<\/p>\n<\/li>\n<li>\n<p>\u0441 \u0432\u0435\u0440\u0441\u0438\u0438 Android 8.0 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0431\u0435\u043b\u044b\u0439 \u0438\u043b\u0438 \u0447\u0435\u0440\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0438\u043a\u043e\u043d\u043e\u043a \u0434\u043b\u044f \u043e\u0431\u043e\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043c\u043e\u0436\u043d\u043e \u0443\u0431\u0440\u0430\u0442\u044c \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e.<\/p>\n<\/li>\n<\/ul>\n<p>\u042f \u043d\u0430\u0448\u0435\u043b \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 <a href=\"https:\/\/github.com\/material-components\/material-components-android\/blob\/master\/catalog\/java\/io\/material\/catalog\/windowpreferences\/WindowPreferencesManager.java\"><u>WindowPreferencesManager<\/u><\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u043b \u044d\u0442\u0443 \u043b\u043e\u0433\u0438\u043a\u0443 \u0432 <a href=\"https:\/\/github.com\/material-components\/material-components-android\/tree\/master\/catalog\"><u>\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438-\u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0435<\/u><\/a> \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u041d\u043e \u0442\u0430\u043c \u0431\u044b\u043b\u043e \u043c\u043d\u043e\u0433\u043e \u043b\u0438\u0448\u043d\u0435\u0433\u043e \u0438 \u0440\u0430\u0437\u0431\u0438\u0440\u0430\u0442\u044c\u0441\u044f \u0432 \u044d\u0442\u043e\u043c, \u0434\u0443\u043c\u0430\u044e, \u0437\u0430\u0445\u043e\u0447\u0435\u0442 \u043d\u0435 \u043a\u0430\u0436\u0434\u044b\u0439, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u044f \u0441\u0434\u0435\u043b\u0430\u043b \u043c\u0438\u043d\u0438 \u0443\u0442\u0438\u043b\u0438\u0442\u0443 <a href=\"https:\/\/github.com\/RedMadRobot\/edge-to-edge-decorator\"><u>edge-to-edge-decorator<\/u><\/a>. \u041e\u043d\u0430 \u0445\u043e\u0440\u043e\u0448\u043e \u043a\u0430\u0441\u0442\u043e\u043c\u0438\u0437\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043f\u043e\u0434 \u0432\u0430\u0448\u0438 \u043d\u0443\u0436\u0434\u044b \u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u043b\u043e\u0433\u0438\u043a\u0443 \u043e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u043d\u0438\u044f <code>statusBar<\/code> \u0438 <code>navigationBar<\/code> \u0437\u0430 \u0432\u0430\u0441. \u041f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043f\u0440\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0432 <a href=\"https:\/\/github.com\/RedMadRobot\/edge-to-edge-decorator\"><u>\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438<\/u><\/a>.<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0440\u0430\u0431\u043e\u0442\u044b \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438:<\/p>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td data-colwidth=\"187\" width=\"187\">\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3bc\/4f1\/184\/3bc4f1184deb82942919acd46a6acd9f\" width=\"1080\" height=\"1920\"><figcaption><\/figcaption><\/figure>\n<\/td>\n<td>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c1f\/c51\/909\/c1fc51909c813ea586d23188b30090fe\" width=\"1080\" height=\"1920\"><figcaption><\/figcaption><\/figure>\n<\/td>\n<td>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/281\/efd\/189\/281efd18997a640c62c45c23c7a405b1\" width=\"1080\" height=\"2220\"><figcaption><\/figcaption><\/figure>\n<\/td>\n<td>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d5f\/344\/81b\/d5f34481ba3662d755fde74b4f1af2a8\" width=\"1080\" height=\"2160\"><figcaption><\/figcaption><\/figure>\n<\/td>\n<\/tr>\n<tr>\n<td data-colwidth=\"187\" width=\"187\">\n<p align=\"center\">Android 5.0 <\/p>\n<p align=\"center\">(API level 21)<\/p>\n<\/td>\n<td>\n<p align=\"center\">Android 7.1 <\/p>\n<p align=\"center\">(API level 25)<\/p>\n<\/td>\n<td>\n<p align=\"center\">Android 9 <\/p>\n<p align=\"center\">(API level 28)<\/p>\n<\/td>\n<td>\n<p align=\"center\">Android 11 <\/p>\n<p align=\"center\">(API level 30)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<h2>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h2>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c, \u043f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u0443 \u0432\u0430\u0441 \u0433\u043e\u0442\u043e\u0432 UI Kit \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0432\u044b \u0438\u0437\u0443\u0447\u0438\u043b\u0438 \u0438 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043b\u0438 \u043d\u043e\u0432\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c Material Components, \u043c\u043e\u0436\u043d\u043e \u0432\u0435\u0440\u043d\u0443\u0442\u044c\u0441\u044f \u043a \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<p>\u042f \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u044e \u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u044c \u0441\u043e\u0433\u043b\u0430\u0441\u043d\u043e \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c\u0443 \u0430\u043b\u0433\u043e\u0440\u0438\u0442\u043c\u0443:&nbsp;<\/p>\n<ol>\n<li>\n<p>\u0418\u0437\u0443\u0447\u0430\u0435\u043c \u0433\u0430\u0439\u0434\u044b \u0438 \u0441\u0442\u0430\u0442\u044c\u0438 \u043f\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044e \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b (\u0441\u0441\u044b\u043b\u043a\u0438 \u043b\u0435\u0436\u0430\u0442 \u0432 \u043a\u043e\u043d\u0446\u0435 \u0441\u0442\u0430\u0442\u044c\u0438).<\/p>\n<\/li>\n<li>\n<p>\u0414\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0433\u043e\u0442\u043e\u0432\u0438\u0442 \u043f\u0435\u0440\u0432\u044b\u0439 \u043f\u0440\u043e\u0442\u043e\u0442\u0438\u043f \u0438 \u0446\u0432\u0435\u0442\u043e\u0432\u0443\u044e \u0441\u0445\u0435\u043c\u0443 \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u043e\u0439 \u0442\u0435\u043c\u043d\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u0443\u044e \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u0445 \u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0435\u043c \u0438\u043b\u0438 \u043a\u0430\u0441\u0442\u043e\u043c\u0438\u0437\u0438\u0440\u0443\u0435\u043c \u0442\u0435\u043c\u0443, \u0438 \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b.<\/p>\n<\/li>\n<\/ol>\n<p>\u0415\u0441\u043b\u0438 \u043e\u0441\u043d\u043e\u0432\u043d\u0430\u044f \u0442\u0435\u043c\u0430 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043e\u043f\u0438\u0441\u0430\u043d\u0430 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e, \u0442\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u043d\u0435 \u0441\u043e\u0437\u0434\u0430\u0441\u0442 \u043f\u0440\u043e\u0431\u043b\u0435\u043c: \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c <em>color.xml<\/em> \u0432 <em>values-nigh<\/em>t, \u043a\u0430\u043a \u043c\u044b \u0438 \u043f\u043b\u0430\u043d\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0432 \u0441\u0430\u043c\u043e\u043c \u043d\u0430\u0447\u0430\u043b\u0435 (\u043a\u0430\u043a \u0436\u0435 \u043c\u044b \u0442\u043e\u0433\u0434\u0430 \u043e\u0448\u0438\u0431\u0430\u043b\u0438\u0441\u044c :))<\/p>\n<p>\u0421\u0430\u043c\u0430 \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u044f \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0445\u043e\u0440\u043e\u0448\u043e \u043e\u043f\u0438\u0441\u0430\u043d\u0430 \u0432 <a href=\"https:\/\/developer.android.com\/guide\/topics\/ui\/look-and-feel\/darktheme\"><u>\u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0438<\/u><\/a>. \u041a\u043e\u0440\u043e\u0442\u043a\u043e, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c:<\/p>\n<p>1) \u041f\u043e\u043c\u0435\u043d\u044f\u0442\u044c \u0431\u0430\u0437\u043e\u0432\u0443\u044e \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 <code>DayNight<\/code>.<\/p>\n<pre><code>&lt;style name=\"Theme.App\" parent=\"Theme.MaterialComponents.DayNight.NoActionBar\"&gt;<\/code><\/pre>\n<p>2) \u0423\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043d\u0443\u0436\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0447\u0435\u0440\u0435\u0437 \u043c\u0435\u0442\u043e\u0434 AppCompatDelegate.setDefaultNightMode.<\/p>\n<p>\u0412 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e 4 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430 \u0442\u0435\u043c\u044b:<\/p>\n<ul>\n<li>\n<p>\u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u0435\u0442\u043b\u0430\u044f: <code>AppCompatDelegate.MODE_NIGHT_NO<\/code>;<\/p>\n<\/li>\n<li>\n<p>\u0432\u0441\u0435\u0433\u0434\u0430 \u0442\u0451\u043c\u043d\u0430\u044f: <code>AppCompatDelegate.MODE_NIGHT_YES<\/code>;<\/p>\n<\/li>\n<li>\n<p>\u0432\u044b\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0440\u0435\u0436\u0438\u043c\u0430 \u044d\u043d\u0435\u0440\u0433\u043e\u0441\u0431\u0435\u0440\u0435\u0436\u0435\u043d\u0438\u044f (Android 9 \u0438 \u043d\u0438\u0436\u0435): <code>AppCompatDelegate.MODE_NIGHT_AUTO_BATTERY<\/code><em>;<\/em><\/p>\n<\/li>\n<li>\n<p>\u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0441\u0438\u0441\u0442\u0435\u043c\u044b (Android 10 \u0438 \u0432\u044b\u0448\u0435): <code>AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM<\/code>;<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0432\u044b\u0431\u043e\u0440 \u0442\u0435\u043c\u044b \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/strong><\/p>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/894\/794\/6c9\/8947946c9649ad33a40e090e2ea92876\" width=\"738\" height=\"1600\"><figcaption><\/figcaption><\/figure>\n<\/td>\n<td>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1c0\/ed1\/7bc\/1c0ed17bcbf7750e41b2165960695969\" width=\"738\" height=\"1600\"><figcaption><\/figcaption><\/figure>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"center\"><strong>\u0421\u0432\u0435\u0442\u043b\u0430\u044f \u0442\u0435\u043c\u0430<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>\u0422\u0435\u043c\u043d\u0430\u044f \u0442\u0435\u043c\u0430<\/strong><\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a \u0432\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043b\u0438 \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443, \u0432\u0438\u0448\u0435\u043d\u043a\u043e\u0439 \u043d\u0430 \u0442\u043e\u0440\u0442\u0435 \u0441\u0442\u0430\u043d\u0435\u0442 \u0432\u044b\u0431\u043e\u0440 \u0442\u0435\u043c\u044b \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041f\u043e\u0447\u0435\u043c\u0443 \u044d\u0442\u043e \u0432\u0430\u0436\u043d\u043e? \u041f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0440\u0435\u0441\u0443\u0440\u0441\u044b values-night \u0431\u044b\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u044b \u0435\u0449\u0451 \u0432 <a href=\"https:\/\/developer.android.com\/guide\/topics\/resources\/providing-resources#AlternativeResources\"><u>API level 8<\/u><\/a>, \u043d\u043e \u0432\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u043d\u0430 \u0443\u0440\u043e\u0432\u043d\u0435 \u0441\u0438\u0441\u0442\u0435\u043c\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 Android 10. \u0427\u0442\u043e\u0431\u044b \u0442\u0435\u043c\u043d\u0430\u044f \u0442\u0435\u043c\u0430 \u0440\u0430\u0431\u043e\u0442\u0430\u043b\u0430 \u0443 \u0432\u0441\u0435\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0435\u0451 \u0432\u044b\u0431\u043e\u0440\u0430 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<details class=\"spoiler\">\n<summary>\u0414\u043b\u044f \u0443\u0434\u043e\u0431\u043d\u043e\u0433\u043e API \u044f \u043d\u0430\u043f\u0438\u0441\u0430\u043b \u0432\u043e\u0442 \u0442\u0430\u043a\u043e\u0439 \u043a\u043b\u0430\u0441\u0441:<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">enum class NightModeType(    val customOrdinal: Int,    @NightMode val value: Int,    @StringRes val title: Int ) {     MODE_NIGHT_NO(        0,        AppCompatDelegate.MODE_NIGHT_NO,        R.string.mode_night_no    ),     MODE_NIGHT_YES(        1,        AppCompatDelegate.MODE_NIGHT_YES,        R.string.mode_night_yes    ),     MODE_NIGHT_FOLLOW_SYSTEM(        2,        AppCompatDelegate.MODE_NIGHT_FOLLOW_SYSTEM,        R.string.mode_night_follow_system    ),     MODE_NIGHT_AUTO_BATTERY(        2,        AppCompatDelegate.MODE_NIGHT_AUTO_BATTERY,        R.string.mode_night_auto_battery    );     companion object {         fun fromValue(@NightMode value: Int) = values().firstOrNull { it.value == value } ?: getDefaultMode()         fun fromCustomOrdinal(ordinal: Int): NightModeType {            return if (ordinal == 2) {                getDefaultMode()            } else {                values().firstOrNull { it.customOrdinal == ordinal } ?: getDefaultMode()            }        }         fun getDefaultMode(): NightModeType {            return if (Build.VERSION.SDK_INT &gt;= Build.VERSION_CODES.Q) {                MODE_NIGHT_FOLLOW_SYSTEM            } else {                MODE_NIGHT_AUTO_BATTERY            }        }    } }<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<details class=\"spoiler\">\n<summary>\u0410 \u0432\u044b\u0431\u043e\u0440 \u0442\u0435\u043c\u044b \u043c\u043e\u0436\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/summary>\n<div class=\"spoiler__content\">\n<pre><code class=\"kotlin\">private fun createNightModeChooserDialog(command: ShowNightModeChooserDialog): AlertDialog {    return AlertDialog        .Builder(ContextThemeWrapper(requireContext(), R.style.ThemeOverlay_AppTheme_AlertDialog))        .apply {            setTitle(getString(R.string.item_dark_theme_text_view_title_text))             val nightModes = arrayOf(                getString(NightModeType.MODE_NIGHT_NO.title),                getString(NightModeType.MODE_NIGHT_YES.title),                getString(NightModeType.getDefaultMode().title)            )             val selectedMode = command.selectedMode.customOrdinal             setSingleChoiceItems(nightModes, selectedMode) { dialog, which -&gt;                val nightMode = NightModeType.fromCustomOrdinal(which)                 persistentStorage.saveNightMode(nightMode.value)                AppCompatDelegate.setDefaultNightMode(nightMode.value)                 dialog.dismiss()            }            setNegativeButton(                getString(R.string.fragment_dialog_night_mode_chooser_button_cancel_text),                null            )        }        .create() }<\/code><\/pre>\n<\/p>\n<\/div>\n<\/details>\n<p>\u0418 \u0442\u0443\u0442 \u0442\u043e\u0436\u0435 \u0435\u0441\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430: \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u0430\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c \u0442\u0435\u043c\u0430 \u043d\u0438\u0433\u0434\u0435 \u043d\u0435 \u0437\u0430\u043f\u043e\u043c\u0438\u043d\u0430\u0435\u0442\u0441\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0451 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0442\u044c. \u0421\u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0432\u043e\u0442 \u0442\u0430\u043a\u043e\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u043e\u0439 \u0432 \u043c\u0435\u0442\u043e\u0434\u0435 onCreate \u0443 \u0432\u0430\u0448\u0435\u0433\u043e activity:<\/p>\n<pre><code class=\"kotlin\">override fun onCreate(savedInstanceState: Bundle?) {    checkNightMode()    setTheme(R.style.AppTheme)    super.onCreate(savedInstanceState) }  private fun checkNightMode() {    val savedNightModeValue = persistentStorage.getSavedNightMode(AppCompatDelegate.MODE_NIGHT_UNSPECIFIED)    val selectedNightMode = NightModeType.fromValue(savedNightModeValue)     AppCompatDelegate.setDefaultNightMode(selectedNightMode.value) }<\/code><\/pre>\n<h2>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 <\/h2>\n<p>\u0412\u043c\u0435\u0441\u0442\u043e \u043f\u0430\u0440\u044b \u043d\u0435\u0434\u0435\u043b\u044c \u043d\u0430 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0443 \u043d\u0430\u0441 \u0443\u0448\u043b\u043e \u0442\u0440\u0438 \u043c\u0435\u0441\u044f\u0446\u0430. \u041d\u043e \u043c\u044b \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u043b\u0438 \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443 \u043d\u0430 \u043f\u0440\u043e\u0435\u043a\u0442\u0435 \u00ab\u0420\u043e\u0441\u0442\u0435\u043b\u0435\u043a\u043e\u043c \u041a\u043b\u044e\u0447\u00bb, \u043d\u043e \u0438 \u043f\u043e\u0434\u043d\u044f\u043b\u0438 \u0434\u0438\u0437\u0430\u0439\u043d \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043d\u0430 \u043d\u043e\u0432\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c:<\/p>\n<ul>\n<li>\n<p>\u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0447\u0435\u0442\u043a\u0438\u0439 \u0438 \u043f\u043e\u043b\u043d\u044b\u0439 UI kit \u0432 Figma;<\/p>\n<\/li>\n<li>\n<p>\u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u044d\u043a\u0441\u043f\u043e\u0440\u0442 UI kit \u0432 Figma \u0438 \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043b\u0438 \u0443\u0442\u0438\u043b\u0438\u0442\u0443 <a href=\"https:\/\/github.com\/RedMadRobot\/figma-export\"><u>figma-export<\/u><\/a>;<\/p>\n<\/li>\n<li>\n<p>\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043b\u0438 \u0432\u0441\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 Android \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438;<\/p>\n<\/li>\n<li>\n<p>\u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u043b\u0438 \u043d\u043e\u0432\u044b\u0439 \u0440\u0435\u0436\u0438\u043c edge-to-edge, \u0438 \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043b\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0443 <a href=\"https:\/\/github.com\/RedMadRobot\/edge-to-edge-decorator\"><u>edge-to-edge-decorator<\/u><\/a>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0440\u0435\u0436\u0438\u043c edge-to-edge \u043d\u0430 \u0434\u0440\u0443\u0433\u0438\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445.<\/p>\n<\/li>\n<\/ul>\n<p>\u0422\u0430\u043a \u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u043c\u044b \u0432\u044b\u0448\u043b\u0438 \u0438\u0437 \u0437\u043e\u043d\u044b \u043a\u043e\u043c\u0444\u043e\u0440\u0442\u0430, \u0440\u0430\u0434\u0438 \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u0438 \u043f\u043e\u043f\u0440\u0430\u0432\u0438\u043b\u0438 \u043a\u0443\u0447\u0443 \u043c\u043e\u043c\u0435\u043d\u0442\u043e\u0432 \u0432 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u043c \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u044b \ud83d\ude42<\/p>\n<h2>\u041c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044b \u0434\u043b\u044f \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0433\u043e \u0438\u0437\u0443\u0447\u0435\u043d\u0438\u044f<\/h2>\n<p>\u0412\u0441\u0435 \u0441\u0441\u044b\u043b\u043a\u0438 \u044f \u043e\u0444\u043e\u0440\u043c\u0438\u043b \u0432 \u0432\u0438\u0434\u0435 <a href=\"https:\/\/gist.github.com\/Shipaaaa\/de83e9a1e3a06f07d702108ee8716075\"><u>gist<\/u><\/a>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0435\u0433\u043e \u0441\u0435\u0431\u0435 \u043f\u043e\u0441\u0442\u0430\u0432\u0438\u0432 \u0437\u0432\u0435\u0437\u0434\u043e\u0447\u043a\u0443.<\/p>\n<\/div>\n<p> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/523916\/\"> https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/523916\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"\n<div class=\"post__text post__text_v2\" id=\"post-content-body\" data-io-article-url=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/523916\/\">\n<figure class=\"full-width\"><figcaption><\/figcaption><\/figure>\n<p>\u041f\u0440\u0438\u0432\u0435\u0442, \u043c\u0435\u043d\u044f \u0437\u043e\u0432\u0443\u0442 \u0412\u043b\u0430\u0434 \u0428\u0438\u043f\u0443\u0433\u0438\u043d, \u044f Android-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0432 Redmadrobot. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u0445\u043e\u0447\u0443 \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u0441\u044f \u043e\u043f\u044b\u0442\u043e\u043c \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0443\u0434\u043e\u0431\u043d\u043e\u0433\u043e UI Kit, \u043a\u0430\u043a \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438, \u0442\u0430\u043a \u0438 \u0434\u043b\u044f \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u0432. \u042f \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u043f\u0440\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 Material Components \u0438 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 Vector Drawable. \u0422\u0430\u043a\u0436\u0435 \u0432\u044b \u0443\u0437\u043d\u0430\u0435\u0442\u0435, \u043a\u0430\u043a \u0431\u044b\u0441\u0442\u0440\u043e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0440\u0435\u0436\u0438\u043c edge-to-edge \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c Window Insets \u0438 \u043f\u043e\u0437\u043d\u0430\u043a\u043e\u043c\u0438\u0442\u0435\u0441\u044c \u0441 \u043c\u043e\u0435\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u043e\u0439 \u2014 <a href=\"https:\/\/github.com\/RedMadRobot\/edge-to-edge-decorator\"><u>edge-to-edge-decorator<\/u><\/a>.<\/p>\n<p>\u0413\u0434\u0435-\u0442\u043e \u043f\u043e\u043b\u0433\u043e\u0434\u0430 \u043d\u0430\u0437\u0430\u0434 \u043c\u044b \u043d\u0430\u0447\u0430\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0434\u043b\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f <a href=\"https:\/\/play.google.com\/store\/apps\/details?id=ru.rt.key\"><u>\u00ab\u0420\u043e\u0441\u0442\u0435\u043b\u0435\u043a\u043e\u043c \u041a\u043b\u044e\u0447\u00bb<\/u><\/a>. \u041d\u0430\u0448\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0443\u0436\u0435 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/510164\/\"><u>\u043f\u0438\u0441\u0430\u043b\u0438<\/u><\/a> \u043f\u0440\u043e \u0446\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u043a\u0430\u043a \u0435\u0451 \u0441\u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443. \u0412 \u044d\u0442\u043e\u0439 \u0441\u0442\u0430\u0442\u044c\u0435 \u044f \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0443 \u0440\u0430\u0441\u0441\u043a\u0430\u0437 \u043e\u0442 \u043b\u0438\u0446\u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430, \u0440\u0430\u0441\u0441\u043a\u0430\u0436\u0443 \u0441 \u043a\u0430\u043a\u0438\u043c\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438 \u043c\u044b \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0442\u0451\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u043f\u043e\u0447\u0435\u043c\u0443 \u044d\u0442\u043e \u0437\u0430\u043d\u044f\u043b\u043e \u0443 \u043d\u0430\u0441 3 \u043c\u0435\u0441\u044f\u0446\u0430 \u0438 \u043a\u0430\u043a \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443 \u0432\u0441\u0435\u0433\u043e \u0437\u0430 \u043e\u0434\u043d\u0443 \u043d\u0435\u0434\u0435\u043b\u044e.<\/p>\n<p>\u042d\u0442\u043e\u0439 \u043e\u0441\u0435\u043d\u044c\u044e Android 10 \u0438\u0441\u043f\u043e\u043b\u043d\u0438\u043b\u0441\u044f \u0433\u043e\u0434, \u0438 \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0430\u043a\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f, \u0447\u0442\u043e\u0431\u044b \u0438\u0437\u0443\u0447\u0438\u0442\u044c \u0432\u0441\u0435 \u043d\u043e\u0432\u0438\u043d\u043a\u0438, \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u0438 \u043f\u0440\u043e\u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u0431\u0443\u0434\u0435\u0442 \u0436\u0438\u0432\u043e\u0439 \u043e\u043f\u044b\u0442 \u0438\u0437 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u043e\u0432.<\/p>\n<p>\u041d\u0435 \u0432\u0430\u0436\u043d\u043e, \u0434\u0430\u0432\u043d\u043e \u043b\u0438 \u0432\u044b \u043d\u0430\u0447\u0430\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043f\u043e\u0434 Android \u0438\u043b\u0438 \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u0435\u043b\u0430\u0435\u0442\u0435 \u0432\u0430\u0448\u0435 \u043f\u0435\u0440\u0432\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u0434\u0443\u043c\u0430\u044e, \u0432\u0430\u043c \u0431\u0443\u0434\u0435\u0442 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e \u043f\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u044d\u0442\u0443 \u0441\u0442\u0430\u0442\u044c\u044e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432 \u043d\u0435\u0439 \u044f \u043f\u043e\u0434\u0435\u043b\u0438\u043b\u0441\u044f \u0432\u0441\u0435\u043c \u043d\u0430\u043a\u043e\u043f\u043b\u0435\u043d\u043d\u044b\u043c \u043e\u043f\u044b\u0442\u043e\u043c \u0438 \u0441\u0430\u043c\u044b\u043c \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u043e\u0432 \u043f\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0443 Android-\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439.<\/p>\n<h2>\u041a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u0439 UI Kit<\/h2>\n<p>\u0418\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u0443 \u043d\u0430\u0441 \u0431\u044b\u043b \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u043f\u043b\u0430\u043d: \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0434\u0435\u043b\u0430\u044e\u0442 \u0442\u0451\u043c\u043d\u0443\u044e \u0442\u0435\u043c\u0443, \u0430 \u043c\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0444\u0430\u0439\u043b <em>value-night\/color.xml<\/em> \u0438 \u0432\u0441\u0451. \u041d\u043e \u043f\u043e\u0437\u0436\u0435 \u043c\u044b \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438. \u0418 \u0442\u0435\u043f\u0435\u0440\u044c, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u0430\u0432\u043d\u043e \u043e\u043f\u0443\u0431\u043b\u0438\u043a\u043e\u0432\u0430\u043d\u043e \u0432 \u0441\u0442\u043e\u0440\u0435, \u044f \u043c\u043e\u0433\u0443 \u0440\u0430\u0441\u0441\u043a\u0430\u0437\u0430\u0442\u044c \u043e \u0440\u0435\u0448\u0435\u043d\u0438\u0438 \u044d\u0442\u0438\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c, \u0447\u0442\u043e\u0431\u044b \u0432\u044b \u043d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u043d\u0430\u0441\u0442\u0443\u043f\u0430\u043b\u0438 \u043d\u0430 \u043d\u0430\u0448\u0438 \u0433\u0440\u0430\u0431\u043b\u0438.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21161: \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043f\u0440\u0438 \u0432\u044b\u0431\u043e\u0440\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0439 \u0434\u043b\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432<\/h3>\n<p>\u041f\u0435\u0440\u0432\u044b\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432 \u2014 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u043a\u0430\u043a \u0435\u0441\u0442\u044c: \u201crealblue\u201d, \u201cdarkgrey\u201d \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435.<\/p>\n<figure class=\"full-width\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin<\/figcaption><\/figure>\n<p>\u0414\u0443\u043c\u0430\u044e, \u043a\u0430\u0436\u0434\u044b\u0439 \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u0442\u0430\u043a\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430, \u0432 \u0431\u0443\u0434\u0443\u0449\u0435\u043c, \u043f\u0440\u0438 \u0440\u0435\u0434\u0438\u0437\u0430\u0439\u043d\u0435, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0441\u044f, \u0447\u0442\u043e \u201crealblue\u201d \u043c\u0435\u043d\u044f\u0435\u0442 \u0441\u0432\u043e\u0439 hex \u043d\u0430 hex \u043a\u0440\u0430\u0441\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430 \u0438\u043b\u0438 \u0436\u0451\u043b\u0442\u043e\u0433\u043e. \u042d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u0440\u0430\u0432\u0438\u0442\u044c, \u0435\u0441\u043b\u0438 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0432\u043e \u0432\u0441\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438, \u043d\u043e \u0442\u043e\u0433\u0434\u0430 \u0432\u043e\u0437\u0440\u0430\u0441\u0442\u0430\u0435\u0442 \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e\u0441\u0442\u044c \u043e\u0448\u0438\u0431\u0438\u0442\u044c\u0441\u044f, \u0430 \u043e\u0442\u043b\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u043e\u0448\u0438\u0431\u043a\u0438 \u043a\u0440\u0430\u0439\u043d\u0435 \u0442\u044f\u0436\u0435\u043b\u043e.<\/p>\n<p>\u0412\u0442\u043e\u0440\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u044d\u0442\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f, \u043c\u044b \u0440\u0435\u0448\u0438\u043b\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c C1, C2 (\u0421 \u2014 \u043e\u0442 \u0441\u043b\u043e\u0432\u0430 Color) \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435. \u042d\u0442\u0430 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0446\u0438\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0442\u0432\u044f\u0437\u0430\u0442\u044c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u043e\u0442 \u0435\u0433\u043e \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f. \u0421\u0435\u0433\u043e\u0434\u043d\u044f \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043a\u0440\u0430\u0441\u043d\u044b\u0439, \u0430 \u043f\u043e\u0442\u043e\u043c \u0436\u0435\u043b\u0442\u044b\u0439 \u2014 \u044d\u0442\u043e \u043d\u0435 \u0432\u0430\u0436\u043d\u043e, \u0438 \u0432\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u0442\u044c \u0432\u0441\u0451 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435.<\/p>\n<figure class=\"full-width\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u0437 Zeplin<\/figcaption><\/figure>\n<p>\u041d\u043e \u0442\u0443\u0442 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u0440\u0443\u0433\u0430\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u2014 \u0442\u044b \u043d\u0435 \u043c\u043e\u0436\u0435\u0448\u044c \u0434\u0435\u0440\u0436\u0430\u0442\u044c \u0442\u0430\u0431\u043b\u0438\u0446\u0443 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0439 \u0446\u0432\u0435\u0442\u043e\u0432 \u0432 \u0433\u043e\u043b\u043e\u0432\u0435. \u041f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u0432\u0441\u0451 \u0432\u0440\u0435\u043c\u044f \u0435\u0451 \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0442\u044c: \u043f\u0440\u0438 \u043e\u0431\u0441\u0443\u0436\u0434\u0435\u043d\u0438\u0438 \u0441 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u043c \u0438\u043b\u0438 \u043f\u0440\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0435 \u2014 \u0432\u0441\u0435\u0433\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0420\u0435\u0434\u043a\u043e, \u043a\u043e\u0433\u0434\u0430 \u0443\u0434\u0430\u0435\u0442\u0441\u044f \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u0443\u044e \u0446\u0438\u0444\u0440\u0443 \u0446\u0432\u0435\u0442\u0430. \u00ab\u041a\u0430\u043a\u043e\u0439 \u0442\u0443\u0442 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u0446\u0432\u0435\u0442: \u04214 \u0438\u043b\u0438 \u04217?\u00bb \u2014 \u0441\u0442\u0430\u043d\u0435\u0442 \u0441\u0430\u043c\u044b\u043c \u0447\u0430\u0441\u0442\u044b\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u043e\u043c \u043d\u0430 \u043e\u0431\u0441\u0443\u0436\u0434\u0435\u043d\u0438\u044f\u0445 \u0434\u0438\u0437\u0430\u0439\u043d\u0430. \u041c\u044b \u0434\u043e\u043b\u0433\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043f\u044b\u0442\u0430\u043b\u0438\u0441\u044c \u043d\u0430\u0439\u0442\u0438 \u0431\u0430\u043b\u0430\u043d\u0441 \u043c\u0435\u0436\u0434\u0443 \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435\u043c \u0446\u0432\u0435\u0442\u0430, \u0442\u0430\u043a\u0438\u043c \u043a\u0430\u043a \u201crealblue\u201d \u0438 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u044b \u0440\u0435\u0444\u0430\u043a\u0442\u043e\u0440\u0438\u043d\u0433\u0430 \u0438 \u0440\u0435\u0434\u0438\u0437\u0430\u0439\u043d\u0430: \u04211, C2, C3 \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435.<\/p>\n<p>\u0415\u0441\u0442\u044c \u0438 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439, \u0442\u0440\u0435\u0442\u0438\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u043a\u043e\u0433\u0434\u0430 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432 \u0437\u0430\u0432\u0438\u0441\u044f\u0442 \u043e\u0442 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430, \u2014 \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0433\u0430\u0439\u0434\u043b\u0430\u0439\u043d\u044b Material Design \u0438\u043b\u0438 Apple HIG.<\/p>\n<figure class=\"full-width\"><figcaption>material.io<\/figcaption><\/figure>\n<p>\u042d\u0442\u043e\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043a\u0430\u0437\u0430\u043b\u0441\u044f \u0441\u0430\u043c\u044b\u043c \u043b\u043e\u0433\u0438\u0447\u043d\u044b\u043c, \u043d\u043e \u0432 \u043d\u0451\u043c \u0431\u044b\u043b\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u0441\u0435\u0433\u043e \u043f\u0440\u043e\u0431\u043b\u0435\u043c:<\/p>\n<ol>\n<li>\n<p>\u0426\u0432\u0435\u0442\u0430 \u0434\u0430\u0451\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440. \u0418 \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0449\u0438\u043c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430\u043c \u0441\u043b\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u0434\u0443\u043c\u044b\u0432\u0430\u0442\u044c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432, \u0430 \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0432\u0441\u0435\u0433\u0434\u0430 \u0430\u0440\u0442-\u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0430 \u0434\u043b\u044f \u0442\u0430\u043a\u043e\u0439 \u043c\u0435\u043b\u043e\u0447\u0438 \u043d\u0435\u0432\u044b\u0433\u043e\u0434\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0446\u0432\u0435\u0442\u0430 \u043c\u043e\u0433\u0443\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u0439 hex. \u0412 \u0446\u0435\u043b\u043e\u043c, \u0432 \u044d\u0442\u043e\u043c \u043d\u0435\u0442 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043d\u043e \u043a\u0430\u043a \u043e\u043a\u0430\u0437\u0430\u043b\u043e\u0441\u044c, \u0432 \u043f\u0430\u043b\u0438\u0442\u0440\u0435 \u0446\u0432\u0435\u0442\u043e\u0432 Zeplin \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0442\u044c\u0441\u044f \u0434\u0432\u0430 \u0446\u0432\u0435\u0442\u0430 \u0441 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u043c hex, \u043d\u043e \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043b\u043e\u0436\u043d\u043e \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0438\u0442\u044c \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438 Material Design \u0438 Apple HIG \u0432 \u043e\u0434\u043d\u0443 \u043f\u0430\u043b\u0438\u0442\u0440\u0443, \u0434\u0430 \u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0434\u043b\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ol>\n<p>\u041c\u043d\u043e\u0433\u043e \u0432\u0441\u0442\u0440\u0435\u0447 \u043f\u0440\u043e\u0448\u043b\u043e \u0437\u0430 \u043e\u0431\u0441\u0443\u0436\u0434\u0435\u043d\u0438\u0435\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0439 \u0446\u0432\u0435\u0442\u043e\u0432. \u041e\u043d\u0438 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u043b\u0438 \u0431\u044b\u0442\u044c \u0443\u0434\u043e\u0431\u043d\u044b\u043c\u0438 \u0434\u043b\u044f \u0432\u0441\u0435\u0445: Android- \u0438 iOS-\u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u0432. \u0427\u0435\u0440\u0435\u0437 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043c\u044b \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b\u0438\u0441\u044c \u043d\u0430 \u0442\u0440\u0435\u0442\u044c\u0435\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435, \u043d\u043e \u0441\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u0447\u0451\u0442\u043a\u0438\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u043f\u043e \u043d\u0430\u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u044e \u0446\u0432\u0435\u0442\u043e\u0432, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0442\u0440\u0430\u0442\u0438\u0442\u044c \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043d\u0430 \u043f\u0440\u0438\u0434\u0443\u043c\u044b\u0432\u0430\u043d\u0438\u0435 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f. \u0422\u0430\u043a\u0436\u0435 \u043c\u044b \u0434\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043b\u0438\u0441\u044c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0446\u0432\u0435\u0442\u0430 \u0441 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u043c hex \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0449\u0438\u043c\u0441\u044f \u043d\u0430 \u0435\u0434\u0438\u043d\u0438\u0446\u0443.<\/p>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"center\"><strong>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>iOS<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>Android<\/strong><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>text\/primary<\/p>\n<\/td>\n<td>\n<p>textPrimary<\/p>\n<\/td>\n<td>\n<p>text_primary<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>button\/pressed<\/p>\n<\/td>\n<td>\n<p>buttonPressed<\/p>\n<\/td>\n<td>\n<p>button_pressed<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0433\u043e\u0442\u043e\u0432\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0438\u0437 Zeplin:<\/p>\n<figure class=\"full-width\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u0444\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0430\u043b\u0438\u0442\u0440\u044b \u0438\u0437 Zeplin<\/figcaption><\/figure>\n<p>\u041f\u043e\u0437\u0436\u0435 \u043c\u044b \u043e\u0442\u043a\u0430\u0437\u0430\u043b\u0438\u0441\u044c \u043e\u0442 Zeplin \u0438 \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043d\u0430 Figma. \u0412\u043e\u0442 \u0442\u0430\u043a\u0430\u044f \u043f\u0430\u043b\u0438\u0442\u0440\u0430 \u0432 Figma \u0443 \u043d\u0430\u0441 <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A39419\"><u>\u043f\u043e\u043b\u0443\u0447\u0438\u043b\u0430\u0441\u044c<\/u><\/a>. \u0410 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u0435\u0435 \u043f\u0440\u043e \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u0441 Zeplin \u043d\u0430 Figma \u0443\u0436\u0435 <a href=\"https:\/\/habr.com\/ru\/company\/redmadrobot\/blog\/514118\/\"><u>\u043f\u0438\u0441\u0430\u043b<\/u><\/a> \u043d\u0430\u0448 iOS \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0414\u0430\u043d\u0438\u0438\u043b \u0421\u0443\u0431\u0431\u043e\u0442\u0438\u043d <a class=\"mention\" href=\"\/users\/subdan\">@subdan<\/a> \u0432 \u0441\u0442\u0430\u0442\u044c\u0435 \u043f\u0440\u043e \u0443\u0442\u0438\u043b\u0438\u0442\u0443 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0430 UI Kit \u0438\u0437 Figma \u2014 <a href=\"https:\/\/github.com\/RedMadRobot\/figma-export\"><u>figma-export<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21162: \u043d\u0435\u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0435 \u0441\u0442\u0438\u043b\u0438 \u0448\u0440\u0438\u0444\u0442\u043e\u0432<\/h3>\n<p>\u041e\u0441\u043e\u0431\u044b\u0445 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0432 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441\u043e \u0448\u0442\u0438\u0444\u0442\u043e\u0432\u044b\u043c\u0438 \u0441\u0442\u0438\u043b\u044f\u043c\u0438 \u0443 \u043d\u0430\u0441 \u043d\u0435 \u0431\u044b\u043b\u043e. \u0414\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043e\u0431\u044b\u0447\u043d\u043e \u0437\u0430\u043d\u043e\u0441\u044f\u0442 \u0432\u0441\u0435 \u0448\u0440\u0438\u0444\u0442\u043e\u0432\u044b\u0435 \u0441\u0442\u0438\u043b\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0432 UI Kit, \u043d\u043e \u0438\u0445 \u043d\u0430\u043b\u0438\u0447\u0438\u0435 \u043d\u0435 \u0433\u0430\u0440\u0430\u043d\u0442\u0438\u0440\u0443\u0435\u0442, \u0447\u0442\u043e \u0432 \u043c\u0430\u043a\u0435\u0442\u0430\u0445 \u0431\u0443\u0434\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u043d\u0438. \u041f\u0435\u0440\u0438\u043e\u0434\u0438\u0447\u0435\u0441\u043a\u0438 \u0442\u043e \u0442\u0430\u043c, \u0442\u043e \u0442\u0443\u0442, Zeplin \u043d\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u043b \u0443\u043a\u0430\u0437\u0430\u043d\u043d\u044b\u0439 \u0448\u0440\u0438\u0444\u0442 \u0438 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u043b\u043e\u0441\u044c \u043e\u0442\u0432\u043b\u0435\u043a\u0430\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430, \u0447\u0442\u043e\u0431\u044b \u0443\u0437\u043d\u0430\u0442\u044c \u043a\u0430\u043a\u043e\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0448\u0440\u0438\u0444\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c.<\/p>\n<p>\u0421\u0435\u0439\u0447\u0430\u0441 \u0432 \u043c\u0430\u043a\u0435\u0442\u0430\u0445 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u0438\u043b\u0438 \u0448\u0440\u0438\u0444\u0442\u043e\u0432. \u0414\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0434\u043e\u0431\u0438\u043b\u0438\u0441\u044c \u044d\u0442\u043e\u0433\u043e \u0437\u0430 \u0441\u0447\u0451\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430 \u0441\u043e Sketch + Zeplin \u043d\u0430 Figma \u2014 \u043e\u043d\u0430 \u043b\u0443\u0447\u0448\u0435 \u0440\u0430\u0441\u043f\u043e\u0437\u043d\u0430\u0435\u0442 \u0448\u0440\u0438\u0444\u0442\u043e\u0432\u044b\u0435 \u0441\u0442\u0438\u043b\u0438.&nbsp;<\/p>\n<p>\u0414\u0430, \u0438\u043d\u043e\u0433\u0434\u0430 \u043e\u0448\u0438\u0431\u043a\u0438 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u044e\u0442\u0441\u044f, \u043d\u043e \u044d\u0442\u043e \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043a\u0440\u0430\u0439\u043d\u0435 \u0440\u0435\u0434\u043a\u043e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432\u0441\u0435 \u0448\u0440\u0438\u0444\u0442\u044b \u043f\u0440\u043e\u043f\u0438\u0441\u0430\u043d\u044b \u0432 \u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u0445 \u0438 UI Kit. \u042d\u0442\u043e \u0443\u0436\u0435 \u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u043e\u0432. \u0415\u0441\u043b\u0438 \u044f \u043d\u0430\u0445\u043e\u0434\u0438\u043b \u043e\u0448\u0438\u0431\u043a\u0443, \u0442\u043e \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u043b \u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u0439 \u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0432\u0441\u0451 \u0438\u0441\u043f\u0440\u0430\u0432\u043b\u044f\u043b.&nbsp;<\/p>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430\u0448\u0438\u0445 \u0448\u0440\u0438\u0444\u0442\u043e\u0432\u044b\u0445 \u0441\u0442\u0438\u043b\u0435\u0439 \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A39912\"><u>\u0442\u0443\u0442<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21163: \u0434\u0443\u0431\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0438\u043a\u043e\u043d\u043e\u043a \u0438 \u0442\u0440\u0443\u0434\u043d\u043e\u0441\u0442\u0438 \u0441 \u0438\u0445 \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0435\u043c<\/h3>\n<p>\u041f\u043e\u043a\u0430 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043f\u0435\u0440\u0435\u0434\u0435\u043b\u044b\u0432\u0430\u043b\u0438 \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432, \u044f \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0441\u044f \u0441 \u043d\u043e\u0432\u043e\u0439 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u043e\u0439 \u2014 \u0438\u043a\u043e\u043d\u043a\u0438 \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c \u0442\u0435\u043c\u044b. \u0421\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u044d\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0438\u043a\u043e\u043d\u043e\u043a \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e <em>drawable-night<\/em>. \u041d\u043e \u0437\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0443 \u043d\u0443\u0436\u043d\u043e \u043f\u043b\u0430\u0442\u0438\u0442\u044c:<\/p>\n<ol>\n<li>\n<p>\u041a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0438\u043a\u043e\u043d\u043e\u043a \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u0434\u0432\u0430 \u0440\u0430\u0437\u0430, \u0430 \u0437\u043d\u0430\u0447\u0438\u0442, \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432\u0435\u0441\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435. \u0418 App Bundle \u043d\u0435 \u043f\u043e\u043c\u043e\u0436\u0435\u0442, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0442\u0435\u043c\u0430 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u0438 \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0434\u043e\u043b\u0436\u043d\u044b \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u0432 \u0438\u0442\u043e\u0433\u043e\u0432\u043e\u043c APK.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0438\u043a\u043e\u043d\u043e\u043a \u0440\u0430\u0437\u043d\u044b\u0445 \u0446\u0432\u0435\u0442\u043e\u0432 \u0434\u043e\u043b\u0436\u043d\u044b \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u0442\u044c. \u0415\u0441\u043b\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u043e\u043f\u0435\u0447\u0430\u0442\u0430\u043b\u0441\u044f \u0438\u043b\u0438 \u0438\u0437\u043c\u0435\u043d\u0438\u043b \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435, \u0442\u043e \u0432\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0435 \u043d\u043e\u0432\u0443\u044e \u0438\u043a\u043e\u043d\u043a\u0443 \u0440\u044f\u0434\u043e\u043c, \u0430 \u043d\u0435 \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u0435 \u0441\u0442\u0430\u0440\u0443\u044e. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0438\u0441\u043a\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043a\u0443 \u043f\u0440\u0438\u0434\u0435\u0442\u0441\u044f \u0432\u0440\u0443\u0447\u043d\u0443\u044e, \u0430 \u044d\u0442\u043e \u0441\u043b\u043e\u0436\u043d\u043e \u0438 \u0434\u043e\u043b\u0433\u043e.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0441\u0435\u0433\u0434\u0430 \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043f\u0440\u043e \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0435 \u0446\u0432\u0435\u0442\u0430 \u0438\u043a\u043e\u043d\u043e\u043a. \u0415\u0441\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0448\u044c \u043d\u043e\u0432\u0443\u044e \u0438\u043a\u043e\u043d\u043a\u0443, \u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0432\u0441\u0435\u0433\u0434\u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0435\u0451 \u0434\u043b\u044f \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b, \u0438 \u043d\u0430 \u0440\u0430\u043d\u043d\u0435\u043c \u044d\u0442\u0430\u043f\u0435 \u043c\u044b \u043e\u0431 \u044d\u0442\u043e\u043c \u0447\u0430\u0441\u0442\u043e \u0437\u0430\u0431\u044b\u0432\u0430\u043b\u0438<\/p>\n<\/li>\n<\/ol>\n<p>\u042d\u0442\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b \u0438 \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043c\u0435\u043d\u044f \u0441\u0440\u0430\u0437\u0443 \u043d\u0435 \u0443\u0441\u0442\u0440\u043e\u0438\u043b. \u041f\u043e\u0437\u0436\u0435 \u044f \u043d\u0430\u0442\u043a\u043d\u0443\u043b\u0441\u044f \u043d\u0430 \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0430\u0446\u0438\u0438 Google \u0438 Apple. \u041e\u043d\u0438 \u0441\u043e\u0432\u0435\u0442\u0443\u044e\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0441\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430: \u0447\u0435\u0440\u043d\u043e\u0433\u043e \u0438\u043b\u0438 \u0431\u0435\u043b\u043e\u0433\u043e, \u0438 \u043f\u0435\u0440\u0435\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0438\u0445 \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u0432 \u0440\u0430\u043d\u0442\u0430\u0439\u043c\u0435.&nbsp;<\/p>\n<p>\u041c\u044b \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043b\u0438 \u0438\u043a\u043e\u043d\u043a\u0438 \u0431\u0435\u043b\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u043d\u043e \u043f\u043e\u0442\u043e\u043c \u0441\u0442\u043e\u043b\u043a\u043d\u0443\u043b\u0438\u0441\u044c \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438 \u0438\u0445 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438. \u0412 Figma \u043c\u044b \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u043b\u0438 \u0438\u0445 \u043d\u0430 \u0447\u0435\u0440\u043d\u044b\u0439 \u0444\u043e\u043d, \u0430 \u0432\u043e\u0442 \u0432 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u0447\u0435\u0440\u043d\u044b\u0439 \u0444\u043e\u043d \u0435\u0441\u0442\u044c \u043d\u0435 \u0432\u0435\u0437\u0434\u0435, \u0438 \u0438\u043a\u043e\u043d\u043e\u043a \u0431\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0435 \u0432\u0438\u0434\u043d\u043e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043c\u044b \u043f\u0435\u0440\u0435\u0448\u043b\u0438 \u043d\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u0447\u0435\u0440\u043d\u044b\u0445 \u0438\u043a\u043e\u043d\u043e\u043a.<\/p>\n<p>\u0415\u0449\u0451 \u043e\u0434\u043d\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u2014 \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u044f \u0438\u043a\u043e\u043d\u043e\u043a \u043f\u0440\u0438\u0434\u0443\u043c\u044b\u0432\u0430\u044e\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u0438 \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u043d\u0438 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u044e\u0442 \u0441 \u0445\u043e\u0434\u043e\u043c \u043c\u044b\u0441\u043b\u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432: \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043d\u0430\u0437\u044b\u0432\u0430\u044e\u0442 \u0438\u043a\u043e\u043d\u043a\u0443 \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0435\u0439, \u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u043f\u0440\u0435\u0434\u043c\u0435\u0442\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u043f\u0435\u0440\u0435\u0438\u043c\u0435\u043d\u043e\u0432\u044b\u0432\u0430\u044e\u0442 \u0438\u043a\u043e\u043d\u043a\u0438 \u0443 \u0441\u0435\u0431\u044f \u0432 \u043f\u0440\u043e\u0435\u043a\u0442\u0435.&nbsp;<\/p>\n<p>\u0415\u0449\u0451 \u0431\u044b\u0432\u0430\u044e\u0442 \u043c\u043e\u043c\u0435\u043d\u0442\u044b, \u043a\u043e\u0433\u0434\u0430 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0441\u0430\u043c \u0440\u0435\u0448\u0430\u0435\u0442 \u043f\u043e\u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0438 \u0437\u0430\u0431\u044b\u0432\u0430\u0435\u0442 \u0441\u043e\u043e\u0431\u0449\u0438\u0442\u044c \u043e\u0431 \u044d\u0442\u043e\u043c \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c. \u0412\u0441\u0435 \u044d\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043f\u0440\u0438\u0432\u043e\u0434\u044f\u0442 \u043a \u0442\u043e\u043c\u0443, \u0447\u0442\u043e \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u0438\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438 \u0438\u043a\u043e\u043d\u043e\u043a \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f \u0434\u0443\u0431\u043b\u0435\u0440 \u0438\u043a\u043e\u043d\u043a\u0438, \u043d\u043e \u0441 \u0434\u0440\u0443\u0433\u0438\u043c \u043d\u0430\u0437\u0432\u0430\u043d\u0438\u0435\u043c. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043f\u0440\u0438\u0434\u0435\u0442\u0441\u044f \u043f\u043e\u0442\u0440\u0430\u0442\u0438\u0442\u044c \u043d\u0430 \u043f\u043e\u0438\u0441\u043a\u0438 \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u0445 \u0438\u043a\u043e\u043d\u043e\u043a.&nbsp;<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u0442\u0430\u043a\u043e\u0433\u043e \u043d\u0435 \u0431\u044b\u043b\u043e, \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0441\u0440\u0430\u0437\u0443 \u0434\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u0442\u044c\u0441\u044f \u043e \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u043c \u0438\u043c\u0435\u043d\u043e\u0432\u0430\u043d\u0438\u0438 \u0438\u043a\u043e\u043d\u043e\u043a. \u041c\u044b \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043b\u0438\u0441\u044c \u043d\u0430 \u0442\u0430\u043a\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435:&nbsp;<\/p>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"center\"><strong>\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0438\u043a\u043e\u043d\u043a\u0438<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>iOS<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"center\"><strong>Android<\/strong><\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>ic\/24\/flash_on<\/p>\n<\/td>\n<td>\n<p>ic24flashOn<\/p>\n<\/td>\n<td>\n<p>ic_24_flash_on<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p>ic\/24\/flash_off<\/p>\n<\/td>\n<td>\n<p>ic24flashOff<\/p>\n<\/td>\n<td>\n<p>ic_24_flash_off<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0441 \u043d\u0430\u0448\u0438\u043c \u043d\u0430\u0431\u043e\u0440\u043e\u043c \u0438\u043a\u043e\u043d\u043e\u043a \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A39960\"><u>\u0437\u0434\u0435\u0441\u044c<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21164: \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439<\/h3>\n<p>\u041f\u0435\u0440\u0435\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0442\u044c \u0438\u043a\u043e\u043d\u043a\u0438 \u0443\u0434\u043e\u0431\u043d\u043e, \u043d\u043e \u0435\u0441\u043b\u0438 \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043e\u0434\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u0442\u043e \u0442\u0430\u043a\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u043d\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u044e \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430 \u0432 \u0434\u0438\u0440\u0435\u043a\u0442\u043e\u0440\u0438\u044e drawable-night \u0438 \u043f\u043e\u043f\u0440\u043e\u0441\u0438\u0442\u044c \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430 \u043f\u043e\u0434\u0433\u043e\u0442\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u043e\u0439 \u0442\u0435\u043c\u0435.<\/p>\n<p>\u0423 \u043d\u0430\u0441 \u0431\u044b\u043b\u0438 \u0441\u043b\u0443\u0447\u0430\u0438, \u043a\u043e\u0433\u0434\u0430 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439 \u043d\u0435 \u0445\u0432\u0430\u0442\u0430\u043b\u043e \u0438\u043b\u0438 \u043e\u043d\u0438 \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043b\u0438\u0441\u044c \u043a\u0440\u0438\u0432\u043e. \u0427\u0442\u043e\u0431\u044b \u0438\u0437\u0431\u0435\u0436\u0430\u0442\u044c \u043e\u0448\u0438\u0431\u043e\u043a, \u043c\u044b \u0441\u043e\u0431\u0440\u0430\u043b\u0438 \u0432\u0441\u0435 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438 \u0432 \u043e\u0434\u043d\u043e\u043c \u0443\u0434\u043e\u0431\u043d\u043e\u043c \u0434\u043b\u044f QA \u043c\u0435\u0441\u0442\u0435, \u0438 \u0432\u043a\u043b\u044e\u0447\u0438\u043b\u0438 \u0438\u0445 \u0432 \u0440\u0443\u0447\u043d\u043e\u0435 \u0440\u0435\u0433\u0440\u0435\u0441\u0441\u0438\u043e\u043d\u043d\u043e\u0435 \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435. \u041f\u043e\u0437\u0436\u0435 \u044d\u0442\u043e\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u043c\u043e\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0441\u043a\u0440\u0438\u043d\u0448\u043e\u0442\u043d\u043e\u0433\u043e \u0442\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u043e\u0433\u043e, \u0447\u0442\u043e \u0443 \u043d\u0430\u0441 <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A40305\"><u>\u043f\u043e\u043b\u0443\u0447\u0438\u043b\u043e\u0441\u044c<\/u><\/a>.<\/p>\n<h3>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u21165: \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u0438\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0438\u043b\u0438 \u043d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0435 \u0438\u0445 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435<\/h3>\n<p>\u041f\u0440\u0438 \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0430 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u0435\u043b\u0430\u0435\u0442 \u044d\u043a\u0440\u0430\u043d\u044b, \u0430 \u043f\u043e\u0442\u043e\u043c \u043f\u0435\u0440\u0435\u043d\u043e\u0441\u0438\u0442 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 UI Kit. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u043d\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0443\u0434\u0435\u043b\u044f\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0435\u0439 \u043f\u0440\u0438 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0438 \u044d\u0442\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432. \u0412 UI Kit \u043c\u043e\u0433\u0443\u0442 \u043e\u0442\u0441\u0443\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u043c\u043e\u0436\u0435\u0442 \u0432\u0441\u0442\u0440\u0435\u0442\u0438\u0442\u044c \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u044d\u043a\u0440\u0430\u043d\u043e\u0432. \u0422\u0430\u043a\u043e\u0439 UI Kit \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043d\u0435\u043f\u043e\u043b\u043d\u044b\u043c, \u0438 \u0435\u0441\u043b\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440 \u0441\u0440\u0430\u0437\u0443 \u043d\u0435 \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u0445\u043e\u0440\u043e\u0448\u0438\u0439 UI Kit, \u0442\u043e \u043f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0442\u043e\u0442 \u0438 \u0432\u043e\u0432\u0441\u0435 \u043f\u0435\u0440\u0435\u0441\u0442\u0430\u0435\u0442 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c\u0441\u044f.&nbsp;<\/p>\n<blockquote>\n<p>\u041f\u0440\u0438 \u0434\u0430\u043d\u043d\u043e\u043c \u043f\u043e\u0434\u0445\u043e\u0434\u0435 UI Kit \u043d\u0435 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0435\u0434\u0438\u043d\u044b\u043c \u00ab\u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u043c \u043f\u0440\u0430\u0432\u0434\u044b\u00bb. \u041c\u043e\u0436\u043d\u043e \u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u2014 \u044d\u0442\u043e UI Kit \u0434\u043b\u044f \u00ab\u0433\u0430\u043b\u043e\u0447\u043a\u0438\u00bb, \u0438 \u0442\u0430\u043a \u0434\u0435\u043b\u0430\u0442\u044c \u043d\u0435\u043b\u044c\u0437\u044f.<\/p>\n<\/blockquote>\n<p>\u041d\u043e \u043a\u0430\u043a \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u0438\u0437\u0430\u0439\u043d-\u043c\u0430\u043a\u0435\u0442\u044b \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0432 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0443, \u0442\u043e \u0435\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c \u00ab\u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u043e\u043c \u043f\u0440\u0430\u0432\u0434\u044b\u00bb \u0434\u043e\u043b\u0436\u0435\u043d \u0441\u0442\u0430\u0442\u044c UI Kit \u0438 <a href=\"https:\/\/medium.com\/figma-design\/components-in-figma-e7e80fcf6fd2\"><u>\u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b<\/u><\/a> \u0432 \u043d\u0435\u043c. \u0418\u043d\u0430\u0447\u0435 UI Kit \u0431\u0443\u0434\u0435\u0442 \u0432\u0430\u043c \u043c\u0435\u0448\u0430\u0442\u044c \u0438 \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u0443, \u0430 \u043d\u0435 \u0443\u0441\u043a\u043e\u0440\u044f\u0442\u044c \u0435\u0451.<\/p>\n<p>\u0426\u0435\u043d\u043d\u043e\u0441\u0442\u044c UI Kit \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u0432\u044b \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0435 \u0432\u0441\u0435 \u0431\u0430\u0437\u043e\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b, \u0430 \u043f\u043e\u0442\u043e\u043c \u0438\u0437 \u044d\u0442\u0438\u0445 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0435 \u044d\u043a\u0440\u0430\u043d\u044b. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u0430\u0441\u0442\u0435\u0440-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0432 Figma, \u0438 styles \u0438\u043b\u0438 CustomViews \u0432 Android. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 UI Kit \u044d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u0432\u0430\u043c \u043c\u043d\u043e\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0430 \u043f\u043e\u043b\u043d\u044b\u0439 UI Kit \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c <a href=\"https:\/\/www.figma.com\/file\/GVHjNNE8PKKRf1KtnMPY9m\/RTC-Key-UI-kit?node-id=9%3A28502\"><u>\u0442\u0443\u0442<\/u><\/a>.&nbsp;<\/p>\n<figure class=\"full-width\"><figcaption>\u041f\u0440\u0438\u043c\u0435\u0440 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u043a\u043d\u043e\u043f\u043e\u043a \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/figcaption><\/figure>\n<h2>\u041a\u0430\u043a \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c UI Kit<\/h2>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430\u043c\u0438 UI Kit \u043c\u043e\u0436\u043d\u043e \u043f\u043e\u0434\u043a\u043b\u044e\u0447\u0430\u0442\u044c\u0441\u044f \u0438 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c. \u041c\u043e\u0439 \u043f\u043b\u0430\u043d \u043f\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 UI Kit \u0441 \u0443\u0447\u0435\u0442\u043e\u043c \u0442\u0435\u043c\u043d\u043e\u0439 \u0442\u0435\u043c\u044b \u0431\u044b\u043b \u0442\u0430\u043a\u043e\u0439:<\/p>\n<ol>\n<li>\n<p>\u041f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u0446\u0432\u0435\u0442\u0430, \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438 \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0432 \u043f\u043e\u0440\u044f\u0434\u043e\u043a.<\/p>\n<ul>\n<li>\n<p>\u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0430\u043b\u0438\u0442\u0440\u0443 \u0446\u0432\u0435\u0442\u043e\u0432 (<em>color.xml<\/em>);<\/p>\n<\/li>\n<li>\n<p>\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0442\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f;<\/p>\n<\/li>\n<li>\n<p>\u043e\u043f\u0438\u0441\u0430\u0442\u044c \u0441\u0442\u0438\u043b\u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0430\u044e\u0442\u0441\u044f \u043e\u0442 \u0431\u0430\u0437\u043e\u0432\u043e\u0439 \u0442\u0435\u043c\u044b.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0417\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u0432\u0441\u0435<\/p>\n<\/li>\n<\/ol>\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-311762","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/311762","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=311762"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/311762\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=311762"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=311762"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=311762"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}