{"id":463561,"date":"2025-06-16T15:01:59","date_gmt":"2025-06-16T15:01:59","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=463561"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=463561","title":{"rendered":"<span>Flutter-\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 2025: \u041f\u043e\u043b\u043d\u044b\u0439 \u0413\u0430\u0439\u0434<\/span>"},"content":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u041f\u0440\u0438\u0432\u0435\u0442, \u0425\u0430\u0431\u0440! \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2013 \u044d\u0442\u043e \u0442\u0430 \u0441\u0430\u043c\u0430\u044f \u0432\u0438\u0448\u0435\u043d\u043a\u0430 \u043d\u0430 \u0442\u043e\u0440\u0442\u0435, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0435\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0435\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432 \u043d\u0435\u0447\u0442\u043e, \u0447\u0435\u043c \u043f\u0440\u0438\u044f\u0442\u043d\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u00ab\u043f\u043e\u0442\u0440\u043e\u0433\u0430\u0442\u044c\u00bb. \u041d\u043e \u043a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u044d\u0442\u0430 \u0432\u0438\u0448\u0435\u043d\u043a\u0430 \u043d\u0435 \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u043b\u0430\u0441\u044c \u0432 \u0442\u044b\u043a\u0432\u0443, \u0442\u043e\u0440\u043c\u043e\u0437\u044f\u0449\u0443\u044e \u0432\u0435\u0441\u044c UI \u0438 \u0441\u044a\u0435\u0434\u0430\u044e\u0449\u0443\u044e \u0431\u0430\u0442\u0430\u0440\u0435\u0439\u043a\u0443?<\/p>\n<p>\u0417\u0430 \u0433\u043e\u0434\u044b \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438 \u044f \u043f\u0435\u0440\u0435\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b, \u043a\u0430\u0436\u0435\u0442\u0441\u044f, \u0432\u0441\u0451: \u043e\u0442 \u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0438\u0445 <code>AnimatedContainer<\/code> \u0434\u043e \u0437\u0430\u043c\u043e\u0440\u043e\u0447\u0435\u043d\u043d\u044b\u0445 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0440\u0435\u0448\u0435\u043d\u0438\u0439 \u0441 \u0444\u0438\u0437\u0438\u043a\u043e\u0439 \u0438 \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0439 \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0435\u0439 \u0441 Rive. \u0418 \u0441\u0435\u0433\u043e\u0434\u043d\u044f \u044f \u0445\u043e\u0447\u0443 \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u0441 \u0432\u0430\u043c\u0438 \u044d\u0442\u0438\u043c \u043e\u043f\u044b\u0442\u043e\u043c, \u0441\u043e\u0431\u0440\u0430\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c \u043e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0432\u043e Flutter \u0432 2025 \u0433\u043e\u0434\u0443. \u042d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u043b\u043e\u043d\u0433\u0440\u0438\u0434-\u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f, \u0442\u0430\u043a \u0447\u0442\u043e \u0437\u0430\u0432\u0430\u0440\u0438\u0442\u0435 \u043a\u043e\u0444\u0435\u0439\u043a\u0443 \u0438\u043b\u0438 \u0447\u0442\u043e \u043f\u043e\u043a\u0440\u0435\u043f\u0447\u0435!<\/p>\n<p>\u041c\u044b \u043f\u0440\u043e\u0439\u0434\u0435\u043c\u0441\u044f \u043f\u043e \u043e\u0441\u043d\u043e\u0432\u0430\u043c, \u0437\u0430\u0433\u043b\u044f\u043d\u0435\u043c \u043f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442 \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0445 \u0442\u0435\u0445\u043d\u0438\u043a, \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0438, \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435, \u043f\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u043d\u0435 \u0443\u0431\u0438\u0442\u044c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0438 \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u0437\u0430\u0432\u0435\u0442\u043d\u044b\u0445 60+ FPS. \u041f\u043e\u0435\u0445\u0430\u043b\u0438!<\/p>\n<ul>\n<li>\n<p><strong>\u0410\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c:<\/strong> \u0421\u0442\u0430\u0442\u044c\u044f \u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0430 \u043d\u0430 \u0438\u044e\u043d\u044c 2025. \u0425\u043e\u0442\u044f \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u043e Flutter \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u044b\u043c\u0438, \u044f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u0443\u0447\u0435\u0441\u0442\u044c \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0435 \u0442\u0435\u043d\u0434\u0435\u043d\u0446\u0438\u0438 \u0438 \u0432\u0435\u0440\u0441\u0438\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a. \u041e\u0434\u043d\u0430\u043a\u043e \u043c\u0438\u0440 Flutter \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441\u0442\u0440\u0435\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u043e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u0435\u0440\u044f\u0439\u0442\u0435\u0441\u044c \u0441 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0435\u0439 \u043d\u0430 \u043c\u043e\u043c\u0435\u043d\u0442 \u0447\u0442\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ul>\n<h3>\u0413\u043b\u0430\u0432\u0430 1: \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0410\u0437\u0431\u0443\u043a\u0430 Flutter \u2013 \u0421\u0442\u0440\u043e\u0438\u043c \u0424\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442<\/h3>\n<p>\u041f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u0441\u0442\u0440\u043e\u0438\u0442\u044c \u043d\u0435\u0431\u043e\u0441\u043a\u0440\u0435\u0431\u044b \u0438\u0437 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u043b\u043e\u0436\u0438\u0442\u044c \u043a\u0440\u0435\u043f\u043a\u0438\u0439 \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442. \u0412 \u044d\u0442\u043e\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0434\u0432\u0430 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c \u0432\u043e Flutter, \u0438\u0445 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0438, \u043a\u043e\u0433\u0434\u0430 \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043d\u0438\u0445 \u0431\u043b\u0435\u0441\u043d\u0435\u0442. \u0411\u0435\u0437 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u044d\u0442\u0438\u0445 \u043e\u0441\u043d\u043e\u0432 \u0434\u0432\u0438\u0433\u0430\u0442\u044c\u0441\u044f \u0434\u0430\u043b\u044c\u0448\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u043e\u0436\u043d\u043e, \u0442\u0430\u043a \u0447\u0442\u043e \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u0441\u0432\u0435\u0436\u0438\u043c \u0438\u043b\u0438 \u0437\u0430\u043a\u0440\u0435\u043f\u0438\u043c \u0437\u043d\u0430\u043d\u0438\u044f.<\/p>\n<h4>1.1. \u0414\u0432\u0430 \u043a\u0438\u0442\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: \u041d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) vs. \u042f\u0432\u043d\u044b\u0435 (Explicit) \u2013 \u043a\u043e\u0433\u0434\u0430 \u0438 \u0447\u0442\u043e \u0432\u044b\u0431\u0438\u0440\u0430\u0442\u044c?<\/h4>\n<p>\u0412\u043e Flutter \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0434\u0432\u0430 \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: \u043d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) \u0438 \u044f\u0432\u043d\u044b\u0435 (Explicit). \u041f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0438\u0445 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u0439 \u0438 \u043e\u0431\u043b\u0430\u0441\u0442\u0435\u0439 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u2014 \u044d\u0442\u043e \u043f\u0435\u0440\u0432\u044b\u0439 \u0448\u0430\u0433 \u043a \u043c\u0430\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u0443.<\/p>\n<p><strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438:<\/strong> \u042d\u0442\u043e \u0441\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0435 \u0432\u00a0\u0432\u0430\u0448 UI. \u041e\u043d\u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043f\u043e\u00a0\u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0443 \u00ab\u043e\u043f\u0438\u0448\u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0438 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u0430\u00a0\u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435\u00bb. \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u043a\u043e\u0433\u0434\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u043e \u0438\u0437 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430.. \u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e \u2013 \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u0438 \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u043a\u043e\u0434\u0430. \u0422\u0430\u043a\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0447\u0430\u0441\u0442\u043e \u043d\u0430\u0437\u044b\u0432\u0430\u044e\u0442 &#171;pre-programmed&#187;, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u0441\u0430\u043c\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u041e\u043d\u0438 \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0442 \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u044b\u0445 UI-\u043e\u0442\u043a\u043b\u0438\u043a\u043e\u0432, \u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u043c. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u042f\u0432\u043d\u044b\u0435 (Explicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438:<\/strong> \u0417\u0434\u0435\u0441\u044c \u0432\u044b \u0431\u0435\u0440\u0435\u0442\u0435 \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u0432 \u0441\u0432\u043e\u0438 \u0440\u0443\u043a\u0438. \u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043a\u043e\u0434\u0430, \u043d\u043e \u0432\u0437\u0430\u043c\u0435\u043d \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u0433\u0440\u0430\u043d\u0443\u043b\u044f\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u043a\u0430\u0436\u0434\u044b\u043c \u0430\u0441\u043f\u0435\u043a\u0442\u043e\u043c: \u0434\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e, \u043a\u0440\u0438\u0432\u043e\u0439 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c (\u0437\u0430\u043f\u0443\u0449\u0435\u043d\u0430, \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0430, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0435\u0442\u0441\u044f), \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e \u0438 \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. \u0426\u0435\u043d\u0442\u0440\u0430\u043b\u044c\u043d\u044b\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0437\u0434\u0435\u0441\u044c \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0435\u0442  \u00a0 <\/p>\n<p><code>AnimationController<\/code>. \u041e\u043d\u0438 \u043d\u0435\u0437\u0430\u043c\u0435\u043d\u0438\u043c\u044b \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445, \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0445\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0439, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0438\u0445\u0441\u044f \u0446\u0438\u043a\u043b\u043e\u0432 \u0438\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u0436\u0435\u0441\u0442\u0430\u043c\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041a\u043e\u0433\u0434\u0430 \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/strong> \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0442 \u0434\u043b\u044f:<\/p>\n<ul>\n<li>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u043b\u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u043f\u0440\u0438 \u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u043c\u0435\u0440, \u0446\u0432\u0435\u0442, \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043a\u043d\u043e\u043f\u043a\u0438 \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u0438\u043b\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0441\u0442\u044b\u0445 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438 UI.<\/p>\n<\/li>\n<li>\n<p>\u0411\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f &#171;\u0436\u0438\u0432\u043e\u0441\u0442\u0438&#187; \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0443 \u0431\u0435\u0437 \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0433\u043e \u043f\u043e\u0433\u0440\u0443\u0436\u0435\u043d\u0438\u044f \u0432 \u043c\u0435\u0445\u0430\u043d\u0438\u043a\u0443 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/strong> \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b, \u043a\u043e\u0433\u0434\u0430:<\/p>\n<ul>\n<li>\n<p>\u041d\u0443\u0436\u043d\u0430 \u0441\u043b\u043e\u0436\u043d\u0430\u044f \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 (staggered animations).<\/p>\n<\/li>\n<li>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c\u0441\u044f \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0438\u043b\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0440\u0430\u0437.<\/p>\n<\/li>\n<li>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439 \u043d\u0443\u0436\u043d\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e (\u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c, \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c, \u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f).<\/p>\n<\/li>\n<li>\n<p>\u0422\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b, \u043d\u0435 \u043f\u043e\u043a\u0440\u044b\u0432\u0430\u0435\u043c\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u043c\u0438 \u043d\u0435\u044f\u0432\u043d\u044b\u043c\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c\u0438.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u0432\u0435\u0434\u0435\u043c \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u0432 \u0442\u0430\u0431\u043b\u0438\u0446\u0443 \u0434\u043b\u044f \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0441\u0442\u0438:<\/p>\n<p><strong>\u0422\u0430\u0431\u043b\u0438\u0446\u0430 1: \u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u041d\u0435\u044f\u0432\u043d\u044b\u0445 \u0438 \u042f\u0432\u043d\u044b\u0445 \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0439<\/strong><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0425\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u042f\u0432\u043d\u044b\u0435 (Explicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u044b\u0441\u043e\u043a\u0430\u044f, \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u043a\u043e\u0434\u0430  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u0440\u0435\u0434\u043d\u044f\u044f\/\u041d\u0438\u0437\u043a\u0430\u044f, \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0423\u0440\u043e\u0432\u0435\u043d\u044c \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0438\u0437\u043a\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u043c  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u044b\u0441\u043e\u043a\u0438\u0439, \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u0432\u0441\u0435\u043c\u0438 \u0430\u0441\u043f\u0435\u043a\u0442\u0430\u043c\u0438  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043c \u043a\u043e\u0434\u0430<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0417\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0431\u043e\u043b\u044c\u0448\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430, <code>ImplicitlyAnimatedWidget<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>AnimationController<\/code>, <code>Tween<\/code>, <code>Curve<\/code>  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0417\u0430\u043f\u0443\u0441\u043a \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e \u0447\u0435\u0440\u0435\u0437 <code>AnimationController<\/code> (e.g., <code>forward()<\/code>, <code>repeat()<\/code>)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0422\u0438\u043f\u0438\u0447\u043d\u044b\u0435 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0438<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u0440\u043e\u0441\u0442\u044b\u0435 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439, UI-\u043e\u0442\u043a\u043b\u0438\u043a\u0438 (\u0440\u0430\u0437\u043c\u0435\u0440, \u0446\u0432\u0435\u0442, \u043f\u043e\u0437\u0438\u0446\u0438\u044f)<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u043b\u043e\u0436\u043d\u044b\u0435 \u0445\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0438, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0438\u0435\u0441\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0435 \u0436\u0435\u0441\u0442\u0430\u043c\u0438<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u043c<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0420\u0443\u0447\u043d\u043e\u0435 \u0447\u0435\u0440\u0435\u0437 <code>AnimationController<\/code>  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043d\u043e\u0432\u0438\u0447\u043a\u0438, \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442 \u0441\u0432\u043e\u0439 \u043f\u0443\u0442\u044c \u0432 \u043c\u0438\u0440 Flutter-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0441 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a <code>AnimatedContainer<\/code>. \u042d\u0442\u043e \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0432\u0435\u0434\u044c \u043e\u043d\u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0432\u0438\u0434\u0438\u043c\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u0443\u0441\u0438\u043b\u0438\u044f\u043c\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u043f\u043e \u043c\u0435\u0440\u0435 \u0440\u043e\u0441\u0442\u0430 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0437\u0430\u0434\u0430\u0447 \u0438 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u043e\u0432\u0435\u043d\u0438\u044f \u043f\u043e\u0442\u0440\u0435\u0431\u043d\u043e\u0441\u0442\u0438 \u0432 \u0431\u043e\u043b\u0435\u0435 \u0442\u043e\u043d\u043a\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043a \u044f\u0432\u043d\u044b\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043d\u0435\u0438\u0437\u0431\u0435\u0436\u043d\u044b\u043c. \u042d\u0442\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u0440\u043e\u0434\u0430 \u044d\u0432\u043e\u043b\u044e\u0446\u0438\u043e\u043d\u043d\u044b\u0439 \u043f\u0443\u0442\u044c: \u043e\u0442 \u0432\u044b\u0441\u043e\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u0445 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0446\u0438\u0439, \u0441\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u0434\u0435\u0442\u0430\u043b\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u043a \u0431\u043e\u043b\u0435\u0435 \u043d\u0438\u0437\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u043c, \u0434\u0430\u044e\u0449\u0438\u043c \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c. \u041f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043e\u0431\u043e\u0438\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u043e\u0432 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0431\u0438\u0440\u0430\u0442\u044c \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0438\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0439 \u0437\u0430\u0434\u0430\u0447\u0438, \u0430 \u043d\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043e\u0434\u043d\u0438\u043c, \u043f\u0443\u0441\u0442\u044c \u0438 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u044b\u043c, \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c. \u0421\u0430\u043c \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a Flutter \u0441\u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434. \u041f\u043e\u043c\u043d\u044e, \u043a\u0430\u043a \u0441\u0430\u043c \u043d\u0430\u0447\u0438\u043d\u0430\u043b:  \u00a0 <\/p>\n<p><code>AnimatedContainer<\/code> \u043a\u0430\u0437\u0430\u043b\u0441\u044f \u043c\u0430\u0433\u0438\u0435\u0439! \u041d\u043e \u043f\u043e\u0442\u043e\u043c \u0437\u0430\u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u044d\u0434\u0430\u043a\u043e\u0435, \u0438 \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u043d\u044b\u0440\u044f\u0442\u044c \u0432 <code>AnimationController<\/code>. \u042d\u0442\u043e \u043a\u0430\u043a \u0441 \u0430\u0432\u0442\u043e\u043c\u043e\u0431\u0438\u043b\u0435\u043c: \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0430\u0432\u0442\u043e\u043c\u0430\u0442, \u043f\u043e\u0442\u043e\u043c \u2013 \u043c\u0435\u0445\u0430\u043d\u0438\u043a\u0430 \u0434\u043b\u044f \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u0434\u0440\u0430\u0439\u0432\u0430.<\/p>\n<h4>1.2. \u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: \u041c\u0430\u0433\u0438\u044f &#171;\u0438\u0437 \u043a\u043e\u0440\u043e\u0431\u043a\u0438&#187;<\/h4>\n<p>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2014 \u044d\u0442\u043e \u0445\u043b\u0435\u0431 \u0441 \u043c\u0430\u0441\u043b\u043e\u043c \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0441\u0442\u044b\u0445, \u043d\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u043d\u044b\u0445 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. Flutter \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0446\u0435\u043b\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0433\u043e\u0442\u043e\u0432\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u043b\u0430\u044e\u0442 \u044d\u0442\u0443 \u0437\u0430\u0434\u0430\u0447\u0443 \u0442\u0440\u0438\u0432\u0438\u0430\u043b\u044c\u043d\u043e\u0439.<\/p>\n<p><strong>\u041e\u0431\u0437\u043e\u0440 <\/strong><code><strong>ImplicitlyAnimatedWidget<\/strong><\/code><\/p>\n<p>\u0412 \u043e\u0441\u043d\u043e\u0432\u0435 \u0432\u0441\u0435\u0445 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u043b\u0435\u0436\u0438\u0442 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 <code>ImplicitlyAnimatedWidget<\/code>. \u041e\u043d \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0440\u0430\u043a\u0442 \u0434\u043b\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044e\u0442 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u0432\u043e\u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u043c\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u0442\u044c \u0443 \u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432, \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f: \u00a0 <\/p>\n<ul>\n<li>\n<p><code>duration<\/code>: \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u0430\u043a \u0434\u043e\u043b\u0433\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u043b\u0438\u0442\u044c\u0441\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f. \u042d\u0442\u043e \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440.<\/p>\n<\/li>\n<li>\n<p><code>curve<\/code>: \u0417\u0430\u0434\u0430\u0435\u0442 \u043a\u0440\u0438\u0432\u0443\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0442\u043e \u0435\u0441\u0442\u044c \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u043b\u0430\u0432\u043d\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e \u0438 \u043a\u043e\u043d\u0435\u0446, \u043e\u0442\u0441\u043a\u043e\u043a \u0438 \u0442.\u0434.). \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f <code>Curves.linear<\/code>. \u00a0 <\/p>\n<\/li>\n<li>\n<p><code>onEnd<\/code>: \u041a\u043e\u043b\u0431\u044d\u043a, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.<\/p>\n<\/li>\n<\/ul>\n<p> \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043a\u0440\u0438\u0432\u044b\u0445, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0445 \u0447\u0435\u0440\u0435\u0437 \u043a\u043b\u0430\u0441\u0441  <code>Curves<\/code>, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a <code>easeIn<\/code> (\u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e, \u0437\u0430\u0442\u0435\u043c \u0443\u0441\u043a\u043e\u0440\u0435\u043d\u0438\u0435), <code>easeOut<\/code> (\u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e, \u0437\u0430\u0442\u0435\u043c \u0437\u0430\u043c\u0435\u0434\u043b\u0435\u043d\u0438\u0435), <code>easeInOut<\/code> (\u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e \u0438 \u043a\u043e\u043d\u0435\u0446), <code>bounceIn<\/code> (\u044d\u0444\u0444\u0435\u043a\u0442 \u043e\u0442\u0441\u043a\u043e\u043a\u0430 \u043f\u0440\u0438 \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0438) \u0438 \u043c\u043d\u043e\u0433\u0438\u0435 \u0434\u0440\u0443\u0433\u0438\u0435. \u0412\u044b\u0431\u043e\u0440 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0439 \u043a\u0440\u0438\u0432\u043e\u0439 \u043c\u043e\u0436\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0432\u043e\u0441\u043f\u0440\u0438\u044f\u0442\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.<\/p>\n<p><strong>\u0420\u0430\u0437\u0431\u043e\u0440: <\/strong><code><strong>AnimatedContainer<\/strong><\/code><strong>, <\/strong><code><strong>AnimatedOpacity<\/strong><\/code><strong>, <\/strong><code><strong>AnimatedPositioned<\/strong><\/code><strong> <\/strong><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u043d\u0435\u044f\u0432\u043d\u044b\u0435 \u0432\u0438\u0434\u0436\u0435\u0442\u044b:<\/p>\n<ul>\n<li>\n<p><code><strong>AnimatedContainer<\/strong><\/code>: \u041f\u043e\u0436\u0430\u043b\u0443\u0439, \u043e\u0434\u0438\u043d \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445. \u042d\u0442\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u043e\u0431\u044b\u0447\u043d\u043e\u0433\u043e <code>Container<\/code>. \u041e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043c\u0435\u0436\u0434\u0443 \u0441\u0442\u0430\u0440\u044b\u043c\u0438 \u0438 \u043d\u043e\u0432\u044b\u043c\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438 \u0442\u0430\u043a\u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432, \u043a\u0430\u043a <code>width<\/code>, <code>height<\/code>, <code>color<\/code>, <code>padding<\/code>, <code>margin<\/code>, <code>decoration<\/code> (\u0432\u043a\u043b\u044e\u0447\u0430\u044f <code>borderRadius<\/code>, <code>boxShadow<\/code>, <code>gradient<\/code>), <code>transform<\/code> \u0438 <code>alignment<\/code> \u043f\u0440\u0438 \u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0432 <code>setState<\/code>. \u0421\u0443\u0442\u044c \u0435\u0433\u043e \u0440\u0430\u0431\u043e\u0442\u044b \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043a\u043e\u0433\u0434\u0430  <code>AnimatedContainer<\/code> \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u043d\u043e\u0432\u044b\u043c\u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u043c\u0438, \u043e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043e\u0442 \u0441\u0442\u0430\u0440\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043a \u043d\u043e\u0432\u044b\u043c. \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedContainer class MyAnimatedContainerWidget extends StatefulWidget {   const MyAnimatedContainerWidget({super.key});    @override   State&lt;MyAnimatedContainerWidget&gt; createState() =&gt; _MyAnimatedContainerWidgetState(); }  class _MyAnimatedContainerWidgetState extends State&lt;MyAnimatedContainerWidget&gt; {   bool _selected = false;    @override   Widget build(BuildContext context) {     return GestureDetector(       onTap: () {         setState(() {           _selected =!_selected;         });       },       child: Center(         child: AnimatedContainer(           width: _selected? 200.0 : 100.0,           height: _selected? 100.0 : 200.0,           color: _selected? Colors.blueGrey : Colors.white,           alignment: _selected? Alignment.center : AlignmentDirectional.topCenter,           duration: const Duration(seconds: 1),           curve: Curves.fastOutSlowIn,           child: const FlutterLogo(size: 75),         ),       ),     );   } } <\/code><\/pre>\n<\/li>\n<li>\n<p><code><strong>AnimatedOpacity<\/strong><\/code>: \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c (\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e <code>opacity<\/code>) \u0441\u0432\u043e\u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435  \u00a0 <\/p>\n<p><code>opacity<\/code> \u0432\u0430\u0440\u044c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043e\u0442 0.0 (\u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439) \u0434\u043e 1.0 (\u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043d\u0435\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439). \u041e\u0442\u043b\u0438\u0447\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u043f\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0438\u0441\u0447\u0435\u0437\u043d\u043e\u0432\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedOpacity class MyAnimatedOpacityWidget extends StatefulWidget {   const MyAnimatedOpacityWidget({super.key});    @override   State&lt;MyAnimatedOpacityWidget&gt; createState() =&gt; _MyAnimatedOpacityWidgetState(); }  class _MyAnimatedOpacityWidgetState extends State&lt;MyAnimatedOpacityWidget&gt; {   double _opacityLevel = 1.0;    void _fade() {     setState(() =&gt; _opacityLevel = _opacityLevel == 0? 1.0 : 0.0);   }    @override   Widget build(BuildContext context) {     return Column(       mainAxisAlignment: MainAxisAlignment.center,       children: &lt;Widget&gt;,     );   } } <\/code><\/pre>\n<\/li>\n<li>\n<p><code><strong>AnimatedPositioned<\/strong><\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u0430 <code>Positioned<\/code>. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043f\u043e\u0437\u0438\u0446\u0438\u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 (\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 <code>left<\/code>, <code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>width<\/code>, <code>height<\/code>) \u0432\u043d\u0443\u0442\u0440\u0438 <code>Stack<\/code>. \u0412\u0430\u0436\u043d\u043e \u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u0447\u0442\u043e  \u00a0 <\/p>\n<p><code>AnimatedPositioned<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u0430\u043a \u043f\u0440\u044f\u043c\u043e\u0439 \u043f\u043e\u0442\u043e\u043c\u043e\u043a <code>Stack<\/code>. \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedPositioned class MyAnimatedPositionedWidget extends StatefulWidget {   const MyAnimatedPositionedWidget({super.key});    @override   State&lt;MyAnimatedPositionedWidget&gt; createState() =&gt; _MyAnimatedPositionedWidgetState(); }  class _MyAnimatedPositionedWidgetState extends State&lt;MyAnimatedPositionedWidget&gt; {   bool _selected = false;    @override   Widget build(BuildContext context) {     return SizedBox(       width: 200,       height: 350,       child: Stack(         children: &lt;Widget&gt;,       ),     );   } } <\/code><\/pre>\n<\/li>\n<\/ul>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0445 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a:<\/p>\n<ul>\n<li>\n<p><code>AnimatedAlign<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0432\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p><code>AnimatedDefaultTextStyle<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u0442\u0438\u043b\u044c \u0442\u0435\u043a\u0441\u0442\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043b\u044f \u0441\u0432\u043e\u0438\u0445 \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p><code>AnimatedPadding<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0432\u043e\u043a\u0440\u0443\u0433 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p><code>AnimatedPhysicalModel<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a \u0444\u043e\u0440\u043c\u0430, \u0442\u0435\u043d\u044c, \u0446\u0432\u0435\u0442.<\/p>\n<\/li>\n<li>\n<p><code>AnimatedSize<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u0432\u043e\u0439 \u0440\u0430\u0437\u043c\u0435\u0440, \u043a\u043e\u0433\u0434\u0430 \u0440\u0430\u0437\u043c\u0435\u0440 \u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f.<\/p>\n<\/li>\n<li>\n<p><code>AnimatedCrossFade<\/code>: \u0421\u043e\u0437\u0434\u0430\u0435\u0442 \u043f\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 (cross-fade) \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p><code>AnimatedSwitcher<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043f\u0440\u0438 \u0437\u0430\u043c\u0435\u043d\u0435 \u043e\u0434\u043d\u043e\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0434\u0440\u0443\u0433\u0438\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u0423\u0434\u043e\u0431\u043d\u0443\u044e \u0442\u0430\u0431\u043b\u0438\u0446\u0443 \u0441 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435\u043c \u044d\u0442\u0438\u0445 \u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0439\u0442\u0438 \u0432 <\/p>\n<p><strong>\u0422\u0430\u0431\u043b\u0438\u0446\u0430 2: \u041e\u0431\u0437\u043e\u0440 \u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 ImplicitlyAnimatedWidget&#8217;\u043e\u0432<\/strong><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u0432\u0438\u0434\u0436\u0435\u0442\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041a\u0440\u0430\u0442\u043a\u043e\u0435 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0422\u0438\u043f\u0438\u0447\u043d\u044b\u0439 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0439<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedContainer<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 <code>Container<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>width<\/code>, <code>height<\/code>, <code>color<\/code>, <code>decoration<\/code>, <code>padding<\/code>, <code>margin<\/code>, <code>transform<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 (\u0440\u0430\u0437\u043c\u0435\u0440, \u0446\u0432\u0435\u0442, \u0444\u043e\u0440\u043c\u0430)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedOpacity<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>opacity<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043b\u0430\u0432\u043d\u043e\u0435 \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435\/\u0438\u0441\u0447\u0435\u0437\u043d\u043e\u0432\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedPositioned<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 <code>Stack<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>left<\/code>, <code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>width<\/code>, <code>height<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043b\u0430\u0432\u043d\u043e\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 \u0441\u0442\u0435\u043a\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedAlign<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0432\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>alignment<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043b\u0430\u0432\u043d\u043e\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0432\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedPadding<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0432\u043e\u043a\u0440\u0443\u0433 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>padding<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedDefaultTextStyle<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u0442\u0438\u043b\u044c \u0442\u0435\u043a\u0441\u0442\u0430 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e<\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>style<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043b\u0430\u0432\u043d\u043e\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0441\u0442\u0438\u043b\u044f \u0442\u0435\u043a\u0441\u0442\u0430 \u0434\u043b\u044f \u0433\u0440\u0443\u043f\u043f\u044b \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedCrossFade<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c\u0438<\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>firstChild<\/code>, <code>secondChild<\/code>, <code>crossFadeState<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438 UI \u0441 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u043c \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u044f<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedSwitcher<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043f\u0440\u0438 \u0437\u0430\u043c\u0435\u043d\u0435 \u043e\u0434\u043d\u043e\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0434\u0440\u0443\u0433\u0438\u043c<\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>child<\/code>, <code>transitionBuilder<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0430\u044f \u0441\u043c\u0435\u043d\u0430 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0432 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u044d\u043a\u0440\u0430\u043d\u0430 \u0441 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedSize<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u0432\u043e\u0439 \u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">&#8212; (\u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043d\u0430 \u0440\u0430\u0437\u043c\u0435\u0440 <code>child<\/code>)<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043b\u0430\u0432\u043d\u043e\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430, \u043f\u043e\u0434\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e\u0449\u0435\u0433\u043e\u0441\u044f \u043f\u043e\u0434 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>AnimatedPhysicalModel<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 (\u0442\u0435\u043d\u044c, \u0444\u043e\u0440\u043c\u0430, \u0446\u0432\u0435\u0442) \u0432\u0438\u0434\u0436\u0435\u0442\u0430 <code>PhysicalModel<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>shape<\/code>, <code>elevation<\/code>, <code>color<\/code>, <code>shadowColor<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f &#171;\u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u044c\u043d\u044b\u0445&#187; \u0441\u0432\u043e\u0439\u0441\u0442\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u043f\u043e\u0434\u043d\u044f\u0442\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 (\u0442\u0435\u043d\u044c)<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p><code><strong>TweenAnimationBuilder<\/strong><\/code>: \u0422\u0432\u043e\u0439 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 \u043d\u0435\u044f\u0432\u043d\u044b\u0439 \u0434\u0440\u0443\u0433<\/p>\n<p>\u0427\u0442\u043e \u0435\u0441\u043b\u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u043d\u0435 \u0445\u0432\u0430\u0442\u0430\u0435\u0442, \u0430 \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u0443\u044e \u044f\u0432\u043d\u0443\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043d\u0435 \u0445\u043e\u0447\u0435\u0442\u0441\u044f? \u041d\u0430 \u043f\u043e\u043c\u043e\u0449\u044c \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442 <code>TweenAnimationBuilder<\/code>. \u042d\u0442\u043e\u0442 \u0432\u0438\u0434\u0436\u0435\u0442 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e, \u0438\u043d\u0442\u0435\u0440\u043f\u043e\u043b\u0438\u0440\u0443\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e  <code>Tween<\/code>, \u0431\u0435\u0437 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c <code>AnimationController<\/code>. \u0412\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0435 <code>tween<\/code> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043e\u0442 0.0 \u0434\u043e 1.0), <code>duration<\/code> \u0438 <code>builder<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0432\u0430\u0448 \u0432\u0438\u0434\u0436\u0435\u0442 \u0441 \u043d\u043e\u0432\u044b\u043c \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c.  \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442, \u0447\u0442\u043e  \u00a0 <\/p>\n<p><code>TweenAnimationBuilder<\/code> \u2014 \u044d\u0442\u043e \u043e\u0442\u043b\u0438\u0447\u043d\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435, \u043a\u043e\u0433\u0434\u0430 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 <code>AnimatedWidget<\/code>&#8216;\u044b \u043d\u0435 \u043f\u043e\u043a\u0440\u044b\u0432\u0430\u044e\u0442 \u0432\u0430\u0448\u0438 \u043d\u0443\u0436\u0434\u044b.<\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 TweenAnimationBuilder \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0446\u0432\u0435\u0442\u0430 class MyTweenAnimationBuilderWidget extends StatefulWidget {   const MyTweenAnimationBuilderWidget({super.key});    @override   State&lt;MyTweenAnimationBuilderWidget&gt; createState() =&gt; _MyTweenAnimationBuilderWidgetState(); }  class _MyTweenAnimationBuilderWidgetState extends State&lt;MyTweenAnimationBuilderWidget&gt; {   Color _targetColor = Colors.red;    @override   Widget build(BuildContext context) {     return Column(       mainAxisAlignment: MainAxisAlignment.center,       children:,     );   } } <\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 <code>TweenAnimationBuilder<\/code> \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0446\u0432\u0435\u0442 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 \u043e\u0442 \u0431\u0435\u043b\u043e\u0433\u043e \u0434\u043e <code><em>targetColor<\/em><\/code><em>. \u041f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443 <\/em><code>targetColor<\/code> \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f, \u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0441\u043d\u043e\u0432\u0430.<\/p>\n<p>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u043e \u043e\u0442\u0440\u0430\u0436\u0430\u044e\u0442 \u0434\u0435\u043a\u043b\u0430\u0440\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 Flutter. \u0412\u044b \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0435 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0438 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0432\u0438\u0434\u0436\u0435\u0442\u0430, \u0430 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0431\u0435\u0440\u0435\u0442 \u043d\u0430 \u0441\u0435\u0431\u044f \u0437\u0430\u0431\u043e\u0442\u0443 \u043e \u043f\u043b\u0430\u0432\u043d\u043e\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0435 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438. \u042d\u0442\u043e \u043e\u0447\u0435\u043d\u044c \u043f\u043e\u0445\u043e\u0436\u0435 \u043d\u0430 \u0442\u043e, \u043a\u0430\u043a \u043c\u044b \u0432 \u0446\u0435\u043b\u043e\u043c \u0441\u0442\u0440\u043e\u0438\u043c UI \u0432\u043e Flutter: \u043c\u044b \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u043c,  \u00a0 <\/p>\n<p><em>\u0447\u0442\u043e<\/em> \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435, \u0430 \u043d\u0435 <em>\u043a\u0430\u043a<\/em> \u044d\u0442\u043e \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u0448\u0430\u0433\u043e\u0432\u043e. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0442\u0430\u043a \u043e\u0440\u0433\u0430\u043d\u0438\u0447\u043d\u043e \u0432\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0432 \u0444\u0438\u043b\u043e\u0441\u043e\u0444\u0438\u044e Flutter \u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c \u043f\u0435\u0440\u0432\u044b\u043c \u0448\u0430\u0433\u043e\u043c \u0432 \u043c\u0438\u0440 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0434\u043b\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432, \u0443\u0436\u0435 \u0437\u043d\u0430\u043a\u043e\u043c\u044b\u0445 \u0441 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435\u043c UI. \u041f\u043e \u0441\u0443\u0442\u0438, \u0441 \u043d\u0435\u044f\u0432\u043d\u044b\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438 \u0442\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u0433\u043e\u0432\u043e\u0440\u0438\u0448\u044c \u0424\u043b\u0430\u0442\u0442\u0435\u0440\u0443: &#171;\u0425\u043e\u0447\u0443, \u0447\u0442\u043e\u0431\u044b \u044d\u0442\u043e\u0442 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 \u0441\u0442\u0430\u043b \u0437\u0435\u043b\u0435\u043d\u044b\u043c \u0438 \u0431\u043e\u043b\u044c\u0448\u0438\u043c \u0447\u0435\u0440\u0435\u0437 \u0441\u0435\u043a\u0443\u043d\u0434\u0443&#187;. \u0418 \u043e\u043d \u0442\u0430\u043a\u043e\u0439: &#171;\u041e\u043a\u0435\u0439, \u0431\u043e\u0441\u0441, \u0441\u0434\u0435\u043b\u0430\u044e \u043a\u0440\u0430\u0441\u0438\u0432\u043e!&#187; \u041d\u0438\u043a\u0430\u043a\u0438\u0445 \u0442\u0435\u0431\u0435 \u0440\u0443\u0447\u043d\u044b\u0445 \u043f\u043e\u0434\u0441\u0447\u0435\u0442\u043e\u0432 \u043a\u0430\u0434\u0440\u043e\u0432.<\/p>\n<h4>1.3. \u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: \u0411\u0435\u0440\u0435\u043c \u0432\u0441\u0451 \u043f\u043e\u0434 \u0441\u0432\u043e\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c<\/h4>\n<p>\u041a\u043e\u0433\u0434\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u043a\u043e\u0433\u0434\u0430 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u043a\u0430\u0436\u0434\u044b\u043c \u0430\u0441\u043f\u0435\u043a\u0442\u043e\u043c \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f, \u043d\u0430 \u0441\u0446\u0435\u043d\u0443 \u0432\u044b\u0445\u043e\u0434\u044f\u0442 \u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u0417\u0434\u0435\u0441\u044c \u043c\u044b \u0441\u0430\u043c\u0438 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u043c\u0441\u044f \u0440\u0435\u0436\u0438\u0441\u0441\u0435\u0440\u0430\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044f \u0432\u0441\u0435 \u0435\u0433\u043e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b. \u00a0 <\/p>\n<p><strong>\u0421\u0435\u0440\u0434\u0446\u0435 \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: <\/strong><code><strong>AnimationController<\/strong><\/code><strong> \u2013 \u0434\u0438\u0440\u0438\u0436\u0435\u0440 \u043e\u0440\u043a\u0435\u0441\u0442\u0440\u0430<\/strong><\/p>\n<p><code>AnimationController<\/code> \u2014 \u044d\u0442\u043e \u0446\u0435\u043d\u0442\u0440\u0430\u043b\u044c\u043d\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u044f\u0432\u043d\u044b\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438. \u0415\u0433\u043e \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0437\u0430\u0434\u0430\u0447\u0438: \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439:<\/strong> \u041e\u043d \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c (<code>forward()<\/code>), \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c (<code>stop()<\/code>), \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c (<code>repeat()<\/code>), \u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 (<code>reverse()<\/code>) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0413\u0435\u043d\u0435\u0440\u0430\u0446\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439:<\/strong> \u0412 \u0442\u0435\u0447\u0435\u043d\u0438\u0435 \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0439 <code>duration<\/code> (\u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438) \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0447\u0438\u0441\u0435\u043b, \u043e\u0431\u044b\u0447\u043d\u043e \u043e\u0442 0.0 \u0434\u043e 1.0. \u042d\u0442\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0437\u0430\u0442\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0438\u043d\u0442\u0435\u0440\u043f\u043e\u043b\u044f\u0446\u0438\u0438 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p><strong>\u0422\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u0435 <\/strong><code><strong>TickerProvider<\/strong><\/code><strong>:<\/strong> \u0414\u043b\u044f \u0441\u0432\u043e\u0435\u0439 \u0440\u0430\u0431\u043e\u0442\u044b <code>AnimationController<\/code> \u043d\u0443\u0436\u0434\u0430\u0435\u0442\u0441\u044f \u0432 <code>TickerProvider<\/code>. <code>Ticker<\/code> \u2014 \u044d\u0442\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u0440\u043e\u0434\u0430 \u043c\u0435\u0442\u0440\u043e\u043d\u043e\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u0443\u0435\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u0441 \u0447\u0430\u0441\u0442\u043e\u0442\u043e\u0439 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u044d\u043a\u0440\u0430\u043d\u0430. \u041e\u0431\u044b\u0447\u043d\u043e \u0432 <code>State<\/code> \u0432\u0430\u0448\u0435\u0433\u043e <code>StatefulWidget<\/code> \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043c\u0438\u043a\u0441\u0438\u043d <code>SingleTickerProviderStateMixin<\/code> (\u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u043e\u0434\u0438\u043d <code>AnimationController<\/code>) \u0438\u043b\u0438 <code>TickerProviderStateMixin<\/code> (\u0435\u0441\u043b\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u0432 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e). \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0440\u0435\u0441\u0443\u0440\u0441\u0430\u043c\u0438:<\/strong> \u041a\u0440\u0430\u0439\u043d\u0435 \u0432\u0430\u0436\u043d\u043e \u043e\u0441\u0432\u043e\u0431\u043e\u0436\u0434\u0430\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u044b, \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u043c\u044b\u0435 <code>AnimationController<\/code>, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0435 \u043d\u0443\u0436\u0435\u043d. \u042d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u0432\u044b\u0437\u043e\u0432\u043e\u043c \u043c\u0435\u0442\u043e\u0434\u0430 <code>dispose()<\/code> \u0432 \u043c\u0435\u0442\u043e\u0434\u0435 <code>dispose()<\/code> \u0432\u0430\u0448\u0435\u0433\u043e <code>State<\/code> \u043c\u0435\u0442\u043a\u043e \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442  \u00a0 <code>AnimationController<\/code> \u043a\u0430\u043a \u0441\u043f\u043e\u0441\u043e\u0431 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439, \u043d\u043e \u0435\u0433\u043e \u0433\u043b\u0430\u0432\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u2013 \u00ab\u0434\u0432\u0438\u0433\u0430\u0442\u044c\u00bb \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e.  \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u043b\u044e\u0431\u043e\u0439 \u043a\u043b\u0430\u0441\u0441, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439  \u00a0 <code>AnimationController<\/code>, \u0434\u043e\u043b\u0436\u0435\u043d \u0438\u043c\u0435\u0442\u044c <code>TickerProviderStateMixin<\/code>.<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimationController class MyExplicitAnimationWidget extends StatefulWidget {   const MyExplicitAnimationWidget({super.key});    @override   State&lt;MyExplicitAnimationWidget&gt; createState() =&gt; _MyExplicitAnimationWidgetState(); }  class _MyExplicitAnimationWidgetState extends State&lt;MyExplicitAnimationWidget&gt;     with SingleTickerProviderStateMixin { \/\/ \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u043c\u0438\u043a\u0441\u0438\u043d   late AnimationController _controller;   late Animation&lt;double&gt; _animation;    @override   void initState() {     super.initState();     _controller = AnimationController(       duration: const Duration(seconds: 2),       vsync: this, \/\/ \u041f\u0435\u0440\u0435\u0434\u0430\u0435\u043c this \u043a\u0430\u043a TickerProvider     );      \/\/ _animation \u0431\u0443\u0434\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u043e\u0442 0.0 \u0434\u043e 1.0     _animation = CurvedAnimation(parent: _controller, curve: Curves.easeIn);      _controller.forward(); \/\/ \u0417\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e   }    @override   void dispose() {     _controller.dispose(); \/\/ \u041d\u0435 \u0437\u0430\u0431\u044b\u0432\u0430\u0435\u043c \u043e\u0441\u0432\u043e\u0431\u043e\u0436\u0434\u0430\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u044b!     super.dispose();   }    @override   Widget build(BuildContext context) {     \/\/ \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c _animation.value \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432     return ScaleTransition( \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0433\u043e\u0442\u043e\u0432\u043e\u0433\u043e Transition-\u0432\u0438\u0434\u0436\u0435\u0442\u0430       scale: _animation,       child: const Padding(         padding: EdgeInsets.all(8.0),         child: FlutterLogo(size: 150.0),       ),     );   } } <\/code><\/pre>\n<p><code><strong>Tween<\/strong><\/code><strong>: \u041f\u0443\u0442\u044c \u043e\u0442 \u0410 \u0434\u043e \u042f <\/strong><\/p>\n<p>\u0421\u0430\u043c \u043f\u043e \u0441\u0435\u0431\u0435 <code>AnimationController<\/code> \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0434\u0438\u0430\u043f\u0430\u0437\u043e\u043d\u0435 \u043e\u0442 0.0 \u0434\u043e 1.0. \u0427\u0442\u043e\u0431\u044b \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u043c\u0435\u0440 \u043e\u0442 100 \u0434\u043e 200 \u043f\u0438\u043a\u0441\u0435\u043b\u0435\u0439 \u0438\u043b\u0438 \u0446\u0432\u0435\u0442 \u043e\u0442 \u043a\u0440\u0430\u0441\u043d\u043e\u0433\u043e \u0434\u043e \u0441\u0438\u043d\u0435\u0433\u043e), \u043d\u0430\u043c \u043d\u0443\u0436\u0435\u043d <code>Tween<\/code> (\u0441\u043e\u043a\u0440\u0430\u0449\u0435\u043d\u0438\u0435 \u043e\u0442 &#171;in-between&#187;). \u00a0 <\/p>\n<p><code>Tween<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 (<code>begin<\/code>) \u0438 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0435 (<code>end<\/code>) \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430. \u041e\u043d \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u0435\u0442\u043e\u0434  \u00a0<code>transform(double t)<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0432\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f <code>t<\/code> (\u043e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e <code>value<\/code> \u043e\u0442 <code>AnimationController<\/code>, \u043e\u0442 0.0 \u0434\u043e 1.0) \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442 \u043f\u0440\u043e\u043c\u0435\u0436\u0443\u0442\u043e\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430.<\/p>\n<p>Flutter \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0442\u0438\u043f\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0445 <code>Tween<\/code>&#8216;\u043e\u0432 \u0434\u043b\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0442\u0438\u043f\u043e\u0432 \u0434\u0430\u043d\u043d\u044b\u0445 : \u00a0 <\/p>\n<ul>\n<li>\n<p><code>Tween&lt;double&gt;<\/code>: \u0434\u043b\u044f \u0447\u0438\u0441\u0435\u043b \u0441 \u043f\u043b\u0430\u0432\u0430\u044e\u0449\u0435\u0439 \u0442\u043e\u0447\u043a\u043e\u0439 (\u0440\u0430\u0437\u043c\u0435\u0440, \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c).<\/p>\n<\/li>\n<li>\n<p><code>ColorTween<\/code>: \u0434\u043b\u044f \u0446\u0432\u0435\u0442\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p><code>RectTween<\/code>: \u0434\u043b\u044f \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u0445).<\/p>\n<\/li>\n<li>\n<p><code>SizeTween<\/code>: \u0434\u043b\u044f \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p><code>IntTween<\/code>: \u0434\u043b\u044f \u0446\u0435\u043b\u044b\u0445 \u0447\u0438\u0441\u0435\u043b.<\/p>\n<\/li>\n<li>\n<p><code>AlignmentTween<\/code>: \u0434\u043b\u044f \u0432\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0439.<\/p>\n<\/li>\n<li>\n<p>\u0418 \u043c\u043d\u043e\u0433\u0438\u0435 \u0434\u0440\u0443\u0433\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<p>\u0427\u0442\u043e\u0431\u044b \u0441\u0432\u044f\u0437\u0430\u0442\u044c <code>Tween<\/code> \u0441 <code>AnimationController<\/code> (\u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0439 <code>Animation<\/code>), \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043c\u0435\u0442\u043e\u0434 <code>animate()<\/code>. \u041e\u043d \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043d\u043e\u0432\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 <code>Animation<\/code>, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0431\u0443\u0434\u0443\u0442 \u0438\u043d\u0442\u0435\u0440\u043f\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f <code>Tween<\/code>&#8216;\u043e\u043c \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0439 <code>Animation<\/code>.<\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f Tween \/\/ \u0412\u043d\u0443\u0442\u0440\u0438 initState \u0432\u0430\u0448\u0435\u0433\u043e State... \/\/ _controller = AnimationController(...);  \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u043e\u0442 100.0 \u0434\u043e 200.0 final Animation&lt;double&gt; sizeAnimation = Tween&lt;double&gt;(begin: 100.0, end: 200.0)    .animate(_controller);  \/\/ \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0446\u0432\u0435\u0442\u0430 \u043e\u0442 Colors.red \u0434\u043e Colors.blue final Animation&lt;Color?&gt; colorAnimation = ColorTween(begin: Colors.red, end: Colors.blue)    .animate(_controller); <\/code><\/pre>\n<p> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442  <code>Tween<\/code> \u043a\u0430\u043a \u0438\u043d\u0442\u0435\u0440\u043f\u043e\u043b\u044f\u0446\u0438\u044e \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u0442\u0438\u043f\u0430.<\/p>\n<p><code><strong>Curve<\/strong><\/code><strong>: \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440 \u0438 \u0438\u0437\u044e\u043c\u0438\u043d\u043a\u0443<\/strong><\/p>\n<p>\u041b\u0438\u043d\u0435\u0439\u043d\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f (\u043a\u043e\u0433\u0434\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e\u0439 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\u044e) \u0447\u0430\u0441\u0442\u043e \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0441\u043a\u0443\u0447\u043d\u043e \u0438 \u043d\u0435\u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e. \u0427\u0442\u043e\u0431\u044b \u043f\u0440\u0438\u0434\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u043a\u0440\u0438\u0432\u044b\u0435 (<code>Curve<\/code>). <\/p>\n<p><code>Curve<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u0430\u043a \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043c\u043e\u0436\u0435\u0442 \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c\u0441\u044f \u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e, \u0437\u0430\u0442\u0435\u043c \u0443\u0441\u043a\u043e\u0440\u044f\u0442\u044c\u0441\u044f, \u0430 \u043a \u043a\u043e\u043d\u0446\u0443 \u0441\u043d\u043e\u0432\u0430 \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u0442\u044c\u0441\u044f ( <code>easeInOut<\/code>). \u0418\u043b\u0438 \u043e\u043d\u0430 \u043c\u043e\u0436\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u044d\u0444\u0444\u0435\u043a\u0442 &#171;\u043e\u0442\u0441\u043a\u043e\u043a\u0430&#187; (<code>bounceIn<\/code>). \u041a\u043b\u0430\u0441\u0441 <code>Curves<\/code> \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u0435\u0434\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u043a\u0440\u0438\u0432\u044b\u0445. \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u043a\u0440\u0438\u0432\u0430\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u0443\u0435\u0442, \u043a\u0430\u043a \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430. \u00a0 <\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c <code>Curve<\/code> \u043a <code>Animation<\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0432\u0438\u0434\u0436\u0435\u0442 <code>CurvedAnimation<\/code>:<\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f Curve \/\/ \u0412\u043d\u0443\u0442\u0440\u0438 initState... \/\/ _controller = AnimationController(...);  final Animation&lt;double&gt; curvedAnimation = CurvedAnimation(   parent: _controller, \/\/ \u0411\u0430\u0437\u043e\u0432\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f (\u043e\u0431\u044b\u0447\u043d\u043e AnimationController)   curve: Curves.elasticInOut, \/\/ \u0412\u044b\u0431\u0438\u0440\u0430\u0435\u043c \u0436\u0435\u043b\u0430\u0435\u043c\u0443\u044e \u043a\u0440\u0438\u0432\u0443\u044e );  \/\/ \u0422\u0435\u043f\u0435\u0440\u044c curvedAnimation.value \u0431\u0443\u0434\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u0432 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u043a\u0440\u0438\u0432\u043e\u0439 elasticInOut, \/\/ \u043d\u043e \u043f\u043e-\u043f\u0440\u0435\u0436\u043d\u0435\u043c\u0443 \u0432 \u0434\u0438\u0430\u043f\u0430\u0437\u043e\u043d\u0435 \u043e\u0442 0.0 \u0434\u043e 1.0. \/\/ \u0415\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0432 Tween.animate(): final Animation&lt;double&gt; sizeAnimationWithCurve = Tween&lt;double&gt;(begin: 50.0, end: 150.0)    .animate(curvedAnimation); <\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043a\u0440\u0438\u0432\u044b\u0445 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0441\u0432\u043e\u044e, \u0443\u043d\u0430\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0432\u0448\u0438\u0441\u044c \u043e\u0442 \u043a\u043b\u0430\u0441\u0441\u0430 <code>Curve<\/code> \u0438 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0432 \u043c\u0435\u0442\u043e\u0434 <code>transformInternal(double t)<\/code>. \u0422\u0430\u043a\u0436\u0435 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043f\u0430\u043a\u0435\u0442 <code>flutter_curve<\/code> , \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u043d\u0430\u0431\u043e\u0440 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438-\u043e\u0431\u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u043a\u0440\u0438\u0432\u044b\u0445, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a  \u00a0<code>SpringCurve<\/code> \u0438\u043b\u0438 <code>GravityCurve<\/code>.<\/p>\n<p><strong>\u041a\u0430\u043a \u044d\u0442\u043e \u0432\u0441\u0451 \u043e\u0436\u0438\u0432\u0438\u0442\u044c: <\/strong><code><strong>addListener<\/strong><\/code><strong>+<\/strong><code><strong>setState<\/strong><\/code><strong> vs <\/strong><code><strong>AnimatedWidget<\/strong><\/code><strong> vs <\/strong><code><strong>AnimatedBuilder<\/strong><\/code><\/p>\n<p>\u0415\u0441\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043f\u043e\u0441\u043e\u0431\u043e\u0432 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043a \u0432\u0430\u0448\u0438\u043c \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c:<\/p>\n<ol>\n<li>\n<p><code><strong>addListener<\/strong><\/code><strong> + <\/strong><code><strong>setState()<\/strong><\/code>: \u042d\u0442\u043e \u0441\u0430\u043c\u044b\u0439 \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043f\u043e\u0434\u0445\u043e\u0434. \u0412\u044b \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442\u0435 \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044f \u043a <code>AnimationController<\/code> \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u0435\u0442\u043e\u0434\u0430 <code>addListener()<\/code>. \u0412\u043d\u0443\u0442\u0440\u0438 \u044d\u0442\u043e\u0433\u043e \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044f \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f <code>setState(() {})<\/code>. \u042d\u0442\u043e \u0441\u043e\u043e\u0431\u0449\u0430\u0435\u0442 Flutter, \u0447\u0442\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u043e\u0441\u044c \u0438 \u0432\u0438\u0434\u0436\u0435\u0442 \u043d\u0443\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0438\u0442\u044c. \u0412 \u043c\u0435\u0442\u043e\u0434\u0435 <code>build()<\/code> \u0432\u044b \u0437\u0430\u0442\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 <code>_animation.value<\/code> \u0434\u043b\u044f \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432. \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u041d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u043a:<\/strong> <code>setState()<\/code> \u0431\u0435\u0437 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442 \u0432\u0435\u0441\u044c \u0432\u0438\u0434\u0436\u0435\u0442, \u0447\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043d\u0435\u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e, \u0435\u0441\u043b\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0435\u0433\u043e \u0447\u0430\u0441\u0442\u044c. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"dart\">\/\/ \u0412 initState: \/\/ _controller.addListener(() { \/\/   setState(() {}); \/\/ }); \/\/ \u0412 build: \/\/ Container(width: sizeAnimation.value,...); <\/code><\/pre>\n<\/li>\n<li>\n<p><code><strong>AnimatedWidget<\/strong><\/code>: \u042d\u0442\u043e \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043a\u043b\u0430\u0441\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0443\u043f\u0440\u043e\u0449\u0430\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0432\u0438\u0434\u0436\u0435\u0442\u0430, \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043d\u043e\u0439 <code>Animation<\/code>. \u0412\u044b \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0435 \u0441\u0432\u043e\u0439 \u043a\u043b\u0430\u0441\u0441, \u043d\u0430\u0441\u043b\u0435\u0434\u0443\u044f\u0441\u044c \u043e\u0442 <code>AnimatedWidget<\/code>, \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0435 \u0435\u043c\u0443 <code>Animation<\/code> \u0447\u0435\u0440\u0435\u0437 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 \u044d\u0442\u0443 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u0432 \u043c\u0435\u0442\u043e\u0434\u0435 <code>build()<\/code>. <code>AnimatedWidget<\/code> \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u043e\u0441\u043b\u0443\u0448\u0438\u0432\u0430\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 <code>Animation<\/code> \u0438 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0435\u0431\u044f, \u043a\u043e\u0433\u0434\u0430 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f. \u042d\u0442\u043e \u0431\u043e\u043b\u0435\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e, \u0447\u0435\u043c <code>addListener<\/code> + <code>setState()<\/code>, \u0438 \u0445\u043e\u0440\u043e\u0448\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432. \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ class MyScaleTransition extends AnimatedWidget { \/\/   const MyScaleTransition({ \/\/     Key? key, \/\/     required Animation&lt;double&gt; scale, \/\/     this.child, \/\/   }) : super(key: key, listenable: scale); \/\/ \/\/   final Widget? child; \/\/ \/\/   Animation&lt;double&gt; get scale =&gt; listenable as Animation&lt;double&gt;; \/\/ \/\/   @override \/\/   Widget build(BuildContext context) { \/\/     return Transform.scale( \/\/       scale: scale.value, \/\/       child: child, \/\/     ); \/\/   } \/\/ } <\/code><\/pre>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 <code>*Transition<\/code> \u0432\u0438\u0434\u0436\u0435\u0442\u044b (\u0441\u043c. \u043d\u0438\u0436\u0435) \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043f\u043e\u0442\u043e\u043c\u043a\u0430\u043c\u0438 <code>AnimatedWidget<\/code>.<\/p>\n<\/li>\n<li>\n<p><code><strong>AnimatedBuilder<\/strong><\/code>: \u042d\u0442\u043e \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0433\u0438\u0431\u043a\u0438\u0439 \u0438 \u0447\u0430\u0441\u0442\u043e \u0440\u0435\u043a\u043e\u043c\u0435\u043d\u0434\u0443\u0435\u043c\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0434\u043b\u044f \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043a\u043e\u0433\u0434\u0430 \u0440\u0435\u0447\u044c \u0438\u0434\u0435\u0442 \u043e\u0431 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<ul>\n<li>\n<p><code>AnimatedBuilder<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 <code>animation<\/code> (\u043e\u0431\u044a\u0435\u043a\u0442 <code>Listenable<\/code>, \u043e\u0431\u044b\u0447\u043d\u043e <code>AnimationController<\/code>) \u0438 \u0444\u0443\u043d\u043a\u0446\u0438\u044e <code>builder<\/code>. \u042d\u0442\u0430 <code>builder<\/code> \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 <code>animation<\/code> \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u044f\u0435\u0442 \u043e\u0431 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e \u0434\u043b\u044f \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438:<\/strong> <code>AnimatedBuilder<\/code> \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u043d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 <code>child<\/code>. \u042d\u0442\u043e\u0442 <code>child<\/code> \u0432\u0438\u0434\u0436\u0435\u0442 \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0432 <code>builder<\/code> \u0444\u0443\u043d\u043a\u0446\u0438\u044e, \u043d\u043e \u0441\u0430\u043c \u043f\u043e \u0441\u0435\u0431\u0435 <strong>\u043d\u0435 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f<\/strong> \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0442\u0438\u043a\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0439\u043a\u0443 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u0434\u0435\u0440\u0435\u0432\u0430 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p> \u043f\u0440\u044f\u043c\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435  \u00a0 <\/p>\n<p><code>child<\/code> \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u043c\u043e\u0436\u0435\u0442 \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0443\u043b\u0443\u0447\u0448\u0438\u0442\u044c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p>\u0425\u043e\u0442\u044f  \u0443\u043f\u043e\u043c\u0438\u043d\u0430\u0435\u0442, \u0447\u0442\u043e  \u00a0 <\/p>\n<p><code>AnimatedWidget<\/code> \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u0435\u0435 <code>AnimationBuilder<\/code> \u0432 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445, \u043e\u0431\u0449\u0435\u043f\u0440\u0438\u043d\u044f\u0442\u043e\u0439 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u043e\u0439 \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0435\u0432 \u0441 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <code>AnimatedBuilder<\/code> \u0441 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <code>child<\/code>.<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedBuilder \/\/ \u0412 build \u043c\u0435\u0442\u043e\u0434\u0435 \u0432\u0430\u0448\u0435\u0433\u043e State: \/\/ AnimatedBuilder( \/\/   animation: _controller, \/\/   builder: (BuildContext context, Widget? child) { \/\/     \/\/ \u042d\u0442\u0430 \u0447\u0430\u0441\u0442\u044c \u0431\u0443\u0434\u0435\u0442 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c\u0441\u044f \/\/     return Transform.rotate( \/\/       angle: _controller.value * 2.0 * math.pi, \/\/       child: child, \/\/ \u042d\u0442\u043e\u0442 child \u041d\u0415 \u0431\u0443\u0434\u0435\u0442 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c\u0441\u044f \/\/     ); \/\/   }, \/\/   child: const FlutterLogo(size: 100), \/\/ \u042d\u0442\u043e\u0442 \u0432\u0438\u0434\u0436\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0440\u0430\u0437 \/\/ ); <\/code><\/pre>\n<\/li>\n<\/ol>\n<p><strong>\u0413\u043e\u0442\u043e\u0432\u044b\u0435 \u044f\u0432\u043d\u044b\u0435 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b: <\/strong><code><strong>FadeTransition<\/strong><\/code><strong>, <\/strong><code><strong>SizeTransition<\/strong><\/code><strong>, <\/strong><code><strong>SlideTransition<\/strong><\/code><strong>, <\/strong><code><strong>ScaleTransition<\/strong><\/code><strong>, <\/strong><code><strong>RotationTransition<\/strong><\/code><strong>, <\/strong><code><strong>PositionedTransition<\/strong><\/code><strong> \u0438 \u0434\u0440.<\/strong><\/p>\n<p>Flutter SDK \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043d\u0430\u0431\u043e\u0440 \u0433\u043e\u0442\u043e\u0432\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432-\u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 (transitions), \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043f\u043e\u0434\u043a\u043b\u0430\u0441\u0441\u0430\u043c\u0438 <code>AnimatedWidget<\/code>. \u041e\u043d\u0438 \u0438\u043d\u043a\u0430\u043f\u0441\u0443\u043b\u0438\u0440\u0443\u044e\u0442 \u043e\u0431\u0449\u0438\u0435 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0434\u043b\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432. \u0412\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0435 \u0438\u043c  \u00a0 <\/p>\n<p><code>Animation&lt;double&gt;<\/code> (\u043e\u0431\u044b\u0447\u043d\u043e \u044d\u0442\u043e <code>AnimationController<\/code> \u0438\u043b\u0438 <code>CurvedAnimation<\/code>), \u0438 \u043e\u043d\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044e\u0442 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430:<\/p>\n<ul>\n<li>\n<p><code>FadeTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p><code>ScaleTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p><code>RotationTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0432\u0440\u0430\u0449\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p><code>SizeTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0440\u0430\u0437\u043c\u0435\u0440 \u0432\u0434\u043e\u043b\u044c \u043e\u0434\u043d\u043e\u0439 \u0438\u043b\u0438 \u0434\u0432\u0443\u0445 \u043e\u0441\u0435\u0439 (\u0442\u0440\u0435\u0431\u0443\u0435\u0442 <code>axis<\/code> \u0438 <code>axisAlignment<\/code>).<\/p>\n<\/li>\n<li>\n<p><code>SlideTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u0435 (\u0441\u0434\u0432\u0438\u0433) \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u043e\u0437\u0438\u0446\u0438\u0438. \u0422\u0440\u0435\u0431\u0443\u0435\u0442 <code>Animation&lt;Offset&gt;<\/code>.<\/p>\n<\/li>\n<li>\n<p><code>PositionedTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0438 \u0440\u0430\u0437\u043c\u0435\u0440 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0432\u043d\u0443\u0442\u0440\u0438 <code>Stack<\/code>. \u0422\u0440\u0435\u0431\u0443\u0435\u0442 <code>Animation&lt;RelativeRect&gt;<\/code>.<\/p>\n<\/li>\n<li>\n<p><code>DecoratedBoxTransition<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 <code>Decoration<\/code>. \u0422\u0440\u0435\u0431\u0443\u0435\u0442 <code>Animation&lt;Decoration&gt;<\/code>.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442  <code>SlideTransition<\/code> \u0438 <code>SizeTransition<\/code> \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0432\u044b\u0434\u0432\u0438\u0433\u0430\u044e\u0449\u0435\u0439\u0441\u044f \u043f\u0430\u043d\u0435\u043b\u0438 \u043f\u043e\u0434 AppBar.<\/p>\n<p>\u0421\u0438\u043b\u0430 \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0442\u043e\u0447\u043d\u043e\u043c \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0435 \u043d\u0430\u0434 \u043e\u0434\u043d\u0438\u043c \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e\u043c, \u043d\u043e \u0438 \u0432 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0435, \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0438\u043b\u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0438 \u043f\u0443\u0442\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u0438 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432: <code>AnimationController<\/code>, <code>Tween<\/code> \u0438 <code>Curve<\/code>. \u041e\u0434\u0438\u043d \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u043c\u043e\u0436\u0435\u0442 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438  \u00a0 <\/p>\n<p><code>Tween<\/code> (\u0447\u0435\u0440\u0435\u0437 \u0440\u0430\u0437\u043d\u044b\u0435 <code>Animation<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u044b, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0435 \u0438\u0437 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 \u0441 \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u043a\u0440\u0438\u0432\u044b\u043c\u0438 \u0438\u043b\u0438 \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b\u0430\u043c\u0438), \u0438\u043b\u0438 \u0440\u0430\u0437\u043d\u044b\u0435 <code>Tween<\/code> \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u0435 <code>Curve<\/code>. <code>AnimatedBuilder<\/code> \u0437\u0430\u0442\u0435\u043c \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c \u044d\u0442\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043a \u0440\u0430\u0437\u043d\u044b\u043c \u0447\u0430\u0441\u0442\u044f\u043c \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0438\u043b\u0438 \u0440\u0430\u0437\u043d\u044b\u043c \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c. \u042d\u0442\u043e \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u0435\u0442 \u0434\u0432\u0435\u0440\u0438 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0445 \u0438 \u0432\u044b\u0440\u0430\u0437\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u043e\u0447\u043d\u043e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0442 \u0432\u0430\u0448\u0435\u043c\u0443 \u0432\u0438\u0434\u0435\u043d\u0438\u044e. \u0421 \u044f\u0432\u043d\u044b\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438 \u0442\u044b \u043a\u0430\u043a \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0442\u043e\u0440: \u0443 \u0442\u0435\u0431\u044f \u0435\u0441\u0442\u044c \u043d\u043e\u0442\u044b (<code>Tween<\/code>), \u0440\u0438\u0442\u043c (<code>Curve<\/code>) \u0438 \u0434\u0438\u0440\u0438\u0436\u0435\u0440\u0441\u043a\u0430\u044f \u043f\u0430\u043b\u043e\u0447\u043a\u0430 (<code>AnimationController<\/code>). \u0421\u043e\u0435\u0434\u0438\u043d\u044f\u0439 \u0438\u0445 \u043a\u0430\u043a \u0445\u043e\u0447\u0435\u0448\u044c, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0441\u0432\u043e\u044e \u0441\u0438\u043c\u0444\u043e\u043d\u0438\u044e \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f!<\/p>\n<h3>\u0413\u043b\u0430\u0432\u0430 2: \u0412\u044b\u0441\u0448\u0438\u0439 \u041f\u0438\u043b\u043e\u0442\u0430\u0436 \u2013 \u041f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0435 \u0422\u0435\u0445\u043d\u0438\u043a\u0438 \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/h3>\n<p>\u041e\u0441\u0432\u043e\u0438\u0432 \u043e\u0441\u043d\u043e\u0432\u044b \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0438 \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043f\u043e\u0440\u0430 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u0442\u044c \u043a \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u043c \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u043d\u044b\u043c \u0442\u0440\u044e\u043a\u0430\u043c. \u042d\u0442\u0430 \u0433\u043b\u0430\u0432\u0430 \u043f\u043e\u0441\u0432\u044f\u0449\u0435\u043d\u0430 \u0442\u0435\u0445\u043d\u0438\u043a\u0430\u043c, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0432\u043f\u0435\u0447\u0430\u0442\u043b\u044f\u044e\u0449\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0443 \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435 &#171;\u0436\u0438\u0432\u043e\u0441\u0442\u0438&#187; \u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u043c\u0430.<\/p>\n<h4>2.1. Staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: \u0425\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u044f \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0441\u0446\u0435\u043d<\/h4>\n<p>Staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 (\u0441\u0442\u0443\u043f\u0435\u043d\u0447\u0430\u0442\u044b\u0435 \u0438\u043b\u0438 \u043a\u0430\u0441\u043a\u0430\u0434\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438) \u2014 \u044d\u0442\u043e \u0442\u0435\u0445\u043d\u0438\u043a\u0430, \u043f\u0440\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u044f\u0442\u0441\u044f \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0441 \u043f\u0435\u0440\u0435\u043a\u0440\u044b\u0442\u0438\u0435\u043c \u0438\u043b\u0438 \u0441 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u0430\u043c\u0438, \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0439, \u0445\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u044b\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u0439 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442. \u0412\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e, \u043e\u043d\u0438 \u0432\u0441\u0442\u0443\u043f\u0430\u044e\u0442 \u0432 \u0438\u0433\u0440\u0443 \u043f\u043e \u043e\u0447\u0435\u0440\u0435\u0434\u0438, \u0447\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u043e\u0447\u0435\u043d\u044c \u044d\u043b\u0435\u0433\u0430\u043d\u0442\u043d\u043e \u0438 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e. <\/p>\n<p><strong>\u0427\u0442\u043e \u044d\u0442\u043e \u0442\u0430\u043a\u043e\u0435?<\/strong> \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435 \u0441\u0435\u0431\u0435 \u0441\u043f\u0438\u0441\u043e\u043a \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u043d\u0435 \u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443, \u0430 \u043e\u0434\u0438\u043d \u0437\u0430 \u0434\u0440\u0443\u0433\u0438\u043c, \u0441 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u043e\u0439. \u0418\u043b\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442, \u0443 \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c), \u0437\u0430\u0442\u0435\u043c, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e \u0441 \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u043c \u043f\u0435\u0440\u0435\u043a\u0440\u044b\u0442\u0438\u0435\u043c, \u0434\u0440\u0443\u0433\u043e\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u043c\u0435\u0440), \u0430 \u043f\u043e\u0442\u043e\u043c \u0442\u0440\u0435\u0442\u044c\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0446\u0432\u0435\u0442). \u042d\u0442\u043e \u0438 \u0435\u0441\u0442\u044c staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<p><strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b:<\/strong> \u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u043e Flutter \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b : \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u041e\u0434\u0438\u043d <\/strong><code><strong>AnimationController<\/strong><\/code>: \u041e\u043d \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442 \u043e\u0431\u0449\u0438\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c \u0432\u0441\u0435\u0439 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. \u0415\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043e\u0442 0.0 \u0434\u043e 1.0.<\/p>\n<\/li>\n<li>\n<p><strong>\u041c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432 <\/strong><code><strong>Animation<\/strong><\/code>: \u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0438\u043b\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u0441\u0432\u043e\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 <code>Animation<\/code>.<\/p>\n<\/li>\n<li>\n<p><code><strong>Interval<\/strong><\/code><strong> \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e <\/strong><code><strong>Animation<\/strong><\/code>: \u042d\u0442\u043e \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442. <code>Interval<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u0432 \u043a\u0430\u043a\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u043e\u0431\u0449\u0435\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 <code>AnimationController<\/code> (\u043e\u0442 0.0 \u0434\u043e 1.0) \u0431\u0443\u0434\u0435\u0442 \u0430\u043a\u0442\u0438\u0432\u043d\u0430 \u0434\u0430\u043d\u043d\u0430\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u0430\u044f <code>Animation<\/code>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b <code>Interval(0.0, 0.5)<\/code> \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u043f\u0435\u0440\u0432\u043e\u0439 \u043f\u043e\u043b\u043e\u0432\u0438\u043d\u0435 \u043e\u0431\u0449\u0435\u0433\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438, \u0430 <code>Interval(0.5, 1.0)<\/code> \u2014 \u0432\u043e \u0432\u0442\u043e\u0440\u043e\u0439. \u0418\u043d\u0442\u0435\u0440\u0432\u0430\u043b\u044b \u043c\u043e\u0433\u0443\u0442 \u043f\u0435\u0440\u0435\u043a\u0440\u044b\u0432\u0430\u0442\u044c\u0441\u044f.<\/p>\n<\/li>\n<li>\n<p><code><strong>Tween<\/strong><\/code><strong> \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u043e\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430<\/strong>: \u041a\u0430\u043a \u0438 \u0432 \u043e\u0431\u044b\u0447\u043d\u044b\u0445 \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u0445, <code>Tween<\/code> \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0438 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u043b\u044f \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430.<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041a\u0430\u043a \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c:<\/strong><\/p>\n<ol>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0439\u0442\u0435 <code>AnimationController<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0441\u0435\u0439 staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u0442\u0443\u043f\u0435\u043d\u0447\u0430\u0442\u043e, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u0435 <code>Tween<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0421\u0432\u044f\u0436\u0438\u0442\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 <code>Tween<\/code> \u0441 <code>AnimationController<\/code> \u0447\u0435\u0440\u0435\u0437 <code>CurvedAnimation<\/code>, \u0443\u043a\u0430\u0437\u0430\u0432 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 <code>curve<\/code> \u043e\u0431\u044a\u0435\u043a\u0442 <code>Interval<\/code>. <code>Interval<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0442\u0440\u0438 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430: <code>begin<\/code> (\u043d\u0430\u0447\u0430\u043b\u043e \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b\u0430, \u043e\u0442 0.0 \u0434\u043e 1.0), <code>end<\/code> (\u043a\u043e\u043d\u0435\u0446 \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b\u0430, \u043e\u0442 0.0 \u0434\u043e 1.0) \u0438 \u043e\u043f\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e <code>curve<\/code> (\u043a\u0440\u0438\u0432\u0430\u044f \u0434\u043b\u044f \u0434\u0430\u043d\u043d\u043e\u0439 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b\u0430).<\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0437 [21] \/\/ opacity \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432 \u043f\u0435\u0440\u0432\u044b\u0435 10% \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 opacity = Tween&lt;double&gt;(   begin: 0.0,   end: 1.0, ).animate(   CurvedAnimation(     parent: controller, \/\/ \u0412\u0430\u0448 AnimationController     curve: const Interval(       0.0, \/\/ \u041d\u0430\u0447\u0430\u0442\u044c \u0441 0%       0.100, \/\/ \u0417\u0430\u043a\u043e\u043d\u0447\u0438\u0442\u044c \u043d\u0430 10%       curve: Curves.ease,     ),   ), );  \/\/ width \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043c\u0435\u0436\u0434\u0443 12.5% \u0438 25% \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 width = Tween&lt;double&gt;(   begin: 50.0,   end: 150.0, ).animate(   CurvedAnimation(     parent: controller,     curve: const Interval(       0.125, \/\/ \u041d\u0430\u0447\u0430\u0442\u044c \u0441 12.5%       0.250, \/\/ \u0417\u0430\u043a\u043e\u043d\u0447\u0438\u0442\u044c \u043d\u0430 25%       curve: Curves.ease,     ),   ), ); <\/code><\/pre>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>AnimatedBuilder<\/code> \u0434\u043b\u044f \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u0430, \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u0437 \u0432\u0430\u0448\u0438\u0445 <code>Animation<\/code> \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0440\u044b:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0441\u043f\u0438\u0441\u043a\u0430 \u0441 \u0437\u0430\u0434\u0435\u0440\u0436\u043a\u043e\u0439:<\/strong> \u041a\u043b\u0430\u0441\u0441\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u2014 \u043c\u0435\u043d\u044e, \u043f\u0443\u043d\u043a\u0442\u044b \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u0432\u044b\u0435\u0437\u0436\u0430\u044e\u0442 \u0438\u043b\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043e\u0434\u0438\u043d \u0437\u0430 \u0434\u0440\u0443\u0433\u0438\u043c. \u0412  \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e \u0440\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0442\u0430\u043a\u043e\u0433\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u043c\u0435\u043d\u044e, \u0433\u0434\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u0443\u043d\u043a\u0442 \u0441\u043f\u0438\u0441\u043a\u0430 \u0438 \u043a\u043d\u043e\u043f\u043a\u0430 \u0432\u043d\u0438\u0437\u0443 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c  \u00a0 <\/p>\n<p><code>Interval<\/code>.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u043e\u043c\u043f\u043b\u0435\u043a\u0441\u043d\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043e\u0434\u043d\u043e\u0433\u043e \u043e\u0431\u044a\u0435\u043a\u0442\u0430:<\/strong> \u0412\u0438\u0434\u0436\u0435\u0442 \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u0442\u044c \u0447\u0435\u0440\u0435\u0437 \u0441\u0435\u0440\u0438\u044e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439: \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u043f\u043b\u0430\u0432\u043d\u043e \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f, \u0437\u0430\u0442\u0435\u043c \u043c\u0435\u043d\u044f\u0435\u0442 \u0440\u0430\u0437\u043c\u0435\u0440, \u0437\u0430\u0442\u0435\u043c \u0444\u043e\u0440\u043c\u0443, \u0437\u0430\u0442\u0435\u043c \u0446\u0432\u0435\u0442. \u041a\u0430\u0436\u0434\u043e\u0435 \u0438\u0437 \u044d\u0442\u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439 \u0432\u043d\u0443\u0442\u0440\u0438 staggered-\u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438. \u0412  \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e\u043b\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 ( \u00a0 <\/p>\n<p><code>StaggerAnimation<\/code> \u0438 <code>StaggerDemo<\/code>), \u0433\u0434\u0435 \u043a\u0432\u0430\u0434\u0440\u0430\u0442 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043c\u0435\u043d\u044f\u0435\u0442 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c, \u0440\u0430\u0437\u043c\u0435\u0440, \u043e\u0442\u0441\u0442\u0443\u043f\u044b, \u0440\u0430\u0434\u0438\u0443\u0441 \u0441\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u0438\u044f \u0443\u0433\u043b\u043e\u0432 \u0438 \u0446\u0432\u0435\u0442.<\/p>\n<\/li>\n<\/ul>\n<p>Staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2014 \u044d\u0442\u043e \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u0440\u0438\u0435\u043c, \u0430 \u043c\u043e\u0449\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 UX-\u0434\u0438\u0437\u0430\u0439\u043d\u0430. \u041a\u043e\u0433\u0434\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0438\u043b\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432\u0432\u043e\u0434\u044f\u0442\u0441\u044f \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443, \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043b\u0435\u0433\u0447\u0435 \u0432\u043e\u0441\u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435. \u0415\u0433\u043e \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0442 \u043e\u0434\u043d\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043a \u0434\u0440\u0443\u0433\u043e\u043c\u0443. \u0412\u043c\u0435\u0441\u0442\u043e \u0445\u0430\u043e\u0442\u0438\u0447\u043d\u043e\u0433\u043e &#171;\u0432\u0437\u0440\u044b\u0432\u0430&#187; \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432\u0438\u0434\u0438\u0442 \u0443\u043f\u043e\u0440\u044f\u0434\u043e\u0447\u0435\u043d\u043d\u043e\u0435, \u0445\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0435, \u043c\u0435\u043d\u0435\u0435 \u043f\u0435\u0440\u0435\u0433\u0440\u0443\u0436\u0435\u043d\u043d\u044b\u0435 \u0438 \u044d\u0441\u0442\u0435\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0438\u044f\u0442\u043d\u044b\u0435 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u044b, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u0431\u043e\u043b\u044c\u0448\u0438\u043c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e\u043c \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u044e\u0449\u0438\u0445\u0441\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432. Staggered-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2013 \u044d\u0442\u043e \u043a\u0430\u043a \u0445\u043e\u0440\u043e\u0448\u043e \u043f\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u0442\u0430\u043d\u0435\u0446 \u0432 UI. \u0412\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0432\u0441\u0435 \u0432\u044b\u0431\u0435\u0436\u0430\u043b\u0438 \u043d\u0430 \u0441\u0446\u0435\u043d\u0443 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0438 \u0443\u0441\u0442\u0440\u043e\u0438\u043b\u0438 \u0441\u0443\u043c\u0430\u0442\u043e\u0445\u0443, \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0433\u0440\u0430\u0446\u0438\u043e\u0437\u043d\u043e, \u043e\u0434\u0438\u043d \u0437\u0430 \u0434\u0440\u0443\u0433\u0438\u043c, \u0432\u0435\u0434\u044f \u0432\u0437\u0433\u043b\u044f\u0434 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u00a0 <\/p>\n<h4>2.2. Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: \u0417\u0440\u0435\u043b\u0438\u0449\u043d\u044b\u0435 \u043f\u043e\u043b\u0435\u0442\u044b \u043c\u0435\u0436\u0434\u0443 \u044d\u043a\u0440\u0430\u043d\u0430\u043c\u0438<\/h4>\n<p>Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0442\u0430\u043a\u0436\u0435 \u0438\u0437\u0432\u0435\u0441\u0442\u043d\u044b\u0435 \u043a\u0430\u043a \u00abshared element transitions\u00bb (\u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u0441\u00a0\u043e\u0431\u0449\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c),\u00a0\u2014 \u044d\u0442\u043e \u043e\u0434\u0438\u043d \u0438\u0437\u00a0\u0441\u0430\u043c\u044b\u0445 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u0432\u043f\u0435\u0447\u0430\u0442\u043b\u044f\u044e\u0449\u0438\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0432\u043e\u00a0Flutter. \u0421\u0443\u0442\u044c \u044d\u0442\u043e\u0439 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0432\u00a0\u0442\u043e\u043c, \u0447\u0442\u043e\u00a0\u0432\u0438\u0434\u0436\u0435\u0442 (\u043e\u0431\u044b\u0447\u043d\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0438\u043b\u0438\u00a0\u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0430) \u043a\u0430\u043a\u00a0\u0431\u044b \u00ab\u043f\u0435\u0440\u0435\u043b\u0435\u0442\u0430\u0435\u0442\u00bb \u0441\u00a0\u043e\u0434\u043d\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430 (\u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0430) \u043d\u0430\u00a0\u0434\u0440\u0443\u0433\u043e\u0439, \u043f\u043b\u0430\u0432\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u044f \u0441\u0432\u043e\u0439 \u0440\u0430\u0437\u043c\u0435\u0440, \u0444\u043e\u0440\u043c\u0443 \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435. \u042d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0441\u0438\u043b\u044c\u043d\u043e\u0435 \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435 \u0441\u0432\u044f\u0437\u0438 \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u044d\u043a\u0440\u0430\u043d\u0430\u043c\u0438 \u0438 \u0443\u043b\u0443\u0447\u0448\u0430\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442. \u043f\u043e\u0434\u0442\u0432\u0435\u0440\u0436\u0434\u0430\u0435\u0442 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u044d\u0442\u043e\u0433\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043d\u0430 \u043c\u0430\u0440\u0442 2025 \u0433\u043e\u0434\u0430. \u00a0 <\/p>\n<p><strong>\u0427\u0442\u043e \u044d\u0442\u043e \u0442\u0430\u043a\u043e\u0435?<\/strong> \u041f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u044c\u0442\u0435, \u0432\u044b \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442\u0435 \u043d\u0430 \u043c\u0438\u043d\u0438\u0430\u0442\u044e\u0440\u0443 \u0442\u043e\u0432\u0430\u0440\u0430 \u0432 \u0441\u043f\u0438\u0441\u043a\u0435, \u0438 \u044d\u0442\u0430 \u043c\u0438\u043d\u0438\u0430\u0442\u044e\u0440\u0430 \u043f\u043b\u0430\u0432\u043d\u043e \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0438 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442\u0441\u044f, \u043f\u0440\u0435\u0432\u0440\u0430\u0449\u0430\u044f\u0441\u044c \u0432 \u0433\u043b\u0430\u0432\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0441 \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0435\u0439 \u043e \u0442\u043e\u0432\u0430\u0440\u0435. \u042d\u0442\u043e \u0438 \u0435\u0441\u0442\u044c Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f. \u00a0 <\/p>\n<p><strong>\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442:<\/strong> \u041c\u0435\u0445\u0430\u043d\u0438\u0437\u043c Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u044d\u043b\u0435\u0433\u0430\u043d\u0442\u0435\u043d : \u00a0 <\/p>\n<ol>\n<li>\n<p><strong>\u0414\u0432\u0430 \u0432\u0438\u0434\u0436\u0435\u0442\u0430 <\/strong><code><strong>Hero<\/strong><\/code>: \u041d\u0430 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435 (source route) \u0438 \u043d\u0430 \u0446\u0435\u043b\u0435\u0432\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435 (destination route) \u0434\u043e\u043b\u0436\u043d\u044b \u0431\u044b\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0449\u0435\u043d\u044b \u0432\u0438\u0434\u0436\u0435\u0442\u044b <code>Hero<\/code>.<\/p>\n<\/li>\n<li>\n<p><strong>\u041e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u044b\u0439 <\/strong><code><strong>tag<\/strong><\/code>: \u042d\u0442\u043e <strong>\u0441\u0430\u043c\u043e\u0435 \u0432\u0430\u0436\u043d\u043e\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u0435<\/strong>. \u041e\u0431\u0430 \u0432\u0438\u0434\u0436\u0435\u0442\u0430 <code>Hero<\/code> \u0434\u043e\u043b\u0436\u043d\u044b \u0438\u043c\u0435\u0442\u044c \u0430\u0431\u0441\u043e\u043b\u044e\u0442\u043d\u043e \u043e\u0434\u0438\u043d\u0430\u043a\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 <code>tag<\/code>. \u041e\u0431\u044b\u0447\u043d\u043e \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0442\u0435\u0433\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u044d\u0442\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u044b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, ID \u0442\u043e\u0432\u0430\u0440\u0430).<\/p>\n<\/li>\n<li>\n<p><strong>\u041d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044f<\/strong>: \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u043a\u043e\u0433\u0434\u0430 \u0432\u044b \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0438\u0442\u0435 \u0441 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430 \u043d\u0430 \u0446\u0435\u043b\u0435\u0432\u043e\u0439 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>Navigator.push()<\/code>) \u0438\u043b\u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442\u0435\u0441\u044c \u043e\u0431\u0440\u0430\u0442\u043d\u043e (<code>Navigator.pop()<\/code>).<\/p>\n<\/li>\n<li>\n<p><strong>\u041c\u0430\u0433\u0438\u044f Flutter<\/strong>:<\/p>\n<ul>\n<li>\n<p>\u0424\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043d\u0430\u0445\u043e\u0434\u0438\u0442 \u043f\u0430\u0440\u044b \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 <code>Hero<\/code> \u0441 \u0441\u043e\u0432\u043f\u0430\u0434\u0430\u044e\u0449\u0438\u043c\u0438 \u0442\u0435\u0433\u0430\u043c\u0438 \u043d\u0430 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u043c \u0438 \u0446\u0435\u043b\u0435\u0432\u043e\u043c \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0430\u0445.<\/p>\n<\/li>\n<li>\n<p>\u041e\u043d \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442 <code>RectTween<\/code> (\u0442\u0432\u0438\u043d \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u0430\u043a \u0431\u0443\u0434\u0443\u0442 \u043c\u0435\u043d\u044f\u0442\u044c\u0441\u044f \u0433\u0440\u0430\u043d\u0438\u0446\u044b (\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u0440\u0430\u0437\u043c\u0435\u0440) &#171;\u0433\u0435\u0440\u043e\u044f&#187; \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0435\u0433\u043e &#171;\u043f\u043e\u043b\u0435\u0442\u0430&#187;. \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f <code>MaterialRectArcTween<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0440\u043e\u0442\u0438\u0432\u043e\u043f\u043e\u043b\u043e\u0436\u043d\u044b\u0435 \u0443\u0433\u043b\u044b \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 \u043f\u043e \u0434\u0443\u0433\u0435, \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u044f \u0431\u043e\u043b\u0435\u0435 \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0435. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u0412\u043e\u00a0\u0432\u0440\u0435\u043c\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u00ab\u0433\u0435\u0440\u043e\u0439\u00bb \u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0435\u0442\u0441\u044f \u0432 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0441\u043b\u043e\u0439 \u043f\u043e\u0432\u0435\u0440\u0445 \u0432\u0441\u0435\u0445 \u044d\u043a\u0440\u0430\u043d\u043e\u0432 (Overlay), \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043c\u043e\u0433 \u0431\u0435\u0441\u043f\u0440\u0435\u043f\u044f\u0442\u0441\u0442\u0432\u0435\u043d\u043d\u043e &#171;\u043b\u0435\u0442\u0435\u0442\u044c&#187; \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0441\u043b\u0435 \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 &#171;\u0433\u0435\u0440\u043e\u0439&#187; \u043f\u043e\u043c\u0435\u0449\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0441\u0432\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0432 \u0446\u0435\u043b\u0435\u0432\u043e\u043c \u043c\u0430\u0440\u0448\u0440\u0443\u0442\u0435.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ol>\n<p><strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b:<\/strong><\/p>\n<ul>\n<li>\n<p><code>Hero<\/code>: \u0421\u0430\u043c \u0432\u0438\u0434\u0436\u0435\u0442. \u0413\u043b\u0430\u0432\u043d\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u2014 <code>tag<\/code> (\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e) \u0438 <code>child<\/code> (\u0442\u043e, \u0447\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f).<\/p>\n<\/li>\n<li>\n<p><code>Navigator<\/code>: \u0414\u043b\u044f \u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 \u044d\u043a\u0440\u0430\u043d\u0430\u043c\u0438.<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u0422\u0438\u043f\u044b Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439:<\/strong> Flutter \u0438\u0437 \u043a\u043e\u0440\u043e\u0431\u043a\u0438 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0434\u0432\u0430 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u0442\u0438\u043f\u0430 : \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 (Standard hero animations)<\/strong>: &#171;\u0413\u0435\u0440\u043e\u0439&#187; \u043f\u0435\u0440\u0435\u043b\u0435\u0442\u0430\u0435\u0442 \u0441 \u043e\u0434\u043d\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430 \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u0435, \u043c\u0435\u043d\u044f\u044f \u0440\u0430\u0437\u043c\u0435\u0440 \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043d\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044f \u0441\u0432\u043e\u044e \u043e\u0431\u0449\u0443\u044e \u0444\u043e\u0440\u043c\u0443 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u044b\u043c).<\/p>\n<\/li>\n<li>\n<p><strong>\u0420\u0430\u0434\u0438\u0430\u043b\u044c\u043d\u044b\u0435 (Radial hero animations)<\/strong>: \u0412\u043e \u0432\u0440\u0435\u043c\u044f &#171;\u043f\u043e\u043b\u0435\u0442\u0430&#187; \u0444\u043e\u0440\u043c\u0430 &#171;\u0433\u0435\u0440\u043e\u044f&#187; \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0438\u0437 \u043a\u0440\u0443\u0433\u0430 \u0432 \u043a\u0432\u0430\u0434\u0440\u0430\u0442 \u0438\u043b\u0438 \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442. \u042d\u0442\u043e \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u0437\u0430 \u0441\u0447\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u043e\u0433\u043e <code>createRectTween<\/code> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>MaterialRectCenterArcTween<\/code>) \u0438 \u0443\u043c\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u043e\u0431\u0440\u0435\u0437\u043a\u0438 (<code>ClipOval<\/code>, <code>ClipRect<\/code>) \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430.<\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043a\u043e\u0434\u0430:<\/strong> \u0411\u0430\u0437\u043e\u0432\u0430\u044f \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 : \u00a0 <\/p>\n<ol>\n<li>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u0435 <code>Hero<\/code> \u043d\u0430 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435:<\/p>\n<pre><code class=\"dart\">\/\/ \u041d\u0430 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435 Hero(   tag: 'myHeroTag', \/\/ \u0423\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0439 \u0442\u0435\u0433   child: SomeWidget(), \/\/ \u0412\u0430\u0448 \u0432\u0438\u0434\u0436\u0435\u0442 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, Image.network(...)) ) <\/code><\/pre>\n<\/li>\n<li>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u0435 <code>Hero<\/code> \u0441 <strong>\u0442\u0435\u043c \u0436\u0435 \u0442\u0435\u0433\u043e\u043c<\/strong> \u043d\u0430 \u0446\u0435\u043b\u0435\u0432\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435:<\/p>\n<pre><code class=\"dart\">\/\/ \u041d\u0430 \u0446\u0435\u043b\u0435\u0432\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435 Hero(   tag: 'myHeroTag', \/\/ \u0422\u043e\u0442 \u0436\u0435 \u0441\u0430\u043c\u044b\u0439 \u0442\u0435\u0433!   child: SomeWidgetInDifferentState(), \/\/ \u0422\u043e\u0442 \u0436\u0435 \u0432\u0438\u0434\u0436\u0435\u0442, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0431\u043e\u043b\u044c\u0448\u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 ) <\/code><\/pre>\n<\/li>\n<li>\n<p>\u041e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0438\u0442\u0435 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>Navigator<\/code>:<\/p>\n<pre><code class=\"dart\">Navigator.push(context, MaterialPageRoute(builder: (_) {   return DestinationScreen(); \/\/ \u042d\u043a\u0440\u0430\u043d, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 \u0432\u0442\u043e\u0440\u043e\u0439 Hero })); <\/code><\/pre>\n<\/li>\n<\/ol>\n<p> \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u044b \u043a\u043e\u0434\u0430 \u0434\u043b\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0439 \u0438 \u0440\u0430\u0434\u0438\u0430\u043b\u044c\u043d\u043e\u0439 Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u043a\u043b\u0430\u0441\u0441\u044b  \u00a0 <\/p>\n<p><code>PhotoHero<\/code> \u0438 <code>RadialExpansion<\/code>. \u0412\u0430\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u0435\u0440\u0435\u0432\u044c\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u0432\u043d\u0443\u0442\u0440\u0438 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u0438 \u0446\u0435\u043b\u0435\u0432\u043e\u0433\u043e <code>Hero<\/code> \u0431\u044b\u043b\u0438 \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u0441\u0445\u043e\u0436\u0438\u043c\u0438 \u043f\u043e \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0435 \u0434\u043b\u044f \u043d\u0430\u0438\u043b\u0443\u0447\u0448\u0435\u0433\u043e \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430. \u00a0 <\/p>\n<p><strong>\u041f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0438 \u0440\u0435\u0448\u0435\u043d\u0438\u044f:<\/strong>  \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043d\u0430 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u0443\u044e \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0443, \u043a\u043e\u0433\u0434\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0435\u0442\u0441\u044f \u0438\u0437 Firestore \u043d\u0430 \u0432\u0442\u043e\u0440\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435: \u043e\u043d\u043e \u043c\u043e\u0436\u0435\u0442 \u043d\u0435 \u0443\u0441\u043f\u0435\u0442\u044c \u0437\u0430\u0433\u0440\u0443\u0437\u0438\u0442\u044c\u0441\u044f \u043a \u043c\u043e\u043c\u0435\u043d\u0442\u0443 \u043d\u0430\u0447\u0430\u043b\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u0420\u0435\u0448\u0435\u043d\u0438\u0435 \u2014 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c URL \u0443\u0436\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f (\u0438\u043b\u0438 \u0441\u0430\u043c\u043e \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e) \u0441 \u043f\u0435\u0440\u0432\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430 \u043d\u0430 \u0432\u0442\u043e\u0440\u043e\u0439 \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<p>Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2014 \u044d\u0442\u043e \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u0443\u043a\u0440\u0430\u0448\u0430\u0442\u0435\u043b\u044c\u0441\u0442\u0432\u043e. \u041e\u043d\u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e\u0442 \u0432\u0430\u0436\u043d\u0443\u044e UX-\u0444\u0443\u043d\u043a\u0446\u0438\u044e: \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u0441\u0432\u044f\u0437\u044b\u0432\u0430\u044e\u0442 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u043d\u0430 \u043e\u0434\u043d\u043e\u043c \u044d\u043a\u0440\u0430\u043d\u0435 \u0441 \u0435\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u043d\u0430 \u0434\u0440\u0443\u0433\u043e\u043c. \u042d\u0442\u043e \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u043f\u043e\u043d\u044f\u0442\u044c, \u0447\u0442\u043e \u043e\u043d \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u0442\u0435\u043c \u0436\u0435 \u0441\u0430\u043c\u044b\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u043c \u0438\u043b\u0438 \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u0435\u0439, \u0434\u0430\u0436\u0435 \u0435\u0441\u043b\u0438 \u0435\u0433\u043e \u0432\u0438\u0434 \u0438\u043b\u0438 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0438\u0441\u044c. \u0422\u0430\u043a\u043e\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043e\u0449\u0443\u0449\u0430\u0435\u0442\u0441\u044f \u0431\u043e\u043b\u0435\u0435 \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c \u0438 \u0438\u043d\u0442\u0443\u0438\u0442\u0438\u0432\u043d\u044b\u043c, \u0447\u0435\u043c \u0440\u0435\u0437\u043a\u0430\u044f \u0441\u043c\u0435\u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u043e\u0432. Hero-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0441\u043e\u0437\u0434\u0430\u044e\u0442 \u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435 \u043d\u0435\u043f\u0440\u0435\u0440\u044b\u0432\u043d\u043e\u0441\u0442\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043e\u043f\u044b\u0442\u0430, \u0443\u043b\u0443\u0447\u0448\u0430\u044e\u0442 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044e \u0438 \u0434\u0435\u043b\u0430\u044e\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0431\u043e\u043b\u0435\u0435 \u043e\u0441\u043c\u044b\u0441\u043b\u0435\u043d\u043d\u044b\u043c\u0438. \u041a\u043e\u0433\u0434\u0430 \u0442\u044b \u0442\u044b\u043a\u0430\u0435\u0448\u044c \u0432 \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0443\u044e \u043a\u0430\u0440\u0442\u0438\u043d\u043a\u0443 \u0442\u043e\u0432\u0430\u0440\u0430, \u0438 \u043e\u043d\u0430 \u043a\u0440\u0430\u0441\u0438\u0432\u043e \u0440\u0430\u0437\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u0431\u043e\u043b\u044c\u0448\u0443\u044e \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0434\u0435\u0442\u0430\u043b\u0435\u0439, \u0441\u0440\u0430\u0437\u0443 \u043f\u043e\u043d\u044f\u0442\u043d\u043e, \u0447\u0442\u043e \u044d\u0442\u043e \u041e\u041d\u041e, \u043f\u0440\u043e\u0441\u0442\u043e \u0432 \u0434\u0440\u0443\u0433\u043e\u043c \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0435. \u041c\u0430\u0433\u0438\u044f! \u00a0 <\/p>\n<h4>2.3. \u0424\u0438\u0437\u0438\u043a\u0430 \u0432 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u0445: \u0417\u0430\u043a\u043e\u043d\u044b \u041d\u044c\u044e\u0442\u043e\u043d\u0430 \u043d\u0430 \u0441\u043b\u0443\u0436\u0431\u0435 UI<\/h4>\n<p>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0441 \u043a\u0440\u0438\u0432\u044b\u043c\u0438 \u0432\u0440\u043e\u0434\u0435 <code>easeInOut<\/code> \u0445\u043e\u0440\u043e\u0448\u0438, \u043d\u043e \u0438\u043d\u043e\u0433\u0434\u0430 \u0445\u043e\u0447\u0435\u0442\u0441\u044f, \u0447\u0442\u043e\u0431\u044b \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0440\u0435\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u043b \u0431\u043e\u043b\u0435\u0435 &#171;\u0436\u0438\u0432\u043e&#187;, \u0431\u043e\u043b\u0435\u0435 \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u043a\u0430\u043a \u043e\u0431\u044a\u0435\u043a\u0442\u044b \u0432 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u043c \u043c\u0438\u0440\u0435. \u0417\u0434\u0435\u0441\u044c \u043d\u0430 \u043f\u043e\u043c\u043e\u0449\u044c \u043f\u0440\u0438\u0445\u043e\u0434\u044f\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438-\u043e\u0431\u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 (physics-based animations). \u041e\u043d\u0438 \u0438\u043c\u0438\u0442\u0438\u0440\u0443\u044e\u0442 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043e\u0431\u044a\u0435\u043a\u0442\u043e\u0432: \u043f\u0440\u0443\u0436\u0438\u043d, \u0433\u0440\u0430\u0432\u0438\u0442\u0430\u0446\u0438\u0438, \u0442\u0440\u0435\u043d\u0438\u044f, \u0438\u043d\u0435\u0440\u0446\u0438\u0438. \u042d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 UI \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u043c, \u0430 \u043f\u043e-\u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0435\u043c\u0443 \u043e\u0442\u0437\u044b\u0432\u0447\u0438\u0432\u044b\u043c \u0438 \u043f\u0440\u0438\u044f\u0442\u043d\u044b\u043c \u043d\u0430 \u043e\u0449\u0443\u043f\u044c.  \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u044d\u0442\u043e \u043f\u0440\u0435\u043a\u0440\u0430\u0441\u043d\u044b\u043c \u0441\u043f\u043e\u0441\u043e\u0431\u043e\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0431\u043e\u043b\u0435\u0435 \u0440\u0435\u0430\u043b\u0438\u0441\u0442\u0438\u0447\u043d\u044b\u043c\u0438 \u0438 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u043c\u0438. \u00a0 <\/p>\n<p><strong>\u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438: <\/strong><code><strong>SpringSimulation<\/strong><\/code><\/p>\n<p>Flutter SDK \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043a\u043b\u0430\u0441\u0441 <code>SpringSimulation<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0434\u0435\u043b\u0438\u0440\u0443\u0435\u0442 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0447\u0430\u0441\u0442\u0438\u0446\u044b, \u043f\u0440\u0438\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u043d\u043e\u0439 \u043a \u043f\u0440\u0443\u0436\u0438\u043d\u0435 \u0438 \u043f\u043e\u0434\u0447\u0438\u043d\u044f\u044e\u0449\u0435\u0439\u0441\u044f \u0437\u0430\u043a\u043e\u043d\u0443 \u0413\u0443\u043a\u0430. \u042d\u0442\u043e\u0442 \u0442\u0438\u043f \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u044d\u0444\u0444\u0435\u043a\u0442\u044b &#171;\u043f\u0440\u0443\u0436\u0438\u043d\u0438\u0441\u0442\u043e\u0441\u0442\u0438&#187;, \u0443\u043f\u0440\u0443\u0433\u043e\u0433\u043e \u043e\u0442\u0441\u043a\u043e\u043a\u0430, \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u044f. \u00a0 <\/p>\n<p>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438 <code>SpringSimulation<\/code> : \u00a0 <\/p>\n<ul>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441 \u043c\u0435\u0442\u043e\u0434\u043e\u043c <code>AnimationController.animateWith(simulation)<\/code>. \u041a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 \u0431\u0443\u0434\u0435\u0442 &#171;\u0434\u0432\u0438\u0433\u0430\u0442\u044c\u0441\u044f&#187; \u0432 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0438\u0438 \u0441 \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0439 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0435\u0439, \u0430 \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0438 \u043a\u0440\u0438\u0432\u043e\u0439.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043f\u0440\u0443\u0436\u0438\u043d\u044b \u0437\u0430\u0434\u0430\u044e\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u043e\u0431\u044a\u0435\u043a\u0442 <code>SpringDescription<\/code>:<\/p>\n<ul>\n<li>\n<p><code>mass<\/code>: \u041c\u0430\u0441\u0441\u0430 \u043e\u0431\u044a\u0435\u043a\u0442\u0430 \u043d\u0430 \u043f\u0440\u0443\u0436\u0438\u043d\u0435. \u0411\u043e\u043b\u044c\u0448\u0430\u044f \u043c\u0430\u0441\u0441\u0430 \u2014 \u0431\u043e\u043b\u0435\u0435 \u0438\u043d\u0435\u0440\u0442\u043d\u043e\u0435 \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p><code>stiffness<\/code>: \u0416\u0435\u0441\u0442\u043a\u043e\u0441\u0442\u044c \u043f\u0440\u0443\u0436\u0438\u043d\u044b. \u0412\u044b\u0441\u043e\u043a\u0430\u044f \u0436\u0435\u0441\u0442\u043a\u043e\u0441\u0442\u044c \u2014 \u0431\u044b\u0441\u0442\u0440\u044b\u0435 \u0438 \u0440\u0435\u0437\u043a\u0438\u0435 \u043a\u043e\u043b\u0435\u0431\u0430\u043d\u0438\u044f.<\/p>\n<\/li>\n<li>\n<p><code>damping<\/code>: \u041a\u043e\u044d\u0444\u0444\u0438\u0446\u0438\u0435\u043d\u0442 \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u044f. \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u0430\u043a \u0431\u044b\u0441\u0442\u0440\u043e \u043a\u043e\u043b\u0435\u0431\u0430\u043d\u0438\u044f \u0431\u0443\u0434\u0443\u0442 \u0437\u0430\u0442\u0443\u0445\u0430\u0442\u044c. \u041d\u0438\u0437\u043a\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u2014 \u0434\u043e\u043b\u0433\u0438\u0435 \u043a\u043e\u043b\u0435\u0431\u0430\u043d\u0438\u044f, \u0432\u044b\u0441\u043e\u043a\u043e\u0435 \u2014 \u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u041a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440 <code>SpringSimulation<\/code> \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435, \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0435 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u0443\u044e \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c.<\/p>\n<\/li>\n<\/ul>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430  (\u0430\u0434\u0430\u043f\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439): \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ \u0412 \u0432\u0430\u0448\u0435\u043c State \u043a\u043b\u0430\u0441\u0441\u0435 \u0441 SingleTickerProviderStateMixin \/\/ late AnimationController _controller; \/\/ late Animation&lt;Alignment&gt; _animation; \/\/ \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0439 \u0442\u0438\u043f, \u0435\u0441\u043b\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0435 \u043d\u0435 Alignment \/\/ Alignment _dragAlignment = Alignment.center; \/\/ \u0422\u0435\u043a\u0443\u0449\u0435\u0435 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435  void _runSpringAnimation(Offset pixelsPerSecond, Size size) {   \/\/ \u041c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c AlignmentTween, \u0435\u0441\u043b\u0438 \u0432\u044b \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0435 Alignment   \/\/ _animation = _controller.drive(   \/\/   AlignmentTween(   \/\/     begin: _dragAlignment,   \/\/     end: Alignment.center, \/\/ \u0426\u0435\u043b\u0435\u0432\u043e\u0435 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435   \/\/   ),   \/\/ );    \/\/ \u0420\u0430\u0441\u0447\u0435\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 \u0432 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0435\u0434\u0438\u043d\u0438\u0446\u0430\u0445 (\u0435\u0441\u043b\u0438 \u043d\u0443\u0436\u043d\u043e)   \/\/ final unitsPerSecondX = pixelsPerSecond.dx \/ size.width;   \/\/ final unitsPerSecondY = pixelsPerSecond.dy \/ size.height;   \/\/ final unitsPerSecond = Offset(unitsPerSecondX, unitsPerSecondY);   \/\/ final unitVelocity = unitsPerSecond.distance; \/\/ \u0421\u043a\u0430\u043b\u044f\u0440\u043d\u0430\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c    const spring = SpringDescription(     mass: 30,     stiffness: 1, \/\/ \u041e\u0447\u0435\u043d\u044c \u043c\u044f\u0433\u043a\u0430\u044f \u043f\u0440\u0443\u0436\u0438\u043d\u0430 \u0434\u043b\u044f \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u0438     damping: 1,   \/\/ \u0421\u0438\u043b\u044c\u043d\u043e\u0435 \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u0435   );    \/\/ \u0414\u043b\u044f SpringSimulation, start \u0438 end - \u044d\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432\u0434\u043e\u043b\u044c \u043e\u0434\u043d\u043e\u0439 \u043e\u0441\u0438 (0.0 \u0434\u043e 1.0)   \/\/ velocity - \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u0430\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0432\u0434\u043e\u043b\u044c \u044d\u0442\u043e\u0439 \u043e\u0441\u0438.   \/\/ \u0417\u0434\u0435\u0441\u044c \u043c\u044b \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u043c, \u0447\u0442\u043e _controller.value \u0431\u0443\u0434\u0435\u0442 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441\u043e\u043c   \/\/ \u043e\u0442 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u043a \u0446\u0435\u043b\u0435\u0432\u043e\u043c\u0443.   \/\/ \u0415\u0441\u043b\u0438 \u0432\u044b \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u0435, \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0441\u043c\u0430\u043f\u0438\u0442\u044c   \/\/ _controller.value \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u0435 \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u0435.    \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u043e\u0442 0.0 \u0434\u043e 1.0   \/\/ \u041f\u0440\u0435\u0434\u043f\u043e\u043b\u043e\u0436\u0438\u043c, _controller.value \u0441\u0435\u0439\u0447\u0430\u0441 \u043d\u0430 0.0 (\u043d\u0430\u0447\u0430\u043b\u043e)   \/\/ \u0438 \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u043a 1.0 (\u043a\u043e\u043d\u0435\u0446) \u0441 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\u044e.   \/\/ \u041d\u0430\u0447\u0430\u043b\u044c\u043d\u0430\u044f \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0434\u043e\u043b\u0436\u043d\u0430 \u0431\u044b\u0442\u044c \u0432 \u0442\u0435\u0445 \u0436\u0435 \"\u0435\u0434\u0438\u043d\u0438\u0446\u0430\u0445\", \u0447\u0442\u043e \u0438 start\/end, \u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u043d\u0430 \u0432\u0440\u0435\u043c\u044f.   \/\/ \u0415\u0441\u043b\u0438 unitVelocity - \u044d\u0442\u043e \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f _controller.value \u0432 \u0441\u0435\u043a\u0443\u043d\u0434\u0443:   final simulation = SpringSimulation(     spring,     _controller.value, \/\/ \u0422\u0435\u043a\u0443\u0449\u0435\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 (\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430)     1.0,               \/\/ \u0426\u0435\u043b\u0435\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 (\u043a\u043e\u043d\u0435\u0447\u043d\u0430\u044f \u0442\u043e\u0447\u043a\u0430)     -pixelsPerSecond.dy \/ 100, \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 (\u043d\u0443\u0436\u043d\u043e \u043f\u043e\u0434\u043e\u0431\u0440\u0430\u0442\u044c \u0437\u043d\u0430\u043a \u0438 \u043c\u0430\u0441\u0448\u0442\u0430\u0431)   );    _controller.animateWith(simulation); }  \/\/ \u0412\u044b\u0437\u043e\u0432, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 onPanEnd GestureDetector \/\/ onPanEnd: (details) { \/\/   _runSpringAnimation(details.velocity.pixelsPerSecond, MediaQuery.of(context).size); \/\/ }, <\/code><\/pre>\n<p><strong>\u041f\u0430\u043a\u0435\u0442 <\/strong><code><strong>flutter_physics<\/strong><\/code><\/p>\n<p>\u0414\u043b\u044f \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0445 \u0438 \u0443\u0434\u043e\u0431\u043d\u044b\u0445 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043f\u0430\u043a\u0435\u0442 <code>flutter_physics<\/code> ( \u043d\u0430 <a href=\"http:\/\/pub.dev\" rel=\"noopener noreferrer nofollow\">pub.dev<\/a>). \u041e\u043d \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0441\u0448\u0438\u0440\u044f\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u043e\u0439 \u0441\u0438\u0441\u0442\u0435\u043c\u044b Flutter: \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u0415\u0434\u0438\u043d\u044b\u0439 \u0442\u0438\u043f <\/strong><code><strong>Physics<\/strong><\/code>: \u041f\u0430\u043a\u0435\u0442 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 \u043a\u0440\u0438\u0432\u044b\u0435 (<code>Curve<\/code>) \u0438 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438 (<code>Spring<\/code>, <code>Gravity<\/code>, <code>Friction<\/code>) \u043f\u043e\u0434 \u043e\u0434\u043d\u0438\u043c \u0442\u0438\u043f\u043e\u043c <code>Physics<\/code>. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043b\u0435\u0433\u043a\u043e \u0437\u0430\u043c\u0435\u043d\u0438\u0442\u044c \u043f\u0440\u0443\u0436\u0438\u043d\u043d\u0443\u044e \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u044e \u043d\u0430 \u043e\u0431\u044b\u0447\u043d\u0443\u044e \u043a\u0440\u0438\u0432\u0443\u044e <code>easeInOut<\/code> \u0431\u0435\u0437 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043b\u043e\u0433\u0438\u043a\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 \u0438\u043b\u0438 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b \u0432\u0438\u0434\u0436\u0435\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p><strong>\u0421\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438<\/strong>: \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0435 <code>flutter_physics<\/code>, \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u044e\u0442 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u043f\u0440\u0438 \u043f\u0440\u0435\u0440\u044b\u0432\u0430\u043d\u0438\u0438, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u0431\u043e\u043b\u0435\u0435 \u043f\u043b\u0430\u0432\u043d\u044b\u043c\u0438 \u0438 \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u044b<\/strong>: <code>PhysicsController<\/code> \u0434\u043b\u044f \u043e\u0434\u043d\u043e\u043c\u0435\u0440\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>double<\/code>) \u0438 <code>PhysicsControllerMulti<\/code> \u0434\u043b\u044f N-\u043c\u0435\u0440\u043d\u044b\u0445 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>Offset<\/code> \u0434\u043b\u044f \u043f\u0435\u0440\u0435\u0442\u0430\u0441\u043a\u0438\u0432\u0430\u043d\u0438\u044f \u0438\u043b\u0438 3D-\u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0439).<\/p>\n<\/li>\n<li>\n<p><strong>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0432\u0438\u0434\u0436\u0435\u0442\u044b \u0441 \u0444\u0438\u0437\u0438\u043a\u043e\u0439<\/strong>: \u041f\u0430\u043a\u0435\u0442 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0430\u043d\u0430\u043b\u043e\u0433\u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043d\u043e \u0441 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u043e\u0439 \u0444\u0438\u0437\u0438\u043a\u0438: <code>APositioned<\/code>, <code>ASize<\/code>, <code>ASwitcher<\/code> \u0438 \u0434\u0440\u0443\u0433\u0438\u0435 (<code>ImplicitlyPhysicsAnimatedWidget<\/code>). \u041e\u043d\u0438 \u043c\u043e\u0433\u0443\u0442 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u043b\u0438\u0431\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043a\u0440\u0438\u0432\u043e\u0439, \u043b\u0438\u0431\u043e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438, \u0431\u0435\u0437 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0440\u0443\u0447\u043d\u043e\u0433\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u043e\u043c.<\/p>\n<\/li>\n<li>\n<p><strong>\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0432\u0440\u0435\u043c\u044f<\/strong>: \u0412 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441 \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0439 <code>duration<\/code>, \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0441\u0430\u043c\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u0441\u0432\u043e\u044e \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u043b\u043e\u0432\u0438\u0439 \u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 \u0444\u0438\u0437\u0438\u043a\u0438.<\/p>\n<\/li>\n<\/ul>\n<p>\u043f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u0441  <code>flutter_physics<\/code> \u0432\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0435 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435, \u043d\u0435\u043f\u0440\u0435\u0440\u044b\u0432\u043d\u043e\u0435 \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0435, \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 \u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0444\u0438\u0437\u0438\u043a\u0438, \u0447\u0442\u043e \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u0436\u0435\u0441\u0442\u0430\u043c\u0438.<\/p>\n<p>\u0424\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0432 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442\u00a0\u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441\u00a0\u043f\u0440\u0435\u0434\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c\u0438 \u043a\u0440\u0438\u0432\u044b\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u043d\u043e\u0433\u0434\u0430 \u043c\u043e\u0433\u0443\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u00ab\u043a\u043e\u043c\u043f\u044c\u044e\u0442\u0435\u0440\u043d\u044b\u043c\u0438\u00bb \u0438\u043b\u0438\u00a0\u043f\u0440\u0435\u0434\u0441\u043a\u0430\u0437\u0443\u0435\u043c\u044b\u043c\u0438, \u0432\u0432\u043e\u0434\u044f\u0442 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a\u00a0\u0438\u043d\u0435\u0440\u0446\u0438\u044f, \u0443\u043f\u0440\u0443\u0433\u043e\u0441\u0442\u044c \u0438 \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u0435. \u042d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441\u00a0\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u0431\u043e\u043b\u0435\u0435 \u0438\u043d\u0442\u0443\u0438\u0442\u0438\u0432\u043d\u044b\u043c, \u0442\u0430\u043a \u043a\u0430\u043a\u00a0\u043e\u043d\u043e \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u043e\u0436\u0438\u0434\u0430\u043d\u0438\u044f\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u043c \u043d\u0430\u00a0\u0435\u0433\u043e \u043e\u043f\u044b\u0442\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441\u00a0\u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u043c \u043c\u0438\u0440\u043e\u043c. \u0414\u0430\u0436\u0435 \u0442\u043e\u043d\u043a\u0438\u0435 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u043c\u043e\u0433\u0443\u0442 \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0443\u043b\u0443\u0447\u0448\u0438\u0442\u044c \u00ab\u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0435\u00bb \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0434\u0435\u043b\u0430\u044f \u0435\u0433\u043e \u0431\u043e\u043b\u0435\u0435 \u043e\u0442\u0437\u044b\u0432\u0447\u0438\u0432\u044b\u043c, \u043f\u0440\u0438\u044f\u0442\u043d\u044b\u043c \u0438 \u00ab\u0447\u0435\u043b\u043e\u0432\u0435\u0447\u043d\u044b\u043c\u00bb. \u042d\u0442\u043e \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0432\u0430\u0436\u043d\u043e \u0434\u043b\u044f\u00a0\u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0447\u0430\u0441\u0442\u043e \u00ab\u0442\u0440\u043e\u0433\u0430\u0435\u0442\u00bb \u0438\u043b\u0438\u00a0\u043f\u0435\u0440\u0435\u0442\u0430\u0441\u043a\u0438\u0432\u0430\u0435\u0442. \u041a\u043e\u0433\u0434\u0430 \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0430 \u043d\u0435\u00a0\u043f\u0440\u043e\u0441\u0442\u043e \u0434\u0432\u0438\u0433\u0430\u0435\u0442\u0441\u044f, \u0430\u00a0\u0447\u0443\u0442\u044c \u00ab\u043f\u0440\u0443\u0436\u0438\u043d\u0438\u0442\u00bb \u0438 \u00ab\u0437\u0430\u0442\u0443\u0445\u0430\u0435\u0442\u00bb \u043d\u0430\u00a0\u043d\u043e\u0432\u043e\u043c \u043c\u0435\u0441\u0442\u0435\u00a0\u2014 \u044d\u0442\u043e \u043a\u0430\u0439\u0444. \u0421\u0440\u0430\u0437\u0443 \u0447\u0443\u0432\u0441\u0442\u0432\u0443\u0435\u0442\u0441\u044f, \u0447\u0442\u043e\u00a0\u043e\u043d\u0430 \u00ab\u0436\u0438\u0432\u0430\u044f\u00bb, \u0430\u00a0\u043d\u0435\u00a0\u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u0438 \u043d\u0430\u00a0\u044d\u043a\u0440\u0430\u043d\u0435. \u041f\u0430\u043a\u0435\u0442  \u00a0 <\/p>\n<p><code>flutter_physics<\/code> \u0442\u0443\u0442 \u043e\u0447\u0435\u043d\u044c \u0432\u044b\u0440\u0443\u0447\u0430\u0435\u0442.<\/p>\n<h3>\u0413\u043b\u0430\u0432\u0430 3: \u0410\u0440\u0441\u0435\u043d\u0430\u043b \u0410\u043d\u0438\u043c\u0430\u0442\u043e\u0440\u0430 \u2013 \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u0411\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438<\/h3>\n<p>Flutter \u0441\u0430\u043c \u043f\u043e \u0441\u0435\u0431\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u043e\u0449\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043d\u043e \u0435\u0433\u043e \u044d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0434\u0435\u043b\u0430\u0435\u0442 \u0435\u0433\u043e \u0435\u0449\u0435 \u0441\u0438\u043b\u044c\u043d\u0435\u0435. \u0412 \u044d\u0442\u043e\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0432\u043d\u0435\u0448\u043d\u0438\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0438 \u0441 <a href=\"http:\/\/pub.dev\" rel=\"noopener noreferrer nofollow\">pub.dev<\/a>, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0432\u044b\u0432\u0435\u0441\u0442\u0438 \u0432\u0430\u0448\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043d\u0430 \u043d\u043e\u0432\u044b\u0439 \u0443\u0440\u043e\u0432\u0435\u043d\u044c, \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c \u0438\u0445 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0438\u043b\u0438 \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0438\u0442\u044c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044b \u043a \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432.<\/p>\n<h4>3.1. \u041a\u043e\u0433\u0434\u0430 \u0434\u0438\u0437\u0430\u0439\u043d \u043e\u0436\u0438\u0432\u0430\u0435\u0442: Lottie \u0438 Rive<\/h4>\n<p>\u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0432\u0435\u043a\u0442\u043e\u0440\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438, \u043f\u0435\u0440\u0441\u043e\u043d\u0430\u0436\u0438, \u0437\u0430\u043c\u044b\u0441\u043b\u043e\u0432\u0430\u0442\u044b\u0435 \u0438\u043a\u043e\u043d\u043a\u0438 \u0438\u043b\u0438 \u0446\u0435\u043b\u044b\u0435 \u043e\u043d\u0431\u043e\u0440\u0434\u0438\u043d\u0433-\u0441\u0446\u0435\u043d\u044b, \u0447\u0430\u0441\u0442\u043e \u0431\u044b\u0432\u0430\u0435\u0442 \u0443\u0434\u043e\u0431\u043d\u0435\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u044b, \u0430 \u0437\u0430\u0442\u0435\u043c \u0438\u043d\u0442\u0435\u0433\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u043e Flutter. \u0414\u0432\u0430 \u0433\u043b\u0430\u0432\u043d\u044b\u0445 \u0438\u0433\u0440\u043e\u043a\u0430 \u043d\u0430 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u0435 \u2014 Lottie \u0438 Rive.<\/p>\n<p><strong>Lottie<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u0427\u0442\u043e \u044d\u0442\u043e:<\/strong> Lottie \u2014 \u044d\u0442\u043e \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430, \u0438\u0437\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043d\u043d\u0430\u044f Airbnb, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0430\u0440\u0441\u0438\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0435 \u0432 Adobe After Effects (\u0438 \u044d\u043a\u0441\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0432 \u0444\u043e\u0440\u043c\u0430\u0442 JSON \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043f\u043b\u0430\u0433\u0438\u043d\u0430 Bodymovin), \u0438 \u043d\u0430\u0442\u0438\u0432\u043d\u043e \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u0442\u044c \u0438\u0445 \u043d\u0430 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u0438 \u0432 \u0432\u0435\u0431\u0435. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u0438\u0432\u044b\u0447\u043d\u044b\u0439 \u0438\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 (After Effects) \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0430 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u2014 \u043b\u0435\u0433\u043a\u043e \u0438\u043d\u0442\u0435\u0433\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0438\u0445 \u0431\u0435\u0437 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0438\u0441\u0430\u0442\u044c \u043a\u043e\u0434 \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043a\u0430\u0434\u0440\u0430 \u0438\u043b\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0442\u044f\u0436\u0435\u043b\u044b\u0435 \u0432\u0438\u0434\u0435\u043e\u0444\u0430\u0439\u043b\u044b. JSON-\u0444\u0430\u0439\u043b\u044b Lottie \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0435\u043c\u044b \u0431\u0435\u0437 \u043f\u043e\u0442\u0435\u0440\u0438 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0430, \u0438\u0445 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0446\u0438\u043a\u043b\u0438\u0432\u0430\u0442\u044c \u0438 \u0434\u0430\u0436\u0435 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u043e\u0432\u0430\u0442\u044c \u0441 \u043d\u0438\u043c\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0432\u043e Flutter:<\/strong> \u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 Lottie \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043f\u0430\u043a\u0435\u0442 <code>lottie<\/code> ( \u043d\u0430 <a href=\"http:\/\/pub.dev\" rel=\"noopener noreferrer nofollow\">pub.dev<\/a>). \u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0438 \u043e\u0431\u044b\u0447\u043d\u043e \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u0448\u0430\u0433\u0438 : \u00a0 <\/p>\n<ol>\n<li>\n<p>\u041f\u043e\u043b\u0443\u0447\u0438\u0442\u044c JSON-\u0444\u0430\u0439\u043b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 (\u0438\u043b\u0438 ZIP-\u0430\u0440\u0445\u0438\u0432, \u0435\u0441\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0440\u0430\u0441\u0442\u0440\u043e\u0432\u044b\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f).<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0444\u0430\u0439\u043b \u0432 \u0430\u0441\u0441\u0435\u0442\u044b \u043f\u0440\u043e\u0435\u043a\u0442\u0430 (<code>assets<\/code> \u0432 <code>pubspec.yaml<\/code>).<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0438\u0434\u0436\u0435\u0442 <code>Lottie.asset('path\/to\/your\/animation.json')<\/code> \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u0422\u0430\u043a\u0436\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b <a href=\"http:\/\/Lottie.network\" rel=\"noopener noreferrer nofollow\"><code>Lottie.network<\/code><\/a><code>()<\/code> \u0434\u043b\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u043f\u043e URL \u0438 <code>Lottie.memory()<\/code> \u0434\u043b\u044f \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0438\u0437 \u0431\u0430\u0439\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<\/li>\n<li>\n<p><strong>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439:<\/strong> \u041f\u0430\u043a\u0435\u0442 <code>lottie<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435\u043c. \u041c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 <code>AnimationController<\/code> \u0434\u043b\u044f \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f: \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c, \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c, \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u0442\u044c \u0432 \u043e\u0431\u0440\u0430\u0442\u043d\u043e\u043c \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0438, \u0437\u0430\u0446\u0438\u043a\u043b\u0438\u0432\u0430\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0441\u0435\u0433\u043c\u0435\u043d\u0442\u044b \u0438 \u0442.\u0434.. \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0441 AnimationController \u0438\u0437 [31] (\u0430\u0434\u0430\u043f\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043e) \/\/ class _MyAppState extends State&lt;MyApp&gt; with TickerProviderStateMixin { \/\/   late final AnimationController _controller; \/\/ \/\/   @override \/\/   void initState() { \/\/     super.initState(); \/\/     _controller = AnimationController(vsync: this); \/\/   } \/\/ \/\/   @override \/\/   void dispose() { \/\/     _controller.dispose(); \/\/     super.dispose(); \/\/   } \/\/ \/\/   @override \/\/   Widget build(BuildContext context) { \/\/     return Lottie.asset( \/\/       'assets\/my_animation.json', \/\/       controller: _controller, \/\/       onLoaded: (composition) { \/\/         _controller \/\/          ..duration = composition.duration \/\/          ..forward(); \/\/ \u0438\u043b\u0438..repeat(); \/\/       }, \/\/     ); \/\/   } \/\/ } <\/code><\/pre>\n<\/li>\n<li>\n<p><strong>\u041a\u0430\u0441\u0442\u043e\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f:<\/strong> Lottie \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 &#171;\u043d\u0430 \u043b\u0435\u0442\u0443&#187; \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>delegates<\/code>. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0446\u0432\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0441\u043b\u043e\u044f, \u0442\u0435\u043a\u0441\u0442 \u0438\u043b\u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f <code>ValueDelegate.color()<\/code>, <code>ValueDelegate.text()<\/code>, <code>ValueDelegate.opacity()<\/code> \u0438 \u0434\u0440\u0443\u0433\u0438\u0435. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f:<\/strong>  \u0434\u0430\u0435\u0442 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0445 \u0441\u043e\u0432\u0435\u0442\u043e\u0432 \u043f\u043e \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438 Lottie-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u0440\u0430\u0437\u043c\u0435\u0440 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 (\u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0439\u0442\u0435 \u0438\u0441\u0445\u043e\u0434\u043d\u0438\u043a\u0438), \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u0439\u0442\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0438\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043a\u044d\u0448\u0438\u0440\u0443\u0439\u0442\u0435  \u00a0 <\/p>\n<p><code>LottieComposition<\/code> \u043f\u0440\u0438 \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u043e\u0434\u043d\u043e\u0439 \u0438 \u0442\u043e\u0439 \u0436\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043f\u0440\u0435\u0434\u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0439\u0442\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0430\u043f\u043f\u0430\u0440\u0430\u0442\u043d\u043e\u0435 \u0443\u0441\u043a\u043e\u0440\u0435\u043d\u0438\u0435.  \u0442\u0430\u043a\u0436\u0435 \u0443\u043f\u043e\u043c\u0438\u043d\u0430\u0435\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440  \u00a0 <\/p>\n<p><code>renderCache<\/code> (\u043d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 v3.0 \u043f\u0430\u043a\u0435\u0442\u0430 <code>lottie<\/code>) \u0434\u043b\u044f \u0441\u043d\u0438\u0436\u0435\u043d\u0438\u044f \u044d\u043d\u0435\u0440\u0433\u043e\u043f\u043e\u0442\u0440\u0435\u0431\u043b\u0435\u043d\u0438\u044f \u0437\u0430 \u0441\u0447\u0435\u0442 \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u0430\u0434\u0440\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<p><strong>Rive (\u0440\u0430\u043d\u0435\u0435 Flare)<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u0427\u0442\u043e \u044d\u0442\u043e:<\/strong> Rive \u2014 \u044d\u0442\u043e \u043c\u043e\u0449\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f <strong>\u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0445<\/strong> \u0432\u0435\u043a\u0442\u043e\u0440\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438 \u0440\u0430\u043d\u0442\u0430\u0439\u043c \u0434\u043b\u044f \u0438\u0445 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u044f. \u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0439 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e\u0441\u0442\u044c\u044e Rive \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0435\u0433\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u0430  \u00a0 <\/p>\n<p><strong>State Machines<\/strong> (\u041c\u0430\u0448\u0438\u043d\u044b \u0421\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439), \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0430\u043c \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u0443\u044e \u043b\u043e\u0433\u0438\u043a\u0443 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438 \u0438 \u0440\u0435\u0430\u043a\u0446\u0438\u0438 \u043d\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0432\u0432\u043e\u0434 \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f, \u0431\u0435\u0437 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0438\u0441\u0430\u0442\u044c \u043c\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 Dart. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0432\u043e Flutter:<\/strong> \u0414\u043b\u044f \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0438 Rive-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043f\u0430\u043a\u0435\u0442 <code>rive<\/code> ( \u043d\u0430 <a href=\"http:\/\/pub.dev\" rel=\"noopener noreferrer nofollow\">pub.dev<\/a>). \u0424\u0430\u0439\u043b\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438\u043c\u0435\u044e\u0442 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435  \u00a0 <\/p>\n<p><code>.riv<\/code>.<\/p>\n<ol>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0439\u0442\u0435 \u0438\u043b\u0438 \u0441\u043a\u0430\u0447\u0430\u0439\u0442\u0435 <code>.riv<\/code> \u0444\u0430\u0439\u043b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441 Rive Community).<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u044c\u0442\u0435 \u0444\u0430\u0439\u043b \u0432 \u0430\u0441\u0441\u0435\u0442\u044b \u043f\u0440\u043e\u0435\u043a\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0432\u0438\u0434\u0436\u0435\u0442\u044b <code>RiveAnimation.asset()<\/code>, <a href=\"http:\/\/RiveAnimation.network\" rel=\"noopener noreferrer nofollow\"><code>RiveAnimation.network<\/code><\/a><code>()<\/code>, <code>RiveAnimation.file()<\/code> \u0438\u043b\u0438 <a href=\"http:\/\/RiveAnimation.direct\" rel=\"noopener noreferrer nofollow\"><code>RiveAnimation.direct<\/code><\/a><code>()<\/code> (\u0435\u0441\u043b\u0438 <code>RiveFile<\/code> \u0443\u0436\u0435 \u0437\u0430\u0433\u0440\u0443\u0436\u0435\u043d). \u00a0 <\/p>\n<\/li>\n<\/ol>\n<\/li>\n<li>\n<p><strong>State Machines:<\/strong> \u042d\u0442\u043e \u0441\u0435\u0440\u0434\u0446\u0435 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u0432 Rive. \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a State Machine \u0438\u0437 Dart-\u043a\u043e\u0434\u0430, \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440 (<code>StateMachineController<\/code>) \u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0432\u0445\u043e\u0434\u0430\u043c\u0438 (<code>SMIInput<\/code>), \u0442\u0430\u043a\u0438\u043c\u0438 \u043a\u0430\u043a <code>SMIBool<\/code>, <code>SMINumber<\/code>, <code>SMITrigger<\/code>, \u0447\u0442\u043e\u0431\u044b \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438\u043b\u0438 \u043b\u043e\u0433\u0438\u043a\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f.<\/p>\n<pre><code class=\"dart\">\/\/ \u0423\u043f\u0440\u043e\u0449\u0435\u043d\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f StateMachine \/\/ late Artboard _riveArtboard; \/\/ StateMachineController? _controller; \/\/ SMIBool? _triggerAnimation; \/\/ \/\/ void _onRiveInit(Artboard artboard) { \/\/   _riveArtboard = artboard; \/\/   _controller = StateMachineController.fromArtboard(artboard, 'MyStateMachineName'); \/\/   if (_controller!= null) { \/\/     artboard.addController(_controller!); \/\/     _triggerAnimation = _controller!.findInput&lt;bool&gt;('myInputBoolName') as SMIBool?; \/\/   } \/\/ } \/\/ \/\/ void _toggleAnimation() { \/\/   if (_triggerAnimation!= null) { \/\/     _triggerAnimation!.value =!_triggerAnimation!.value; \/\/   } \/\/ } \/\/ \/\/ RiveAnimation.asset( \/\/   'assets\/my_rive_animation.riv', \/\/   onInit: _onRiveInit, \/\/   stateMachines: const, \/\/ \u041c\u043e\u0436\u043d\u043e \u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u043a\u0430\u043a\u0443\u044e \u043c\u0430\u0448\u0438\u043d\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439 \u0437\u0430\u043f\u0443\u0441\u0442\u0438\u0442\u044c \/\/ ) <\/code><\/pre>\n<\/li>\n<li>\n<p>Rive Native (): \u00a0 <\/p>\n<p> \u041d\u0430 \u043c\u043e\u043c\u0435\u043d\u0442 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u043c\u0430\u0442\u0435\u0440\u0438\u0430\u043b\u0430 (\u0441 \u043f\u0440\u0438\u0446\u0435\u043b\u043e\u043c \u043d\u0430 \u0438\u044e\u043d\u044c 2025), Rive \u0430\u043a\u0442\u0438\u0432\u043d\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0435\u0442 <code>rive_native<\/code> \u2014 \u043d\u043e\u0432\u044b\u0439 \u0440\u0430\u043d\u0442\u0430\u0439\u043c, \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0439 \u043d\u0430 C++ \u044f\u0434\u0440\u0435 Rive \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0438\u0439 Rive Renderer. \u042d\u0442\u043e \u0434\u043e\u043b\u0436\u043d\u043e \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0442\u044c \u043b\u0443\u0447\u0448\u0443\u044e \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c, \u043a\u043e\u043d\u0441\u0438\u0441\u0442\u0435\u043d\u0442\u043d\u043e\u0441\u0442\u044c \u0441 \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u043e\u043c Rive \u0438 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0441\u0430\u043c\u044b\u0445 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0445 \u0444\u0438\u0447, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a Responsive Layouts, Scrolling, Vector Feathering.  \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442, \u0447\u0442\u043e  \u00a0 <\/p>\n<p><code>rive_native<\/code> \u043f\u043e\u043a\u0430 \u043d\u0435 \u0437\u0430\u043c\u0435\u043d\u044f\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0439 \u043f\u0430\u043a\u0435\u0442 <code>rive<\/code>, \u043d\u043e \u043f\u043b\u0430\u043d\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0438\u0445 \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f. \u0410\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u044d\u0442\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 \u043d\u0430 \u0438\u044e\u043d\u044c 2025 \u0433\u043e\u0434\u0430 \u043a\u0440\u0430\u0439\u043d\u0435 \u0432\u0430\u0436\u043d\u0430.<\/p>\n<\/li>\n<\/ul>\n<p><strong>Lottie vs. Rive: \u0427\u0442\u043e \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0434\u043b\u044f \u0442\u0432\u043e\u0438\u0445 \u0437\u0430\u0434\u0430\u0447?<\/strong><\/p>\n<p>\u041e\u0431\u0430 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430 \u043c\u043e\u0449\u043d\u044b\u0435, \u043d\u043e \u0438\u043c\u0435\u044e\u0442 \u0441\u0432\u043e\u0438 \u0441\u0438\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b. \u0412\u043e\u0442 \u0441\u0440\u0430\u0432\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0442\u0430\u0431\u043b\u0438\u0446\u0430, \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u043d\u0430 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438 (): \u00a0 <\/p>\n<p><strong>\u0422\u0430\u0431\u043b\u0438\u0446\u0430 3: \u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 Lottie \u0438 Rive (\u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u043e\u0447\u043d\u043e \u043d\u0430 \u0418\u044e\u043d\u044c 2025)<\/strong><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u041a\u0440\u0438\u0442\u0435\u0440\u0438\u0439<\/p>\n<\/td>\n<td>\n<p align=\"left\">Lottie<\/p>\n<\/td>\n<td>\n<p align=\"left\">Rive<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0435 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0445, \u043f\u0440\u0435\u0434-\u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0445 \u0432\u0435\u043a\u0442\u043e\u0440\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0438 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0445 \u0432\u0435\u043a\u0442\u043e\u0440\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0430, \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043a\u043e\u0434\u0430 \u043d\u0430 \u0441\u0442\u043e\u0440\u043e\u043d\u0435 Flutter  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u0430\u044f \u0447\u0435\u0440\u0435\u0437 State Machines, \u043c\u043e\u0449\u043d\u0430\u044f \u0438 \u0433\u0438\u0431\u043a\u0430\u044f  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0420\u0435\u0434\u0430\u043a\u0442\u043e\u0440<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">Adobe After Effects + Bodymovin \u043f\u043b\u0430\u0433\u0438\u043d  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 \u043e\u043d\u043b\u0430\u0439\u043d-\u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440 Rive  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0420\u0430\u0437\u043c\u0435\u0440 \u0444\u0430\u0439\u043b\u043e\u0432<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">JSON, \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0438\u043c. \u041e\u0431\u044b\u0447\u043d\u043e \u0431\u043e\u043b\u044c\u0448\u0435, \u0447\u0435\u043c Rive  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0411\u0438\u043d\u0430\u0440\u043d\u044b\u0439 \u0444\u043e\u0440\u043c\u0430\u0442 <code>.riv<\/code>, \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d, \u043e\u0431\u044b\u0447\u043d\u043e \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043c\u0435\u043d\u044c\u0448\u0435 Lottie  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0417\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438, \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0435\u043c\u043a\u0438\u043c  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d \u0434\u043b\u044f GPU, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0441 Rive Renderer (\u0432 <code>rive_native<\/code>)  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0447\u0435\u0440\u0435\u0437 <code>delegates<\/code>  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0413\u043b\u0443\u0431\u043e\u043a\u043e\u0435 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0447\u0435\u0440\u0435\u0437 State Machine inputs, \u0442\u0435\u043a\u0441\u0442\u043e\u043c, \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f\u043c\u0438 (\u043e\u0436\u0438\u0434\u0430\u0435\u0442\u0441\u044f data binding)  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0430 \u0430\u0443\u0434\u0438\u043e<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0435\u0442 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0439 (\u043d\u0443\u0436\u043d\u043e \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0440\u0443\u0447\u043d\u0443\u044e)<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 Rive (\u0430\u0443\u0434\u0438\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0447\u0430\u0441\u0442\u044c\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438)  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041a\u0440\u0438\u0432\u0430\u044f \u043e\u0431\u0443\u0447\u0435\u043d\u0438\u044f \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">After Effects \u2013 \u043f\u0440\u043e\u0444\u0435\u0441\u0441\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442, \u0432\u044b\u0441\u043e\u043a\u0438\u0439 \u043f\u043e\u0440\u043e\u0433 \u0432\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f<\/p>\n<\/td>\n<td>\n<p align=\"left\">Rive Editor \u2013 \u043f\u0440\u043e\u0449\u0435 \u0434\u043b\u044f \u043e\u0441\u0432\u043e\u0435\u043d\u0438\u044f, \u0435\u0441\u043b\u0438 \u043d\u0435\u0442 \u043e\u043f\u044b\u0442\u0430 \u0441 AE<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u042d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0430\/\u0421\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041e\u0447\u0435\u043d\u044c \u0431\u043e\u043b\u044c\u0448\u0430\u044f, \u043c\u043d\u043e\u0433\u043e \u0433\u043e\u0442\u043e\u0432\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0420\u0430\u0441\u0442\u0443\u0449\u0430\u044f, \u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u0441\u043e\u043e\u0431\u0449\u0435\u0441\u0442\u0432\u043e, Rive Community \u0434\u043b\u044f \u043e\u0431\u043c\u0435\u043d\u0430 \u0444\u0430\u0439\u043b\u0430\u043c\u0438<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0421\u0442\u043e\u0438\u043c\u043e\u0441\u0442\u044c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">Lottie (\u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430) \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u0430, After Effects \u043f\u043b\u0430\u0442\u043d\u044b\u0439.<\/p>\n<\/td>\n<td>\n<p align=\"left\">Rive \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u044b\u0439 \u0438 \u043f\u043b\u0430\u0442\u043d\u044b\u0435 \u0442\u0430\u0440\u0438\u0444\u044b \u0434\u043b\u044f \u0440\u0435\u0434\u0430\u043a\u0442\u043e\u0440\u0430 \u0438 \u043a\u043e\u043c\u0430\u043d\u0434\u043d\u043e\u0439 \u0440\u0430\u0431\u043e\u0442\u044b.<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u0445\u043e\u0440\u043e\u0448\u043e \u0441\u0443\u043c\u043c\u0438\u0440\u0443\u0435\u0442: &#171;Rive \u043f\u0440\u0435\u0443\u0441\u043f\u0435\u0432\u0430\u0435\u0442 \u0432 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u0445 \u0438 \u0438\u0433\u0440\u0430\u0445, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a Lottie \u0441\u0438\u044f\u0435\u0442 \u0432 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u043f\u0440\u0435\u0434\u0432\u0430\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043e\u0442\u0440\u0435\u043d\u0434\u0435\u0440\u0435\u043d\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439&#187;. \u041f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e Rive \u0432 \u0440\u0430\u0437\u043c\u0435\u0440\u0435 \u0444\u0430\u0439\u043b\u043e\u0432: &#171;Rive \u0444\u0430\u0439\u043b\u044b \u043e\u0431\u044b\u0447\u043d\u043e \u0432 10-15 \u0440\u0430\u0437 \u043c\u0435\u043d\u044c\u0448\u0435, \u0447\u0435\u043c \u044d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442\u043d\u044b\u0435 Lottie \u0444\u0430\u0439\u043b\u044b&#187;.  <\/p>\n<p>\u041d\u0430\u0431\u043b\u044e\u0434\u0430\u0435\u0442\u0441\u044f \u044f\u0432\u043d\u044b\u0439 \u0441\u0434\u0432\u0438\u0433 \u0432 \u0441\u0442\u043e\u0440\u043e\u043d\u0443 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c (State-Driven). Lottie \u0438\u0441\u0442\u043e\u0440\u0438\u0447\u0435\u0441\u043a\u0438 \u0431\u044b\u043b \u0441\u0438\u043b\u0435\u043d \u0432\u00a0\u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u0438\u00a0\u043b\u0438\u043d\u0435\u0439\u043d\u044b\u0445, \u00ab\u0437\u0430\u043f\u0435\u0447\u0435\u043d\u043d\u044b\u0445\u00bb \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. Rive\u00a0\u0436\u0435 \u0441\u00a0\u0441\u0430\u043c\u043e\u0433\u043e \u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u0435\u043b\u0430\u043b \u0441\u0442\u0430\u0432\u043a\u0443 \u043d\u0430\u00a0\u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c \u0447\u0435\u0440\u0435\u0437 State Machines. \u0421\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0435 UI\/UX \u0442\u0440\u0435\u043d\u0434\u044b \u0432\u0441\u0435 \u0431\u043e\u043b\u044c\u0448\u0435 \u0442\u0440\u0435\u0431\u0443\u044e\u0442, \u0447\u0442\u043e\u0431\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043d\u0435\u00a0\u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u043b\u0438\u0441\u044c, \u0430\u00a0\u0440\u0435\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u043b\u0438 \u043d\u0430\u00a0\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u0438\u043b\u0438\u00a0\u0432\u043d\u0435\u0448\u043d\u0438\u0435 \u0434\u0430\u043d\u043d\u044b\u0435. Rive, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0441\u00a0\u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435\u043c <code>rive_native<\/code>, \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043b\u0443\u0447\u0448\u0435 \u043f\u043e\u0434\u0433\u043e\u0442\u043e\u0432\u043b\u0435\u043d\u043d\u044b\u043c \u043a\u00a0\u0442\u0430\u043a\u0438\u043c \u0437\u0430\u0434\u0430\u0447\u0430\u043c \u00ab\u0438\u0437 \u043a\u043e\u0440\u043e\u0431\u043a\u0438\u00bb. \u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0434\u043b\u044f\u00a0\u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439, \u0433\u0434\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043d\u0435\u00a0\u043f\u0440\u043e\u0441\u0442\u043e \u0434\u0435\u043a\u043e\u0440\u043e\u043c, \u0430\u00a0\u0447\u0430\u0441\u0442\u044c\u044e \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043e\u043f\u044b\u0442\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432\u00a0\u0438\u0433\u0440\u0430\u0445, \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u043e\u043d\u0431\u043e\u0440\u0434\u0438\u043d\u0433\u0430\u0445, \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0434\u0430\u0448\u0431\u043e\u0440\u0434\u0430\u0445), Rive \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0431\u043e\u043b\u0435\u0435 \u043c\u043e\u0449\u043d\u043e\u0435 \u0438 \u0438\u043d\u0442\u0435\u0433\u0440\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435. Lottie \u0432\u0441\u0435 \u0435\u0449\u0435 \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u043e\u0442\u043b\u0438\u0447\u043d\u044b\u043c \u0432\u044b\u0431\u043e\u0440\u043e\u043c \u0434\u043b\u044f\u00a0\u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u044b\u0445, \u0437\u0430\u0440\u0430\u043d\u0435\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. \u0415\u0441\u043b\u0438 \u0442\u0435\u0431\u0435 \u043d\u0443\u0436\u043d\u0430 \u043f\u0440\u043e\u0441\u0442\u043e \u043a\u0440\u0430\u0441\u0438\u0432\u0430\u044f \u00ab\u0433\u0438\u0444\u043a\u0430\u00bb \u043d\u0430\u00a0\u0441\u0442\u0435\u0440\u043e\u0438\u0434\u0430\u0445\u00a0\u2014 Lottie \u0441\u043f\u0440\u0430\u0432\u0438\u0442\u0441\u044f. \u041d\u043e\u00a0\u0435\u0441\u043b\u0438 \u0442\u0432\u043e\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u0436\u0438\u0442\u044c, \u0434\u044b\u0448\u0430\u0442\u044c \u0438 \u0440\u0435\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u00a0\u043a\u0430\u0436\u0434\u044b\u0439 \u0447\u0438\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u00a0\u2014 \u0441\u043c\u043e\u0442\u0440\u0438 \u0432\u00a0\u0441\u0442\u043e\u0440\u043e\u043d\u0443 Rive. \u0415\u0433\u043e State Machines\u00a0\u2014 \u044d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0441\u043d\u044f! <\/p>\n<h4>3.2. \u0422\u043e\u043f \u041f\u0430\u043a\u0435\u0442\u044b \u0441 pub.dev \u0434\u043b\u044f \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0439<\/h4>\n<p>\u041a\u0440\u043e\u043c\u0435 \u00ab\u0431\u043e\u043b\u044c\u0448\u043e\u0439 \u0434\u0432\u043e\u0439\u043a\u0438\u00bb (Lottie \u0438 Rive) \u0434\u043b\u044f\u00a0\u0432\u0435\u043a\u0442\u043e\u0440\u043d\u043e\u0439 \u0433\u0440\u0430\u0444\u0438\u043a\u0438, \u043d\u0430 <a href=\"http:\/\/pub.dev\" rel=\"noopener noreferrer nofollow\">pub.dev<\/a> \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0445 \u043f\u0430\u043a\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0442\u0438\u043f\u043e\u0432 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438\u043b\u0438\u00a0\u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0438\u0442\u044c \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0435, \u0431\u043e\u043b\u0435\u0435 \u0434\u0435\u043a\u043b\u0430\u0440\u0430\u0442\u0438\u0432\u043d\u044b\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044b \u043a\u00a0\u0440\u0430\u0431\u043e\u0442\u0435 \u0441\u00a0\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438 \u0432\u043e\u00a0Flutter.<\/p>\n<ul>\n<li>\n<p><code><strong>flutter_animate<\/strong><\/code> () \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435:<\/strong> \u042d\u0442\u043e \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u0430\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u043a \u043b\u044e\u0431\u044b\u043c \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0443\u0434\u043e\u0431\u043d\u043e\u0433\u043e \u0438 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0433\u043e chaining-\u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441\u0430 (\u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441\u0430 \u0446\u0435\u043f\u043e\u0447\u0435\u043a \u0432\u044b\u0437\u043e\u0432\u043e\u0432). \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>myWidget.animate().fadeIn().slide()<\/code>.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0444\u0438\u0447\u0438:<\/strong>  \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u041f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/strong> \u0417\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043d\u0438\u0436\u0430\u0435\u0442 \u0431\u043e\u0439\u043b\u0435\u0440\u043f\u043b\u0435\u0439\u0442 \u043f\u043e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044e \u0441\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u043c\u0438 \u044f\u0432\u043d\u044b\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>\u041c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u0435\u0434\u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432:<\/strong> \u0412\u043a\u043b\u044e\u0447\u0430\u0435\u0442 fade, scale, slide, align, flip, blur, shake, shimmer, \u0442\u0435\u043d\u0438, crossfades, \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0435 \u043f\u043e \u043f\u0443\u0442\u0438, \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u0446\u0432\u0435\u0442\u0430 (\u043d\u0430\u0441\u044b\u0449\u0435\u043d\u043d\u043e\u0441\u0442\u044c, \u043e\u0442\u0442\u0435\u043d\u043e\u043a) \u0438 \u0434\u0430\u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 GLSL \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p><strong>\u0413\u0438\u0431\u043a\u0430\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430:<\/strong> \u0414\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u0434\u0430\u0442\u044c <code>delay<\/code>, <code>duration<\/code>, <code>curve<\/code>, <code>begin<\/code>, <code>end<\/code>.<\/p>\n<\/li>\n<li>\n<p><strong>\u041f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438:<\/strong> <code>ThenEffect<\/code> (\u0438\u043b\u0438 \u043f\u0440\u043e\u0441\u0442\u043e <code>.then()<\/code>) \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043b\u0435\u0433\u043a\u043e \u0432\u044b\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441\u043f\u0438\u0441\u043a\u043e\u0432:<\/strong> <code>AnimateList<\/code> \u0434\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u043a \u0441\u043f\u0438\u0441\u043a\u0443 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u0441 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e \u0437\u0430\u0434\u0430\u043d\u0438\u044f \u0438\u043d\u0442\u0435\u0440\u0432\u0430\u043b\u0430 \u043c\u0435\u0436\u0434\u0443 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b:<\/strong> <code>CustomEffect<\/code> \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0445 \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<li>\n<p><strong>\u0428\u0430\u0440\u0438\u043d\u0433 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432:<\/strong> \u0412\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0438 \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u0431\u043e\u0440\u044b \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p> \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u0435\u0435 &#171;\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u043e\u0439, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0443\u043f\u0440\u043e\u0449\u0430\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043b\u044e\u0431\u043e\u0433\u043e \u0432\u0438\u0434\u0430 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0430&#187;.  \u0434\u0430\u0435\u0442 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u044b\u0439 \u0440\u0430\u0437\u0431\u043e\u0440 \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441\u0430 \u0438 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0435\u0439. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0437 : \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ Container(width: 150, height: 150, color: Colors.red) \/\/  .animate() \/\/  .fadeIn(duration: 500.ms) \/\/ ms - \u044d\u0442\u043e \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u0438\u0437 flutter_animate \/\/  .slideX(duration: 700.ms, curve: Curves.easeInCubic); <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><code><strong>simple_animations<\/strong><\/code> () \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435:<\/strong> \u0415\u0449\u0435 \u043e\u0434\u043d\u0430 \u043c\u043e\u0449\u043d\u0430\u044f \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a\u0430, \u043d\u0430\u0446\u0435\u043b\u0435\u043d\u043d\u0430\u044f \u043d\u0430 \u0443\u043f\u0440\u043e\u0449\u0435\u043d\u0438\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 <code>AnimationController<\/code> \u0438 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 (\u0432 \u0442\u043e\u043c \u0447\u0438\u0441\u043b\u0435 staggered) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0435\u0439.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0444\u0438\u0447\u0438:<\/strong>  \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>Animation Builders:<\/strong> <code>PlayAnimationBuilder<\/code>, <code>LoopAnimationBuilder<\/code>, <code>MirrorAnimationBuilder<\/code>, <code>CustomAnimationBuilder<\/code>. \u042d\u0442\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u044b \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0431\u0435\u0437 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c <code>StatefulWidget<\/code> \u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c <code>AnimationController<\/code>. \u0412\u044b \u043f\u0440\u043e\u0441\u0442\u043e \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0435\u0442\u0435 <code>tween<\/code>, <code>duration<\/code> \u0438 <code>builder<\/code> \u0444\u0443\u043d\u043a\u0446\u0438\u044e.<\/p>\n<\/li>\n<li>\n<p><code><strong>MovieTween<\/strong><\/code><strong>:<\/strong> \u041e\u0447\u0435\u043d\u044c \u043c\u043e\u0449\u043d\u044b\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u043c\u043d\u043e\u0433\u043e\u044d\u0442\u0430\u043f\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 (\u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d\u043e\u0432), \u0433\u0434\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u043f\u0430\u0440\u0430\u043b\u043b\u0435\u043b\u044c\u043d\u043e \u0438\u043b\u0438 \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u0441 \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u043a\u0440\u0438\u0432\u044b\u043c\u0438 \u0438 \u0434\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044f\u043c\u0438. \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c &#171;\u0441\u0446\u0435\u043d\u044b&#187;.<\/p>\n<\/li>\n<li>\n<p><code><strong>AnimationMixin<\/strong><\/code><strong>:<\/strong> \u041c\u0438\u043a\u0441\u0438\u043d \u0434\u043b\u044f <code>StatefulWidget<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0443\u043f\u0440\u043e\u0449\u0430\u0435\u0442 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 \u043e\u0434\u043d\u0438\u043c \u0438\u043b\u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 <code>AnimationController<\/code>, \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u044f \u0438\u0445 \u0436\u0438\u0437\u043d\u0435\u043d\u043d\u044b\u043c \u0446\u0438\u043a\u043b\u043e\u043c (\u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f, dispose).<\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u043e\u0442\u043b\u0430\u0434\u043a\u0438:<\/strong> \u0412\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430 \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0442\u043b\u0430\u0434\u043a\u0438 \u0438 \u0442\u043e\u043d\u043a\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p> \u0433\u043b\u0430\u0441\u0438\u0442: &#171;Simple Animations \u0443\u043f\u0440\u043e\u0449\u0430\u0435\u0442 \u043f\u0440\u043e\u0446\u0435\u0441\u0441 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043a\u0440\u0430\u0441\u0438\u0432\u044b\u0445 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439&#187;.  (\u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e \u043d\u0430 \u0438\u044e\u043d\u044c 2025) \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u0441\u0447\u0435\u0440\u043f\u044b\u0432\u0430\u044e\u0449\u0435\u0435 \u0440\u0443\u043a\u043e\u0432\u043e\u0434\u0441\u0442\u0432\u043e \u043f\u043e \u0432\u0441\u0435\u043c \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u0430\u043c \u043f\u0430\u043a\u0435\u0442\u0430 \u0441 \u043f\u0440\u0438\u043c\u0435\u0440\u0430\u043c\u0438 \u043a\u043e\u0434\u0430. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438\u043c\u0435\u0440 <code>PlayAnimationBuilder<\/code> \u0438\u0437 : \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ PlayAnimationBuilder&lt;double&gt;( \/\/   tween: Tween&lt;double&gt;(begin: 50.0, end: 200.0), \/\/   duration: const Duration(seconds: 5), \/\/   curve: Curves.easeInOut, \/\/   builder: (context, value, child) { \/\/     return Container( \/\/       width: value, \/\/       height: value, \/\/       color: Colors.green, \/\/       child: child, \/\/     ); \/\/   }, \/\/   child: const Text('Hello World'), \/\/ ); <\/code><\/pre>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><code><strong>animations<\/strong><\/code><strong> (Material Motion)<\/strong> () \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u041e\u043f\u0438\u0441\u0430\u043d\u0438\u0435:<\/strong> \u041e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u043f\u0430\u043a\u0435\u0442 \u043e\u0442 \u043a\u043e\u043c\u0430\u043d\u0434\u044b Flutter, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0440\u0435\u0430\u043b\u0438\u0437\u0443\u0435\u0442 \u043d\u0430\u0431\u043e\u0440 \u043f\u0440\u0435\u0434\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u043e\u0432 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u0438\u0437 \u0441\u043f\u0435\u0446\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 Material Motion. \u042d\u0442\u0438 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u044b \u043f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c \u043b\u0443\u0447\u0448\u0435 \u043f\u043e\u043d\u0438\u043c\u0430\u0442\u044c \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u044e \u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0444\u0438\u0447\u0438:<\/strong>  \u00a0 <\/p>\n<ul>\n<li>\n<p><strong>\u0413\u043e\u0442\u043e\u0432\u044b\u0435 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u044b \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>Container transform:<\/strong> \u0414\u043b\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 UI-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438, \u0432\u043a\u043b\u044e\u0447\u0430\u044e\u0449\u0438\u043c\u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0430 -&gt; \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u044b\u0439 \u044d\u043a\u0440\u0430\u043d, FAB -&gt; \u043d\u043e\u0432\u044b\u0439 \u044d\u043a\u0440\u0430\u043d). \u0421\u043e\u0437\u0434\u0430\u0435\u0442 \u0432\u0438\u0434\u0438\u043c\u0443\u044e \u0441\u0432\u044f\u0437\u044c \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438.<\/p>\n<\/li>\n<li>\n<p><strong>Shared axis:<\/strong> \u0414\u043b\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 UI-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438, \u0438\u043c\u0435\u044e\u0449\u0438\u043c\u0438 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u0443\u044e \u0438\u043b\u0438 \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u043e\u043d\u043d\u0443\u044e \u0441\u0432\u044f\u0437\u044c (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0448\u0430\u0433\u0438 \u0432 \u043e\u043d\u0431\u043e\u0440\u0434\u0438\u043d\u0433\u0435 \u043f\u043e \u043e\u0441\u0438 X, \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u0432 \u0441\u0442\u0435\u043f\u043f\u0435\u0440\u0435 \u043f\u043e \u043e\u0441\u0438 Y).<\/p>\n<\/li>\n<li>\n<p><strong>Fade through:<\/strong> \u0414\u043b\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 UI-\u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438, \u043d\u0435 \u0438\u043c\u0435\u044e\u0449\u0438\u043c\u0438 \u0441\u0438\u043b\u044c\u043d\u043e\u0439 \u0441\u0432\u044f\u0437\u0438 \u0434\u0440\u0443\u0433 \u0441 \u0434\u0440\u0443\u0433\u043e\u043c (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435 \u0432\u043a\u043b\u0430\u0434\u043e\u043a \u0432 BottomNavigationBar).<\/p>\n<\/li>\n<li>\n<p><strong>Fade:<\/strong> \u0414\u043b\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0438\u043b\u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u044e\u0442 \u0432 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u0445 \u044d\u043a\u0440\u0430\u043d\u0430 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0434\u0438\u0430\u043b\u043e\u0433\u043e\u0432\u043e\u0435 \u043e\u043a\u043d\u043e, \u043c\u0435\u043d\u044e, Snackbar).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0412\u044b\u0441\u043e\u043a\u043e\u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438:<\/strong> \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0442 \u0433\u0430\u0439\u0434\u043b\u0430\u0439\u043d\u0430\u043c Material Design.<\/p>\n<\/li>\n<li>\n<p><strong>\u0423\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435 UX:<\/strong> \u041f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0441\u0438\u0441\u0442\u0435\u043d\u0442\u043d\u044b\u0439 \u0438 \u0438\u043d\u0442\u0443\u0438\u0442\u0438\u0432\u043d\u043e \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p> \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u0438\u0432\u0430\u0435\u0442, \u0447\u0442\u043e &#171;Material motion \u2014 \u044d\u0442\u043e \u043d\u0430\u0431\u043e\u0440 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u043e\u0432 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c \u043f\u043e\u043d\u0438\u043c\u0430\u0442\u044c \u0438 \u043d\u0430\u0432\u0438\u0433\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438&#187;. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p><strong>\u0422\u0430\u0431\u043b\u0438\u0446\u0430 4: \u041a\u0440\u0430\u0442\u043a\u0438\u0439 \u0421\u043f\u0440\u0430\u0432\u043e\u0447\u043d\u0438\u043a \u043f\u043e \u041f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u043c \u041f\u0430\u043a\u0435\u0442\u0430\u043c \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0439 (\u0418\u044e\u043d\u044c 2025)<\/strong><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u041d\u0430\u0437\u0432\u0430\u043d\u0438\u0435 \u043f\u0430\u043a\u0435\u0442\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438\/\u0424\u0438\u043b\u043e\u0441\u043e\u0444\u0438\u044f<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041a\u043e\u0433\u0434\u0430 \u043b\u0443\u0447\u0448\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>flutter_animate<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0414\u0435\u043a\u043b\u0430\u0440\u0430\u0442\u0438\u0432\u043d\u043e\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0430 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u0447\u0435\u0440\u0435\u0437 chaining-\u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441. \u041f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u0438 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c.  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0411\u044b\u0441\u0442\u0440\u043e\u0435 &#171;\u043e\u0436\u0438\u0432\u043b\u0435\u043d\u0438\u0435&#187; \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u043c\u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0430\u043c\u0438 (fade, slide, scale \u0438 \u0442.\u0434.) \u0431\u0435\u0437 \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u0438\u044f \u0441\u043b\u043e\u0436\u043d\u043e\u0439 \u043b\u043e\u0433\u0438\u043a\u0438.<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>simple_animations<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0423\u043f\u0440\u043e\u0449\u0435\u043d\u0438\u0435 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, <code>MovieTween<\/code> \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d\u043e\u0432, <code>AnimationMixin<\/code>.  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u043c\u043d\u043e\u0433\u043e\u044d\u0442\u0430\u043f\u043d\u044b\u0445 \u0438\u043b\u0438 \u0446\u0438\u043a\u043b\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430\u043c\u0438 \u0431\u0435\u0437 \u0431\u043e\u0439\u043b\u0435\u0440\u043f\u043b\u0435\u0439\u0442\u0430.<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><code>animations<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0420\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043f\u0430\u0442\u0442\u0435\u0440\u043d\u043e\u0432 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 Material Motion.  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043a\u043e\u043d\u0441\u0438\u0441\u0442\u0435\u043d\u0442\u043d\u044b\u0445 \u0438 \u043f\u043e\u043d\u044f\u0442\u043d\u044b\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 \u044d\u043a\u0440\u0430\u043d\u0430\u043c\u0438 \u0438\u043b\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u0432 \u0441\u0442\u0438\u043b\u0435 Material Design.<\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u0410\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044f \u0442\u0430\u043a\u0438\u0435 \u043f\u0430\u043a\u0435\u0442\u044b, \u043a\u0430\u043a <code>flutter_animate<\/code>  \u0438  \u00a0 <\/p>\n<p><code>simple_animations<\/code> , \u043c\u043e\u0436\u043d\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043e\u0431\u0449\u0443\u044e \u0442\u0435\u043d\u0434\u0435\u043d\u0446\u0438\u044e \u0432 \u044d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0435 Flutter: \u0441\u0442\u0440\u0435\u043c\u043b\u0435\u043d\u0438\u0435 \u043a \u0431\u043e\u043b\u0435\u0435 \u0434\u0435\u043a\u043b\u0430\u0440\u0430\u0442\u0438\u0432\u043d\u044b\u043c \u0438 \u0432\u044b\u0441\u043e\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u043c API \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.  \u00a0 <\/p>\n<p><code>flutter_animate<\/code> \u0441 \u0435\u0433\u043e \u0446\u0435\u043f\u043e\u0447\u0435\u0447\u043d\u044b\u043c \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441\u043e\u043c \u0438 <code>simple_animations<\/code> \u0441 \u0435\u0433\u043e Animation Builders \u0441\u043a\u0440\u044b\u0432\u0430\u044e\u0442 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0440\u0443\u0447\u043d\u043e\u0433\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f <code>AnimationController<\/code> \u0434\u043b\u044f \u043c\u043d\u043e\u0433\u0438\u0445 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u043d\u044b\u0445 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0435\u0432. \u042d\u0442\u043e \u0433\u043e\u0432\u043e\u0440\u0438\u0442 \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0438\u0449\u0443\u0442 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u043e\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u0436\u0435\u043b\u0430\u0435\u043c\u044b\u0439 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 (&#171;\u0447\u0442\u043e \u0445\u043e\u0447\u0443 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c&#187;), \u0430 \u043d\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u044b\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u043f\u043e\u0448\u0430\u0433\u043e\u0432\u043e (&#171;\u043a\u0430\u043a \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c&#187;). \u042d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0430\u043a\u0442\u0438\u0432\u043d\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u0441\u0442\u043e\u0440\u043e\u043d\u0443 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u043d\u0438\u0436\u0430\u044e\u0442 \u043f\u043e\u0440\u043e\u0433 \u0432\u0445\u043e\u0436\u0434\u0435\u043d\u0438\u044f \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438 \u0443\u043c\u0435\u043d\u044c\u0448\u0430\u044e\u0442 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0448\u0430\u0431\u043b\u043e\u043d\u043d\u043e\u0433\u043e \u043a\u043e\u0434\u0430. \u0415\u0441\u043b\u0438 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0435 API \u0424\u043b\u0430\u0442\u0442\u0435\u0440\u0430 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u2013 \u044d\u0442\u043e \u043d\u0430\u0431\u043e\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 &#171;\u0441\u0434\u0435\u043b\u0430\u0439 \u0441\u0430\u043c&#187;, \u0442\u043e \u043f\u0430\u043a\u0435\u0442\u044b \u0442\u0438\u043f\u0430 <code>flutter_animate<\/code> \u2013 \u044d\u0442\u043e \u043a\u0430\u043a IKEA \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: \u0432\u0437\u044f\u043b \u0433\u043e\u0442\u043e\u0432\u044b\u0435 \u0431\u043b\u043e\u043a\u0438, \u0441\u043e\u0435\u0434\u0438\u043d\u0438\u043b \u2013 \u0438 \u043a\u0440\u0430\u0441\u043e\u0442\u0430! \u042d\u043a\u043e\u043d\u043e\u043c\u0438\u0442 \u043a\u0443\u0447\u0443 \u0432\u0440\u0435\u043c\u0435\u043d\u0438.<\/p>\n<h3>\u0413\u043b\u0430\u0432\u0430 4: \u041e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u2013 \u0427\u0442\u043e\u0431\u044b \u041b\u0435\u0442\u0430\u043b\u043e, \u0430 \u043d\u0435 \u041b\u0430\u0433\u0430\u043b\u043e!<\/h3>\n<p>\u041a\u0440\u0430\u0441\u0438\u0432\u044b\u0435 \u0438 \u043f\u043b\u0430\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2014 \u044d\u0442\u043e \u0442\u043e, \u0447\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u0440\u0438\u044f\u0442\u043d\u044b\u043c \u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438. \u041d\u043e \u0435\u0441\u043b\u0438 \u043e\u043d\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442 \u0442\u043e\u0440\u043c\u043e\u0437\u0438\u0442\u044c, &#171;\u0434\u0435\u0440\u0433\u0430\u0442\u044c\u0441\u044f&#187; (jank) \u0438\u043b\u0438 \u0438\u0437\u043b\u0438\u0448\u043d\u0435 \u043d\u0430\u0433\u0440\u0443\u0436\u0430\u0442\u044c \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u0440 \u0438 \u0431\u0430\u0442\u0430\u0440\u0435\u044e, \u0442\u043e \u0432\u0435\u0441\u044c \u043f\u043e\u043b\u043e\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u0441\u0445\u043e\u0434\u0438\u0442 \u043d\u0430 \u043d\u0435\u0442, \u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442 \u0441\u0442\u0440\u0430\u0434\u0430\u0435\u0442. \u0412 \u044d\u0442\u043e\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u043f\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0437\u0430\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432\u0430\u0448\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043b\u0435\u0442\u0430\u0442\u044c \u0441\u043e \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\u044e 60+ FPS, \u0430 \u043d\u0435 \u043f\u043e\u043b\u0437\u0430\u0442\u044c, \u0438 \u043a\u0430\u043a\u0438\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0438 \u043f\u043e\u0434\u0445\u043e\u0434\u044b Flutter \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0434\u043b\u044f \u0434\u0438\u0430\u0433\u043d\u043e\u0441\u0442\u0438\u043a\u0438 \u0438 \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438.<\/p>\n<h4>4.1. \u041f\u043e\u0447\u0435\u043c\u0443 \u0442\u043e\u0440\u043c\u043e\u0437\u0438\u0442? \u0420\u0430\u0437\u0431\u0438\u0440\u0430\u0435\u043c \u0442\u0438\u043f\u0438\u0447\u043d\u044b\u0435 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b.<\/h4>\n<p>\u041f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u043b\u0435\u0447\u0438\u0442\u044c, \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u043d\u044f\u0442\u044c \u043f\u0440\u0438\u0447\u0438\u043d\u044b \u0431\u043e\u043b\u0435\u0437\u043d\u0438. \u0412\u043e\u0442 \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u043d\u044b\u0435 \u0432\u0438\u043d\u043e\u0432\u043d\u0438\u043a\u0438 \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0432\u043e Flutter:<\/p>\n<ul>\n<li>\n<p><strong>\u0418\u0437\u0431\u044b\u0442\u043e\u0447\u043d\u0430\u044f \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0439\u043a\u0430 UI (Excessive Widget Rebuilds):<\/strong> \u042d\u0442\u043e, \u043f\u043e\u0436\u0430\u043b\u0443\u0439, \u0441\u0430\u043c\u0430\u044f \u0447\u0430\u0441\u0442\u0430\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430. \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0439\u043a\u0443 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043c\u0435\u043d\u044f\u044e\u0442\u0441\u044f. \u0415\u0441\u043b\u0438 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0442\u0438\u043a\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0431\u043e\u043b\u044c\u0448\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0434\u0435\u0440\u0435\u0432\u0430 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u0438\u043b\u0438 \u0434\u0430\u0436\u0435 \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d, \u044d\u0442\u043e \u043d\u0435\u0438\u0437\u0431\u0435\u0436\u043d\u043e \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u0442 \u043a \u043f\u0430\u0434\u0435\u043d\u0438\u044e FPS. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041d\u0435\u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u0435 \u0441\u043f\u0438\u0441\u043a\u043e\u0432:<\/strong> \u0425\u043e\u0442\u044f \u044d\u0442\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u043e\u0431\u0449\u0435\u0439 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0445 \u0441\u043f\u0438\u0441\u043a\u043e\u0432 \u044d\u0442\u043e \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043a\u0440\u0438\u0442\u0438\u0447\u043d\u044b\u043c. \u041f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u0435 \u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u0441\u043f\u0438\u0441\u043a\u043e\u0432 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 <code>Column<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 <code>SingleChildScrollView<\/code>) \u0432\u043c\u0435\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043b\u0435\u043d\u0438\u0432\u044b\u0445 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u043e\u0432 \u0442\u0438\u043f\u0430 <code>ListView.builder<\/code> \u0438\u043b\u0438 <code>GridView.builder<\/code> \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u0442\u043e\u0440\u043c\u043e\u0437\u0430. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0421\u043b\u0438\u0448\u043a\u043e\u043c \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0438\u043b\u0438 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0435\u043c\u043a\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438:<\/strong> \u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043f\u043e \u0441\u0432\u043e\u0435\u0439 \u043f\u0440\u0438\u0440\u043e\u0434\u0435 \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u043c\u043d\u043e\u0433\u043e \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0439 \u043d\u0430 \u043a\u0430\u0436\u0434\u044b\u0439 \u043a\u0430\u0434\u0440 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u043c\u0430\u0442\u0435\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0438, \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432, \u0442\u044f\u0436\u0435\u043b\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u0432\u0440\u043e\u0434\u0435 \u0431\u043b\u044e\u0440\u0430 \u043d\u0430 \u0431\u043e\u043b\u044c\u0448\u0438\u0445 \u043e\u0431\u043b\u0430\u0441\u0442\u044f\u0445). \u041d\u0430 \u0441\u043b\u0430\u0431\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0441\u0442\u0430\u0442\u044c \u0443\u0437\u043a\u0438\u043c \u043c\u0435\u0441\u0442\u043e\u043c. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041d\u0435\u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 <\/strong><code><strong>setState<\/strong><\/code><strong> \u0432 \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u0445:<\/strong> \u0415\u0441\u043b\u0438 \u0432\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0435 <code>AnimationController.addListener<\/code> \u0438 \u0432\u043d\u0443\u0442\u0440\u0438 \u043d\u0435\u0433\u043e \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0435 <code>setState(() {})<\/code> \u0431\u0435\u0437 \u043a\u0430\u043a\u043e\u0439-\u043b\u0438\u0431\u043e \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0431\u0435\u0437 <code>AnimatedBuilder<\/code> \u0438\u043b\u0438 <code>RepaintBoundary<\/code>), \u044d\u0442\u043e \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u0442 \u043a \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0439\u043a\u0435 \u0432\u0441\u0435\u0433\u043e <code>StatefulWidget<\/code>, \u0447\u0442\u043e \u0447\u0430\u0441\u0442\u043e \u0438\u0437\u0431\u044b\u0442\u043e\u0447\u043d\u043e. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0428\u0435\u0439\u0434\u0435\u0440\u043d\u0430\u044f \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0446\u0438\u044f (Shader Compilation Jank):<\/strong> \u0418\u043d\u043e\u0433\u0434\u0430 \u043f\u0435\u0440\u0432\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f (\u0438\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441 \u043d\u043e\u0432\u044b\u043c \u0442\u0438\u043f\u043e\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u0430) \u043c\u043e\u0436\u0435\u0442 &#171;\u0434\u0435\u0440\u043d\u0443\u0442\u044c\u0441\u044f&#187; \u043f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u043c \u0437\u0430\u043f\u0443\u0441\u043a\u0435. \u042d\u0442\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u0442\u0435\u043c, \u0447\u0442\u043e \u0434\u0432\u0438\u0436\u043a\u0443 \u043d\u0443\u0436\u043d\u043e \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0446\u0438\u044e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b\u0445 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432. \u042d\u0442\u0430 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430 \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u0430 \u0434\u043b\u044f \u0441\u0442\u0430\u0440\u043e\u0433\u043e \u0440\u0435\u043d\u0434\u0435\u0440\u0435\u0440\u0430 Skia; \u043d\u043e\u0432\u044b\u0439 \u0440\u0435\u043d\u0434\u0435\u0440\u0435\u0440 Impeller \u043f\u0440\u0438\u0437\u0432\u0430\u043d \u0435\u0435 \u0440\u0435\u0448\u0438\u0442\u044c. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0431\u043e\u043b\u044c\u0448\u043e\u0433\u043e \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439:<\/strong> \u0414\u0430\u0436\u0435 \u043f\u0440\u043e\u0441\u0442\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0435\u0441\u043b\u0438 \u0438\u0445 \u043e\u0447\u0435\u043d\u044c \u043c\u043d\u043e\u0433\u043e \u0438 \u043e\u043d\u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e, \u043c\u043e\u0433\u0443\u0442 \u043f\u0435\u0440\u0435\u0433\u0440\u0443\u0437\u0438\u0442\u044c \u0441\u0438\u0441\u0442\u0435\u043c\u0443. \u00a0 \u00a0 <\/p>\n<\/li>\n<\/ul>\n<h4>4.2. Flutter DevTools \u043d\u0430 \u0441\u0442\u0440\u0430\u0436\u0435 FPS: \u041f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u0443\u0435\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.<\/h4>\n<p>\u041b\u0443\u0447\u0448\u0438\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0431\u043e\u0440\u044c\u0431\u044b \u0441 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u2014 \u044d\u0442\u043e \u0438\u0445 \u0438\u0437\u043c\u0435\u0440\u0435\u043d\u0438\u0435 \u0438 \u0430\u043d\u0430\u043b\u0438\u0437. Flutter DevTools \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u043c\u043e\u0449\u043d\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e:<\/p>\n<ul>\n<li>\n<p><strong>\u041f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0432 <\/strong><code><strong>profile mode<\/strong><\/code><strong>:<\/strong> <strong>\u041a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u043e!<\/strong> \u041d\u0438\u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0441\u0443\u0434\u0438\u0442\u0435 \u043e \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u044f \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432 <code>debug mode<\/code>. \u041e\u0442\u043b\u0430\u0434\u043e\u0447\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u0432\u043a\u043b\u044e\u0447\u0430\u0435\u0442 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u043e\u043a \u0438 \u0430\u0441\u0441\u0435\u0440\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0441\u0438\u043b\u044c\u043d\u043e \u0437\u0430\u043c\u0435\u0434\u043b\u044f\u044e\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435. \u0412\u0441\u0435\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>flutter run --profile<\/code> \u0434\u043b\u044f \u043e\u0446\u0435\u043d\u043a\u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u043a\u043b\u0430\u0434\u043a\u0430 &#171;Performance&#187; (\u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c):<\/strong> \u0417\u0434\u0435\u0441\u044c \u043c\u043e\u0436\u043d\u043e \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e \u0438\u0437\u0443\u0447\u0438\u0442\u044c \u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d\u044b \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0434\u043b\u044f UI-\u043f\u043e\u0442\u043e\u043a\u0430 (Dart) \u0438 GPU-\u043f\u043e\u0442\u043e\u043a\u0430 (\u0440\u0430\u0441\u0442\u0435\u0440\u0438\u0437\u0430\u0446\u0438\u044f). \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c \u0441\u0435\u0441\u0441\u0438\u0438 \u0438 \u0430\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u043a\u0430\u0434\u0440, \u0432\u044b\u044f\u0432\u043b\u044f\u044f &#171;\u0434\u043e\u0440\u043e\u0433\u0438\u0435&#187; \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>&#171;Performance Overlay&#187; (\u041d\u0430\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438):<\/strong> \u0412\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 DevTools \u0438\u043b\u0438 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e. \u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 \u0434\u0432\u0430 \u0433\u0440\u0430\u0444\u0438\u043a\u0430 \u043f\u0440\u044f\u043c\u043e \u043f\u043e\u0432\u0435\u0440\u0445 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044f \u0432\u0440\u0435\u043c\u044f \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043d\u0433\u0430 \u0434\u043b\u044f UI-\u043f\u043e\u0442\u043e\u043a\u0430 \u0438 GPU-\u043f\u043e\u0442\u043e\u043a\u0430 \u0432 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u041f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043f\u0440\u043e\u0441\u0430\u0434\u043a\u0438 FPS. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>&#171;Track Widget Rebuilds&#187; (\u041e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0435\u043a \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432):<\/strong> \u042d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432 DevTools (\u0440\u0430\u043d\u0435\u0435 &#171;Show performance data&#187; \u0438\u043b\u0438 &#171;Highlight Rerenders&#187; \u0432 IDE) \u043f\u043e\u0434\u0441\u0432\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u0432\u0438\u0434\u0436\u0435\u0442\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e\u0442\u0441\u044f. \u041f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c, \u043d\u0435 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043b\u0438 \u043b\u0438\u0448\u043d\u0435\u0435. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044f \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043e\u043a:<\/strong><\/p>\n<ul>\n<li>\n<p><code>debugProfilePaintsEnabled = true;<\/code> (\u0432 \u043a\u043e\u0434\u0435, \u043e\u0431\u044b\u0447\u043d\u043e \u0432 <code>main()<\/code>): \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0441\u043b\u043e\u044f \u0432 \u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d DevTools.<\/p>\n<\/li>\n<li>\n<p><code>debugRepaintRainbowEnabled = true;<\/code>: \u041e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u0442 \u0441\u043b\u043e\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u044b\u043b\u0438 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u0430\u043d\u044b \u0432 \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u043c \u043a\u0430\u0434\u0440\u0435, \u0432 \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b\u0435 \u0446\u0432\u0435\u0442\u0430. \u041f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e \u043e\u0442\u0441\u043b\u0435\u0434\u0438\u0442\u044c \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u044c <code>RepaintBoundary<\/code>. \u00a0  \u00a0 <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h4>4.3. RepaintBoundary: \u0418\u0437\u043e\u043b\u0438\u0440\u0443\u0439 \u0438 \u0432\u043b\u0430\u0441\u0442\u0432\u0443\u0439 \u043d\u0430\u0434 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0430\u043c\u0438<\/h4>\n<p>\u041e\u0434\u0438\u043d \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u043c\u043e\u0449\u043d\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438 \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u043d\u0433\u0430 \u0432\u043e Flutter, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0432 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u2014 \u044d\u0442\u043e \u0432\u0438\u0434\u0436\u0435\u0442 <code>RepaintBoundary<\/code>.<\/p>\n<ul>\n<li>\n<p><strong>\u0427\u0442\u043e \u044d\u0442\u043e:<\/strong> <code>RepaintBoundary<\/code> \u2014 \u044d\u0442\u043e \u0432\u0438\u0434\u0436\u0435\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0434\u043b\u044f \u0441\u0432\u043e\u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0439 \u0441\u043b\u043e\u0439 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f (display list \u0438\u043b\u0438 picture layer). \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0431\u0443\u0434\u0435\u0442 \u0440\u0438\u0441\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u0441\u0432\u043e\u0435\u043c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u043c &#171;\u0445\u043e\u043b\u0441\u0442\u0435&#187;. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0417\u0430\u0447\u0435\u043c \u044d\u0442\u043e \u043d\u0443\u0436\u043d\u043e (\u043a\u043e\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c):<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u0418\u0437\u043e\u043b\u044f\u0446\u0438\u044f \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043e\u043a:<\/strong> \u0415\u0441\u043b\u0438 \u0447\u0430\u0441\u0442\u044c \u0432\u0430\u0448\u0435\u0433\u043e UI (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0444\u043e\u043d \u0438\u043b\u0438 \u043d\u0435\u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u043f\u0430\u043d\u0435\u043b\u044c) \u043d\u0435 \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0438\u043b\u0438 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0434\u0440\u0443\u0433\u0430\u044f, \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u0430\u044f \u0447\u0430\u0441\u0442\u044c UI, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0443\u044e \u0438\u043b\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0443\u044e \u0447\u0430\u0441\u0442\u044c \u0432 <code>RepaintBoundary<\/code>. \u042d\u0442\u043e \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0442\u0438\u0442 &#171;\u0440\u0430\u0441\u043f\u043e\u043b\u0437\u0430\u043d\u0438\u0435&#187; \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u043d\u0430 \u0441\u043e\u0441\u0435\u0434\u043d\u0438\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438. \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441  \u00a0 <\/p>\n<p><code>CircularProgressIndicator<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0435\u0437 <code>RepaintBoundary<\/code> \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u0432\u0441\u0435\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430.<\/p>\n<\/li>\n<li>\n<p><strong>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438:<\/strong> \u0415\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0432 \u043e\u0434\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u044d\u043a\u0440\u0430\u043d\u0430, \u0430 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u044d\u043a\u0440\u0430\u043d\u0430 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u0430, \u043e\u0431\u0435\u0440\u0442\u044b\u0432\u0430\u043d\u0438\u0435 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u0432 <code>RepaintBoundary<\/code> \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0442\u0438\u0442\u044c \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439. \u0418 \u043d\u0430\u043e\u0431\u043e\u0440\u043e\u0442, \u0435\u0441\u043b\u0438 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u0430\u044f \u0447\u0430\u0441\u0442\u044c \u0441\u043b\u043e\u0436\u043d\u0430 \u0434\u043b\u044f \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438, \u0430 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u043f\u0440\u043e\u0441\u0442\u0430, \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u0443\u044e.<\/p>\n<\/li>\n<li>\n<p><strong>\u0421\u043a\u0440\u043e\u043b\u043b\u044f\u0449\u0438\u0435\u0441\u044f \u0441\u043f\u0438\u0441\u043a\u0438:<\/strong> \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432 \u0441\u043a\u0440\u043e\u043b\u043b\u044f\u0449\u0438\u0445\u0441\u044f \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430\u0445 (<code>ListView<\/code>, <code>GridView<\/code> \u0438 \u0442.\u0434.) \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0432 <code>RepaintBoundary<\/code> (\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e <code>addRepaintBoundaries<\/code> \u0443 <code>SliverChildBuilderDelegate<\/code> \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e <code>true<\/code> ). \u042d\u0442\u043e \u0434\u0435\u043b\u0430\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435 \u043d\u0435 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u043b\u0438\u0441\u044c \u0432\u0441\u0435 \u0432\u0438\u0434\u0438\u043c\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0430 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0438\u0441\u044c, \u0438\u043b\u0438 \u0447\u0442\u043e\u0431\u044b \u043c\u043e\u0436\u043d\u043e \u0431\u044b\u043b\u043e \u043f\u0435\u0440\u0435\u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0441\u043b\u043e\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u043e\u0441\u0442\u044b \u0434\u043b\u044f \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043f\u043b\u043e\u0448\u043d\u044b\u0435 \u0446\u0432\u0435\u0442\u043d\u044b\u0435 \u0431\u043b\u043e\u043a\u0438), \u043e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435  \u00a0 <\/p>\n<p><code>addRepaintBoundaries<\/code> \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0434\u0430\u0436\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u0435\u0435. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0434\u0432\u0438\u0436\u043a\u043e\u043c:<\/strong> <code>RepaintBoundary<\/code> \u043c\u043e\u0436\u0435\u0442 \u0434\u0430\u0442\u044c \u0434\u0432\u0438\u0436\u043a\u0443 Flutter \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u043a\u0443, \u0447\u0442\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0437\u0430 \u043d\u0438\u043c \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u0441\u043b\u043e\u0436\u043d\u043e\u0435 \u0438 \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u043e\u0435 (\u0438\u043b\u0438 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043d\u0435\u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e). \u0412 \u0442\u0430\u043a\u0438\u0445 \u0441\u043b\u0443\u0447\u0430\u044f\u0445 \u0434\u0432\u0438\u0436\u043e\u043a \u043c\u043e\u0436\u0435\u0442 \u0440\u0435\u0448\u0438\u0442\u044c \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0441\u0442\u0435\u0440\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0433\u043e \u0441\u043b\u043e\u044f, \u0447\u0442\u043e \u0443\u0441\u043a\u043e\u0440\u0438\u0442 \u0435\u0433\u043e \u043f\u043e\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0435 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 (\u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0435\u0441\u043b\u0438 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0435\u0433\u043e \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u0438\u043b\u0438 \u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f). \u00a0 <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u041a\u0430\u043a \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442:<\/strong> <code>RepaintBoundary<\/code> \u0441\u043e\u0437\u0434\u0430\u0435\u0442 <code>RenderObject<\/code> (\u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e <code>RenderRepaintBoundary<\/code>), \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u0441\u0435\u0433\u0434\u0430 \u0438\u043c\u0435\u0435\u0442 \u0441\u0432\u043e\u0439 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 <code>Layer<\/code>. \u041a\u043e\u0433\u0434\u0430 \u043a\u0430\u043a\u043e\u0439-\u043b\u0438\u0431\u043e  \u00a0 <\/p>\n<p><code>RenderObject<\/code> \u043f\u043e\u043c\u0435\u0447\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u043a &#171;\u0433\u0440\u044f\u0437\u043d\u044b\u0439&#187; (\u0442\u0440\u0435\u0431\u0443\u044e\u0449\u0438\u0439 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438), \u0437\u0430\u043f\u0440\u043e\u0441 \u043d\u0430 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u044f\u0435\u0442\u0441\u044f \u0432\u0432\u0435\u0440\u0445 \u043f\u043e \u0434\u0435\u0440\u0435\u0432\u0443 \u0434\u043e \u0431\u043b\u0438\u0436\u0430\u0439\u0448\u0435\u0433\u043e \u043f\u0440\u0435\u0434\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f <code>RepaintBoundary<\/code> (\u0438\u043b\u0438 \u0434\u043e \u043a\u043e\u0440\u043d\u044f). \u0417\u0430\u0442\u0435\u043c \u044d\u0442\u043e\u0442 <code>RepaintBoundary<\/code> \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0435\u0442 \u0441\u0435\u0431\u044f \u0438 \u0432\u0441\u0435\u0445 \u0441\u0432\u043e\u0438\u0445 \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432 \u0432 \u0441\u0432\u043e\u0435\u043c \u0441\u043b\u043e\u0435. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0430 &#171;\u043b\u043e\u043a\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0441\u044f&#187; \u0432\u043d\u0443\u0442\u0440\u0438 \u0433\u0440\u0430\u043d\u0438\u0446 \u044d\u0442\u043e\u0433\u043e \u0441\u043b\u043e\u044f. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0437\u0430\u0442\u0440\u0430\u0442\u044b:<\/strong> \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043d\u043e\u0432\u043e\u0433\u043e \u0441\u043b\u043e\u044f \u2014 \u044d\u0442\u043e \u043d\u0435 \u0431\u0435\u0441\u043f\u043b\u0430\u0442\u043d\u0430\u044f \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u044f. \u041e\u043d\u0430 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0439 \u043f\u0430\u043c\u044f\u0442\u0438 \u0438 \u043c\u043e\u0436\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043d\u0435\u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u043d\u0430\u043a\u043b\u0430\u0434\u043d\u044b\u0435 \u0440\u0430\u0441\u0445\u043e\u0434\u044b \u043d\u0430 \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0441\u043b\u043e\u0435\u0432. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043d\u0435 \u0441\u0442\u043e\u0438\u0442 \u0431\u0435\u0437\u0434\u0443\u043c\u043d\u043e \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0442\u044c \u043a\u0430\u0436\u0434\u044b\u0439 \u0432\u0438\u0434\u0436\u0435\u0442 \u0432 <code>RepaintBoundary<\/code>. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0435\u0433\u043e \u043e\u0441\u043e\u0437\u043d\u0430\u043d\u043d\u043e, \u0442\u0430\u043c, \u0433\u0434\u0435 \u044d\u0442\u043e \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u0438 \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u0443\u0439\u0442\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0440\u044b \u043a\u043e\u0434\u0430 \u0438 \u043e\u0442\u043b\u0430\u0434\u043a\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>debugRepaintRainbowEnabled = true;<\/code> \u0447\u0442\u043e\u0431\u044b \u0443\u0432\u0438\u0434\u0435\u0442\u044c \u0433\u0440\u0430\u043d\u0438\u0446\u044b <code>RepaintBoundary<\/code> \u0438 \u043a\u0430\u043a\u0438\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u044e\u0442\u0441\u044f. \u0415\u0441\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f <code>RepaintBoundary<\/code> \u0432\u043e\u043a\u0440\u0443\u0433 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u0441\u043e\u0441\u0435\u0434\u043d\u0438\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0435\u0440\u0435\u0441\u0442\u0430\u043b\u0438 \u043c\u0435\u043d\u044f\u0442\u044c \u0446\u0432\u0435\u0442 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u043a\u0430\u0434\u0440\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0437\u043d\u0430\u0447\u0438\u0442, \u043e\u043d \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u043a\u0430\u043a \u043d\u0430\u0434\u043e. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u0412 \u0432\u0438\u0434\u0435\u043e  \u0438  \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u043a\u0430\u043a  \u00a0 <\/p>\n<p><code>RepaintBoundary<\/code> \u043f\u0440\u0435\u0434\u043e\u0442\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0443 \u0444\u043e\u043d\u0430 \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<\/ul>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u043e\u0441\u0442\u043e\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \/\/ Stack( \/\/   children: &lt;Widget&gt;, \/\/ )  \/\/ \u0418\u043b\u0438, \u0435\u0441\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0441\u0442\u0430\u044f, \u0430 \u0444\u043e\u043d \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u0438 \u043f\u043e\u0434\u0432\u0435\u0440\u0436\u0435\u043d \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f\u043c \u043e\u0442 \u0434\u0440\u0443\u0433\u0438\u0445 \u0447\u0430\u0441\u0442\u0435\u0439 UI \/\/ Stack( \/\/   children: &lt;Widget&gt;, \/\/ ) <\/code><\/pre>\n<p>\u0412 <code>RenderRepaintBoundary<\/code> \u0443\u043f\u043e\u043c\u0438\u043d\u0430\u0435\u0442 <code>debugAsymmetricPaintCount<\/code> \u0438 <code>debugSymmetricPaintCount<\/code> \u0434\u043b\u044f \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e\u0439 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0438 \u043f\u043e\u043b\u0435\u0437\u043d\u043e\u0441\u0442\u0438 <code>RepaintBoundary<\/code>.<\/p>\n<\/li>\n<\/ul>\n<h4>4.4. \u0414\u0440\u0443\u0433\u0438\u0435 \u0437\u043e\u043b\u043e\u0442\u044b\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u0430 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438:<\/h4>\n<p>\u041f\u043e\u043c\u0438\u043c\u043e <code>RepaintBoundary<\/code> \u0438 \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f, \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0440\u044f\u0434 \u043e\u0431\u0449\u0438\u0445 \u043f\u0440\u0430\u043a\u0442\u0438\u043a, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u043e\u043c\u043e\u0433\u0443\u0442 \u0432\u0430\u0448\u0438\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c (\u0438 \u0432\u0441\u0435\u043c\u0443 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044e) \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0431\u044b\u0441\u0442\u0440\u0435\u0435:<\/p>\n<ul>\n<li>\n<p><strong>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 <\/strong><code><strong>const<\/strong><\/code><strong> \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440\u043e\u0432:<\/strong> \u0414\u043b\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u0438 \u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0438\u0437\u043c\u0435\u043d\u044f\u044e\u0442\u0441\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f, \u0432\u0441\u0435\u0433\u0434\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>const<\/code>. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 Flutter \u043f\u0440\u043e\u043f\u0443\u0441\u043a\u0430\u0442\u044c \u0438\u0445 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0439\u043a\u0443 \u0438 \u0434\u0430\u0436\u0435 \u043a\u044d\u0448\u0438\u0440\u043e\u0432\u0430\u0442\u044c. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0439 \u0432\u044b\u0431\u043e\u0440 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432:<\/strong><\/p>\n<ul>\n<li>\n<p><code>ListView.builder<\/code>, <code>GridView.builder<\/code>, <code>CustomScrollView<\/code> \u0441 slivers \u0434\u043b\u044f \u0434\u043b\u0438\u043d\u043d\u044b\u0445 \u0438\u043b\u0438 \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u044b\u0445 \u0441\u043f\u0438\u0441\u043a\u043e\u0432 \u0432\u043c\u0435\u0441\u0442\u043e <code>Column<\/code>\/<code>Row<\/code> \u0432 <code>SingleChildScrollView<\/code>. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0435\u0434\u043f\u043e\u0447\u0438\u0442\u0430\u0439\u0442\u0435 <code>StatelessWidget<\/code> \u0442\u0430\u043c, \u0433\u0434\u0435 \u044d\u0442\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>StatefulWidget<\/code> \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u0432\u0438\u0434\u0436\u0435\u0442 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u043c\u0435\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u043c\u043e\u0435 \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u041c\u0438\u043d\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u0433\u043b\u0443\u0431\u0438\u043d\u044b \u0434\u0435\u0440\u0435\u0432\u0430 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432:<\/strong> \u0421\u043b\u0438\u0448\u043a\u043e\u043c \u0433\u043b\u0443\u0431\u043e\u043a\u043e \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u044b \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u043c\u043e\u0433\u0443\u0442 \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0442\u044c \u0432\u0440\u0435\u043c\u044f \u043d\u0430 \u043f\u043e\u0441\u0442\u0440\u043e\u0435\u043d\u0438\u0435 \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u043e\u0432\u043a\u0443 \u043a\u0430\u0434\u0440\u0430. \u0421\u0442\u0430\u0440\u0430\u0439\u0442\u0435\u0441\u044c \u0434\u0435\u043b\u0430\u0442\u044c \u0441\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0443 \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0431\u043e\u043b\u0435\u0435 &#171;\u043f\u043b\u043e\u0441\u043a\u043e\u0439&#187;. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0410\u043f\u043f\u0430\u0440\u0430\u0442\u043d\u043e\u0435 \u0443\u0441\u043a\u043e\u0440\u0435\u043d\u0438\u0435 (Hardware Acceleration):<\/strong><\/p>\n<ul>\n<li>\n<p>\u0414\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0442\u0440\u0430\u043d\u0441\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0439 (\u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0435\u043d\u0438\u0435, \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435, \u0432\u0440\u0430\u0449\u0435\u043d\u0438\u0435) \u0447\u0430\u0441\u0442\u043e \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0438\u0434\u0436\u0435\u0442 <code>Transform<\/code> \u0438\u043b\u0438 \u0435\u0433\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0435 \u0430\u043d\u0430\u043b\u043e\u0433\u0438 (<code>ScaleTransition<\/code>, <code>RotationTransition<\/code>, <code>SlideTransition<\/code>), \u0442\u0430\u043a \u043a\u0430\u043a \u043e\u043d\u0438 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u044b \u043d\u0430 \u0443\u0440\u043e\u0432\u043d\u0435 \u043a\u043e\u043c\u043f\u043e\u0437\u0438\u0442\u043e\u0440\u0430 \u0438 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0442\u044c\u0441\u044f \u043d\u0430 GPU. \u00a0 <\/p>\n<\/li>\n<li>\n<p><code>AnimatedOpacity<\/code> (\u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 <code>FadeTransition<\/code>) \u043e\u0431\u044b\u0447\u043d\u043e \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u0435\u0435 \u0440\u0443\u0447\u043d\u044b\u0445 \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0439 \u0430\u043b\u044c\u0444\u0430-\u043a\u0430\u043d\u0430\u043b\u0430, \u0442\u0430\u043a \u043a\u0430\u043a <code>FadeTransition<\/code> \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u041e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439:<\/strong> \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>FadeInImage<\/code> \u0434\u043b\u044f \u043f\u043b\u0430\u0432\u043d\u043e\u0439 \u0437\u0430\u0433\u0440\u0443\u0437\u043a\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439 \u0441 \u043f\u043b\u0435\u0439\u0441\u0445\u043e\u043b\u0434\u0435\u0440\u043e\u043c, \u0437\u0430\u0433\u0440\u0443\u0436\u0430\u0439\u0442\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 (\u043d\u0435 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0431\u043e\u043b\u044c\u0448\u0438\u0435), \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 \u0444\u043e\u0440\u043c\u0430\u0442\u044b \u0441 \u0445\u043e\u0440\u043e\u0448\u0438\u043c \u0441\u0436\u0430\u0442\u0438\u0435\u043c (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, WebP). \u00a0 <\/p>\n<\/li>\n<li>\n<p><code><strong>AnimatedBuilder<\/strong><\/code><strong> \u0441 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c <\/strong><code><strong>child<\/strong><\/code><strong>:<\/strong> \u041a\u0430\u043a \u0443\u0436\u0435 \u043e\u0431\u0441\u0443\u0436\u0434\u0430\u043b\u043e\u0441\u044c, \u044d\u0442\u043e \u043a\u043b\u044e\u0447\u0435\u0432\u043e\u0439 \u043f\u0430\u0442\u0442\u0435\u0440\u043d \u0434\u043b\u044f \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438 \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0442\u0430\u043a \u043a\u0430\u043a \u043e\u043d \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0443 \u0447\u0430\u0441\u0442\u044c \u0434\u0435\u0440\u0435\u0432\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0437\u0430\u0432\u0438\u0441\u0438\u0442 \u043e\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0420\u0435\u043d\u0434\u0435\u0440\u0435\u0440 Impeller:<\/strong> \u0423\u0431\u0435\u0434\u0438\u0442\u0435\u0441\u044c, \u0447\u0442\u043e \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u043e\u0435\u043a\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0440\u0435\u043d\u0434\u0435\u0440\u0435\u0440 Impeller (\u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043d\u0430 iOS, \u043f\u043e\u0441\u0442\u0435\u043f\u0435\u043d\u043d\u043e \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043e\u043c \u0438 \u043d\u0430 Android). \u041e\u043d \u0431\u044b\u043b \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0430\u043d \u0434\u043b\u044f \u0440\u0435\u0448\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e, \u0432 \u0447\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438, \u0434\u043b\u044f \u0443\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u044f &#171;\u0434\u0435\u0440\u0433\u0430\u043d\u0438\u0439&#187; \u043f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u0439 \u043a\u043e\u043c\u043f\u0438\u043b\u044f\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432. \u041f\u0430\u043a\u0435\u0442 Rive \u0442\u0430\u043a\u0436\u0435 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442 Impeller. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0423\u043f\u0440\u043e\u0449\u0435\u043d\u0438\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439:<\/strong> \u0418\u043d\u043e\u0433\u0434\u0430 \u043b\u0443\u0447\u0448\u0430\u044f \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u2014 \u044d\u0442\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043f\u0440\u043e\u0449\u0435. \u0415\u0441\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0441\u043b\u043e\u0436\u043d\u0430 \u0438 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e, \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0435\u0435 \u0443\u043f\u0440\u043e\u0449\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0440\u0430\u0437\u0431\u0438\u0435\u043d\u0438\u044f \u043d\u0430 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0422\u0435\u0441\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u043d\u0430 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445:<\/strong> \u0412\u0441\u0435\u0433\u0434\u0430 \u0442\u0435\u0441\u0442\u0438\u0440\u0443\u0439\u0442\u0435 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u043d\u0430 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043d\u0430 \u043c\u0435\u043d\u0435\u0435 \u043c\u043e\u0449\u043d\u044b\u0445 \u043c\u043e\u0434\u0435\u043b\u044f\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0443 \u0432\u0430\u0448\u0438\u0445 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439. \u00a0 <\/p>\n<\/li>\n<li>\n<p><code><strong>timeDilation<\/strong><\/code><strong>:<\/strong> \u0412\u043e \u0432\u0440\u0435\u043c\u044f \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0439\u0442\u0435 <code>timeDilation<\/code> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>timeDilation = 5.0;<\/code>) \u0447\u0442\u043e\u0431\u044b \u0437\u0430\u043c\u0435\u0434\u043b\u0438\u0442\u044c \u0432\u0441\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u042d\u0442\u043e \u043f\u043e\u043c\u043e\u0433\u0430\u0435\u0442 \u043b\u0435\u0433\u0447\u0435 \u0437\u0430\u043c\u0435\u0442\u0438\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b \u0441 \u043f\u043b\u0430\u0432\u043d\u043e\u0441\u0442\u044c\u044e \u0438\u043b\u0438 \u043b\u043e\u0433\u0438\u043a\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<p>\u041e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u2014 \u044d\u0442\u043e \u0432\u0441\u0435\u0433\u0434\u0430 \u043f\u043e\u0438\u0441\u043a \u0431\u0430\u043b\u0430\u043d\u0441\u0430 \u043c\u0435\u0436\u0434\u0443 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e, \u043a\u0440\u0430\u0441\u043e\u0442\u043e\u0439 \u0438 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e. \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438 \u0441\u0442\u0440\u0435\u043c\u044f\u0442\u0441\u044f \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0432\u043f\u0435\u0447\u0430\u0442\u043b\u044f\u044e\u0449\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 , \u043d\u043e \u043a\u0430\u0436\u0434\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0438\u043c\u0435\u0435\u0442 \u0441\u0432\u043e\u044e &#171;\u0446\u0435\u043d\u0443&#187; \u0432 \u0442\u0435\u0440\u043c\u0438\u043d\u0430\u0445 \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0432 CPU \u0438 GPU. \u0418\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u044b \u0432\u0440\u043e\u0434\u0435 <code>RepaintBoundary<\/code>  \u0438 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438  \u043f\u043e\u043c\u043e\u0433\u0430\u044e\u0442 \u0441\u043d\u0438\u0437\u0438\u0442\u044c \u044d\u0442\u0443 \u0446\u0435\u043d\u0443. \u041e\u0434\u043d\u0430\u043a\u043e, \u0438\u043d\u043e\u0433\u0434\u0430 \u0441\u0430\u043c\u0430\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u0430\u044f \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u2014 \u044d\u0442\u043e \u0443\u043f\u0440\u043e\u0449\u0435\u043d\u0438\u0435 \u0441\u0430\u043c\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0438\u043b\u0438 \u0434\u0430\u0436\u0435 \u043e\u0442\u043a\u0430\u0437 \u043e\u0442 \u043d\u0435\u0435 \u0432 \u043f\u043e\u043b\u044c\u0437\u0443 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e, \u043d\u043e \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0440\u0435\u0448\u0435\u043d\u0438\u044f, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0435\u0441\u043b\u0438 \u0446\u0435\u043b\u0435\u0432\u0430\u044f \u0430\u0443\u0434\u0438\u0442\u043e\u0440\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u043d\u0435 \u0441\u0430\u043c\u044b\u0435 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430. \u041f\u043e\u044d\u0442\u043e\u043c\u0443 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u2014 \u044d\u0442\u043e \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435\u0445\u043d\u0438\u0447\u0435\u0441\u043a\u0430\u044f, \u043d\u043e \u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0441\u043a\u0430\u044f \u0437\u0430\u0434\u0430\u0447\u0430. \u041d\u0443\u0436\u043d\u043e \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0441\u0435\u0431\u0435 \u0432\u043e\u043f\u0440\u043e\u0441: &#171;\u0414\u0435\u0439\u0441\u0442\u0432\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u043b\u0438 \u044d\u0442\u0430 \u0441\u043b\u043e\u0436\u043d\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0446\u0435\u043d\u043d\u043e\u0441\u0442\u044c, \u0441\u043e\u0438\u0437\u043c\u0435\u0440\u0438\u043c\u0443\u044e \u0441 \u0435\u0435 \u043f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u0437\u0430\u0442\u0440\u0430\u0442\u0430\u043c\u0438 \u043d\u0430 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c?&#187; \u0418\u043d\u043e\u0433\u0434\u0430 &#171;\u043c\u0435\u043d\u044c\u0448\u0435 \u0437\u043d\u0430\u0447\u0438\u0442 \u0431\u043e\u043b\u044c\u0448\u0435&#187;. \u041c\u043e\u0436\u043d\u043e, \u043a\u043e\u043d\u0435\u0447\u043d\u043e, \u0437\u0430\u0431\u0430\u0431\u0430\u0445\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e, \u0433\u0434\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u0438\u043a\u0441\u0435\u043b\u044c \u043b\u0435\u0442\u0430\u0435\u0442 \u043f\u043e \u0441\u0432\u043e\u0435\u0439 \u0441\u0438\u043d\u0443\u0441\u043e\u0438\u0434\u0435 \u043f\u043e\u0434 \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0433\u043e  \u00a0 <\/p>\n<p><code>AnimationController<\/code> \u0441 \u0444\u0438\u0437\u0438\u043a\u043e\u0439&#8230; \u043d\u043e \u0437\u0430\u0447\u0435\u043c, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u0443\u0431\u044c\u0435\u0442 \u0431\u0430\u0442\u0430\u0440\u0435\u0439\u043a\u0443 \u0438 \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u0442 \u0442\u0435\u043b\u0435\u0444\u043e\u043d \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0432 \u043f\u0435\u0447\u043a\u0443? \u0418\u043d\u043e\u0433\u0434\u0430 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 <code>FadeIn<\/code> \u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0441\u044f \u044d\u043b\u0435\u0433\u0430\u043d\u0442\u043d\u0435\u0435 \u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u0435\u0435. \u0418\u0449\u0438\u0442\u0435 \u0437\u043e\u043b\u043e\u0442\u0443\u044e \u0441\u0435\u0440\u0435\u0434\u0438\u043d\u0443, \u043a\u043e\u043b\u043b\u0435\u0433\u0438!<\/p>\n<h3>\u0413\u043b\u0430\u0432\u0430 5: \u0418\u0437 \u041e\u043a\u043e\u043f\u043e\u0432 \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u2013 \u041f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u041a\u0435\u0439\u0441\u044b (\u0418\u044e\u043d\u044c 2025)<\/h3>\n<p>\u0422\u0435\u043e\u0440\u0438\u044f \u2014 \u044d\u0442\u043e, \u043a\u043e\u043d\u0435\u0447\u043d\u043e, \u0445\u043e\u0440\u043e\u0448\u043e, \u043d\u043e \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043f\u043e\u0441\u043c\u043e\u0442\u0440\u0438\u043c, \u043a\u0430\u043a \u0432\u0441\u0435 \u044d\u0442\u0438 \u0437\u043d\u0430\u043d\u0438\u044f \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0435. \u0412 \u044d\u0442\u043e\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043d\u0435\u0442\u0440\u0438\u0432\u0438\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u0438\u043c\u0435\u0440\u043e\u0432 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0432\u0441\u0442\u0440\u0435\u0442\u0438\u0442\u044c\u0441\u044f \u0432 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445. \u042f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u0441\u0432\u0435\u0436\u0435\u0435 \u0438 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0435, \u0447\u0442\u043e, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0431\u0443\u0434\u0435\u0442 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e \u0438 \u0432 2025 \u0433\u043e\u0434\u0443. \u042d\u0442\u0438 \u043a\u0435\u0439\u0441\u044b \u043f\u043e\u043c\u043e\u0433\u0443\u0442 \u0443\u0432\u0438\u0434\u0435\u0442\u044c, \u043a\u0430\u043a \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u043a\u043e\u043c\u0431\u0438\u043d\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0434\u043e\u0441\u0442\u0438\u0436\u0435\u043d\u0438\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432.<\/p>\n<h4>5.1. \u041a\u0435\u0439\u0441 1: \u041a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 AppBar \u0441 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u043c &#171;Frosted Glass&#187; \u0438 \u0432\u044b\u0434\u0432\u0438\u0433\u0430\u044e\u0449\u0438\u043c\u0438\u0441\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438 \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435.<\/h4>\n<ul>\n<li>\n<p><strong>\u0417\u0430\u0434\u0430\u0447\u0430:<\/strong> \u0421\u043e\u0437\u0434\u0430\u0442\u044c AppBar, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u043f\u043e\u0434 \u043d\u0438\u043c \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043f\u043e\u043b\u0443\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c \u0441 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u043c \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u044f \u0444\u043e\u043d\u0430 (&#171;frosted glass&#187; \u0438\u043b\u0438 &#171;glassmorphism&#187;). \u0414\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e, \u043f\u0440\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u043c \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0430, \u0438\u0437-\u043f\u043e\u0434 \u044d\u0442\u043e\u0433\u043e AppBar&#8217;\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u043b\u0430\u0432\u043d\u043e \u0432\u044b\u0434\u0432\u0438\u0433\u0430\u0442\u044c\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u043f\u0430\u043d\u0435\u043b\u044c (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441 \u0434\u0430\u0442\u0430\u043c\u0438, \u0444\u0438\u043b\u044c\u0442\u0440\u0430\u043c\u0438 \u0438\u043b\u0438 \u0431\u044b\u0441\u0442\u0440\u044b\u043c\u0438 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f\u043c\u0438).<\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b:<\/strong><\/p>\n<ul>\n<li>\n<p><code>Stack<\/code>: \u0414\u043b\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u043e\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f AppBar&#8217;\u0430 \u0438 \u0432\u044b\u0434\u0432\u0438\u0433\u0430\u044e\u0449\u0435\u0439\u0441\u044f \u043f\u0430\u043d\u0435\u043b\u0438 \u043f\u043e\u0432\u0435\u0440\u0445 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p><code>ScrollController<\/code>: \u0414\u043b\u044f \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u043d\u0438\u044f \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u044f \u0441\u043a\u0440\u043e\u043b\u043b\u0430 \u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0432 \u043d\u0443\u0436\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442. \u00a0 <\/p>\n<\/li>\n<li>\n<p><code>BackdropFilter<\/code> \u0441 <code>ImageFilter.blur(sigmaX: Y, sigmaY: Y)<\/code>: \u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 &#171;\u043c\u0430\u0442\u043e\u0432\u043e\u0433\u043e \u0441\u0442\u0435\u043a\u043b\u0430&#187;. \u0412\u0430\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 <code>ClipRect<\/code> \u0434\u043b\u044f \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0438\u044f \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u044f. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439 <code>AppBar<\/code>: \u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 <code>AppBar<\/code> \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u043c (<code>backgroundColor: Colors.transparent<\/code>), \u0447\u0442\u043e\u0431\u044b <code>BackdropFilter<\/code> \u043c\u043e\u0433 \u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c \u0441 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u043e\u043c \u043f\u043e\u0434 \u043d\u0438\u043c.<\/p>\n<\/li>\n<li>\n<p>\u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: <code>AnimationController<\/code> \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439 \u0432\u044b\u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f\/\u0441\u043a\u0440\u044b\u0442\u0438\u044f \u043f\u0430\u043d\u0435\u043b\u0438.<\/p>\n<ul>\n<li>\n<p><code>Tween&lt;Offset&gt;<\/code> \u0438 <code>SlideTransition<\/code>: \u0414\u043b\u044f \u043f\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u0432\u044b\u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f \u043f\u0430\u043d\u0435\u043b\u0438 \u0441\u0432\u0435\u0440\u0445\u0443 \u0432\u043d\u0438\u0437. \u00a0 <\/p>\n<\/li>\n<li>\n<p><code>SizeTransition<\/code>: \u041c\u043e\u0436\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u0430 \u0438\u043b\u0438 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u043a <code>SlideTransition<\/code> \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u044b\u0441\u043e\u0442\u044b \u043f\u0430\u043d\u0435\u043b\u0438, \u0447\u0442\u043e\u0431\u044b \u043e\u043d\u0430 &#171;\u0432\u044b\u0440\u0430\u0441\u0442\u0430\u043b\u0430&#187; \u0438\u043b\u0438 &#171;\u0441\u0445\u043b\u043e\u043f\u044b\u0432\u0430\u043b\u0430\u0441\u044c&#187;. \u0432 \u0438\u0442\u043e\u0433\u0435 \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442 \u043a \u0432\u044b\u0432\u043e\u0434\u0443, \u0447\u0442\u043e  \u00a0 <\/p>\n<p><code>SizeTransition<\/code> \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043b\u0443\u0447\u0448\u0438\u043c \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c \u0434\u043b\u044f \u0438\u0437\u0431\u0435\u0436\u0430\u043d\u0438\u044f \u0440\u0435\u0437\u043a\u043e\u0433\u043e \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f\/\u0438\u0441\u0447\u0435\u0437\u043d\u043e\u0432\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><code>AnimatedOpacity<\/code> \u0438\u043b\u0438 <code>FadeTransition<\/code>: \u0414\u043b\u044f \u043f\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f\/\u0438\u0441\u0447\u0435\u0437\u043d\u043e\u0432\u0435\u043d\u0438\u044f \u0441\u0430\u043c\u043e\u0439 \u043f\u0430\u043d\u0435\u043b\u0438 \u0438\u043b\u0438 \u0435\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e, \u0435\u0441\u043b\u0438 \u044d\u0442\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0420\u0430\u0437\u0431\u043e\u0440 \u043b\u043e\u0433\u0438\u043a\u0438 \u0438 \u043a\u043e\u0434\u0430 (\u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 ): \u00a0 <\/p>\n<ol>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0435\u043c <code>StatefulWidget<\/code> \u0434\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u043e\u0433\u043e AppBar&#8217;\u0430, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c <code>TickerProviderStateMixin<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0412 <code>initState<\/code> \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u0435\u043c <code>AnimationController<\/code> \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u044b\u0434\u0432\u0438\u0436\u043d\u043e\u0439 \u043f\u0430\u043d\u0435\u043b\u0438.<\/p>\n<\/li>\n<li>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u043c <code>Animation&lt;Offset&gt;<\/code> (\u0434\u043b\u044f <code>SlideTransition<\/code>) \u0438\u043b\u0438 <code>Animation&lt;double&gt;<\/code> (\u0434\u043b\u044f <code>SizeTransition<\/code>), \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044f <code>Tween<\/code> \u0438 \u043d\u0430\u0448 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440.<\/p>\n<\/li>\n<li>\n<p>\u0412 <code>build<\/code> \u043c\u0435\u0442\u043e\u0434\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c <code>Stack<\/code>. \u041d\u0438\u0436\u043d\u0438\u0439 \u0441\u043b\u043e\u0439 \u2014 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u0441\u043a\u0440\u043e\u043b\u043b\u044f\u0449\u0438\u0439\u0441\u044f \u043a\u043e\u043d\u0442\u0435\u043d\u0442 (<code>SingleChildScrollView<\/code> \u0438\u043b\u0438 <code>ListView<\/code>). \u0412\u0435\u0440\u0445\u043d\u0438\u0439 \u0441\u043b\u043e\u0439 \u2014 \u043d\u0430\u0448 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 AppBar.<\/p>\n<\/li>\n<li>\n<p>\u041a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 AppBar \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 <code>ClipRect<\/code> -&gt; <code>BackdropFilter<\/code> -&gt; <code>DecoratedBox<\/code> (\u0434\u043b\u044f \u0444\u043e\u043d\u0430 \u0441 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c\u044e, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 <code>Colors.white.withOpacity(0.7)<\/code>).<\/p>\n<\/li>\n<li>\n<p>\u0412\u043d\u0443\u0442\u0440\u0438 <code>DecoratedBox<\/code> \u0440\u0430\u0437\u043c\u0435\u0449\u0430\u0435\u043c \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043a\u043e\u043d\u0442\u0435\u043d\u0442 AppBar&#8217;\u0430 (\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a, \u0438\u043a\u043e\u043d\u043a\u0438) \u0438 \u043d\u0430\u0448\u0443 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0443\u044e \u0432\u044b\u0434\u0432\u0438\u0436\u043d\u0443\u044e \u043f\u0430\u043d\u0435\u043b\u044c, \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u0443\u044e \u0432 <code>SlideTransition<\/code> \u0438\u043b\u0438 <code>SizeTransition<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0435\u0440\u0435\u0434\u0430\u0435\u043c <code>ScrollController<\/code> \u0438\u0437 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0432 \u043d\u0430\u0448 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0439 AppBar.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044f \u043a <code>ScrollController<\/code>:<\/p>\n<pre><code class=\"dart\">\/\/ scrollController.addListener(() { \/\/   if (scrollController.offset &gt; threshold) { \/\/ threshold - \u043f\u043e\u0440\u043e\u0433 \u0441\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u043d\u0438\u044f \/\/     _expandController.forward(); \/\/   } else { \/\/     _expandController.reverse(); \/\/   } \/\/ }); <\/code><\/pre>\n<p>\u042d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c \u0438\u043b\u0438 \u0440\u0435\u0432\u0435\u0440\u0441\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u0432\u044b\u0434\u0432\u0438\u0436\u043d\u043e\u0439 \u043f\u0430\u043d\u0435\u043b\u0438.<\/p>\n<\/li>\n<\/ol>\n<\/li>\n<li>\n<p><strong>\u0410\u043a\u0446\u0435\u043d\u0442 \u043d\u0430 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438:<\/strong><\/p>\n<ul>\n<li>\n<p><code>BackdropFilter<\/code> \u2014 \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u0440\u0435\u0441\u0443\u0440\u0441\u043e\u0435\u043c\u043a\u0430\u044f \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u044f. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0430\u043a\u043a\u0443\u0440\u0430\u0442\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>\u041e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u0441\u0430\u043c\u0443 \u0432\u044b\u0434\u0432\u0438\u0436\u043d\u0443\u044e \u043f\u0430\u043d\u0435\u043b\u044c \u0438, \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e, \u0447\u0430\u0441\u0442\u044c AppBar&#8217;\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0435 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u044f \u0441\u043a\u0440\u043e\u043b\u043b\u0430 (\u0435\u0441\u043b\u0438 \u0442\u0430\u043a\u0430\u044f \u0435\u0441\u0442\u044c), \u0432 <code>RepaintBoundary<\/code>, \u0447\u0442\u043e\u0431\u044b \u043b\u043e\u043a\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0440\u0438\u0441\u043e\u0432\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0423\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u0441\u043b\u0443\u0448\u0430\u0442\u0435\u043b\u044c <code>ScrollController<\/code> \u043d\u0435 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u0438\u0437\u0431\u044b\u0442\u043e\u0447\u043d\u044b\u0445 <code>setState<\/code> \u043d\u0430 \u0432\u0441\u0435\u043c \u0432\u0438\u0434\u0436\u0435\u0442\u0435, \u0435\u0441\u043b\u0438 \u043c\u043e\u0436\u043d\u043e \u043e\u0431\u043e\u0439\u0442\u0438\u0441\u044c \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u043e\u0439\u043a\u043e\u0439 \u0442\u043e\u043b\u044c\u043a\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u043e\u0439 \u0447\u0430\u0441\u0442\u0438 \u0447\u0435\u0440\u0435\u0437 <code>AnimatedBuilder<\/code> \u0438\u043b\u0438 <code>*Transition<\/code> \u0432\u0438\u0434\u0436\u0435\u0442\u044b.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h4>5.2. \u041a\u0435\u0439\u0441 2: \u0418\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0438 \u0442\u043e\u0432\u0430\u0440\u0430 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c Rive State Machine.<\/h4>\n<ul>\n<li>\n<p><strong>\u0417\u0430\u0434\u0430\u0447\u0430:<\/strong> \u0421\u043e\u0437\u0434\u0430\u0442\u044c \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0443 \u0442\u043e\u0432\u0430\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u0430, \u0430 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043d\u0430 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u043c\u044b\u0448\u0438 (\u043d\u0430 \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u0435\/\u0432\u0435\u0431\u0435) \u0438\u043b\u0438 \u043f\u0440\u0438 \u0434\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u043c \u043d\u0430\u0436\u0430\u0442\u0438\u0438 (\u043d\u0430 \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445) \u0442\u043e\u0432\u0430\u0440 \u043d\u0430 \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0435 \u043c\u043e\u0436\u0435\u0442 \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u043f\u043e\u0432\u0435\u0440\u043d\u0443\u0442\u044c\u0441\u044f, \u043c\u043e\u0433\u0443\u0442 \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0434\u0435\u0442\u0430\u043b\u0438 \u0438\u043b\u0438 \u043a\u043d\u043e\u043f\u043a\u0438, \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c\u0441\u044f \u0444\u043e\u043d \u0438\u043b\u0438 \u0442\u0435\u043d\u0438. \u0412\u0441\u044f \u044d\u0442\u0430 \u043b\u043e\u0433\u0438\u043a\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0434\u043e\u043b\u0436\u043d\u0430 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0447\u0435\u0440\u0435\u0437 Rive State Machine.<\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>Rive Editor:<\/strong> \u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0432\u0435\u043a\u0442\u043e\u0440\u043d\u043e\u0439 \u0433\u0440\u0430\u0444\u0438\u043a\u0438 \u0442\u043e\u0432\u0430\u0440\u0430, \u0432\u0441\u0435\u0445 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438, \u0441\u0430\u043c\u043e\u0435 \u0433\u043b\u0430\u0432\u043d\u043e\u0435, State Machine.<\/p>\n<ul>\n<li>\n<p>\u0412 State Machine \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442\u0441\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, &#171;default&#187;, &#171;hovered&#187;, &#171;pressed&#187;).<\/p>\n<\/li>\n<li>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442\u0441\u044f \u0432\u0445\u043e\u0434\u044b (Inputs), \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u0443\u0434\u0443\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435: <code>Boolean<\/code> (\u0434\u043b\u044f on\/off \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439), <code>Number<\/code> (\u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0433\u0440\u0435\u0441\u0441\u043e\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438), <code>Trigger<\/code> (\u0434\u043b\u044f \u043e\u0434\u043d\u043e\u043a\u0440\u0430\u0442\u043d\u043e\u0433\u043e \u0437\u0430\u043f\u0443\u0441\u043a\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438).<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b (Transitions) \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0438\u0437 \u0442\u0430\u0439\u043c\u043b\u0430\u0439\u043d\u0430 Rive.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>Flutter:<\/strong><\/p>\n<ul>\n<li>\n<p>\u041f\u0430\u043a\u0435\u0442 <code>rive<\/code>: \u0414\u043b\u044f \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0438 <code>.riv<\/code> \u0444\u0430\u0439\u043b\u0430 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u0412\u0438\u0434\u0436\u0435\u0442 <code>RiveAnimation.asset()<\/code> (\u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0439 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u043e\u0440).<\/p>\n<\/li>\n<li>\n<p><code>onInit<\/code> \u043a\u043e\u043b\u0431\u044d\u043a \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f <code>Artboard<\/code>.<\/p>\n<\/li>\n<li>\n<p><code>StateMachineController.fromArtboard()<\/code> \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440\u0430 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0439 State Machine.<\/p>\n<\/li>\n<li>\n<p><code>SMIInput<\/code> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>_controller.findInput&lt;bool&gt;('isHover') as SMIBool?<\/code>) \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0445\u043e\u0434\u0430\u043c\u0438 State Machine \u0438\u0437 Dart-\u043a\u043e\u0434\u0430.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0438\u0434\u0436\u0435\u0442\u044b \u0434\u043b\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0432\u0432\u043e\u0434\u0430: <code>GestureDetector<\/code> (\u0434\u043b\u044f <code>onTap<\/code>, <code>onLongPress<\/code>) \u0438\u043b\u0438 <code>MouseRegion<\/code> (\u0434\u043b\u044f <code>onEnter<\/code>, <code>onExit<\/code> \u043d\u0430 \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u0435\/\u0432\u0435\u0431\u0435).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0420\u0430\u0437\u0431\u043e\u0440 \u043b\u043e\u0433\u0438\u043a\u0438 \u0438 \u043a\u043e\u0434\u0430:<\/strong><\/p>\n<ol>\n<li>\n<p><strong>\u0412 Rive Editor:<\/strong><\/p>\n<ul>\n<li>\n<p>\u0420\u0438\u0441\u0443\u0435\u043c \u043a\u0430\u0440\u0442\u043e\u0447\u043a\u0443, \u0442\u043e\u0432\u0430\u0440, \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u043e\u0432\u043e\u0440\u043e\u0442 \u0442\u043e\u0432\u0430\u0440\u0430, \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u043a\u043d\u043e\u043f\u043a\u0438 &#171;\u0412 \u043a\u043e\u0440\u0437\u0438\u043d\u0443&#187;).<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0435\u043c State Machine. \u0414\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u043c Input, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>isHovered<\/code> (Boolean).<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u0435\u043c \u0434\u0432\u0430 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f: &#171;Idle&#187; \u0438 &#171;Hovered&#187;.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u0438\u0437 &#171;Idle&#187; \u0432 &#171;Hovered&#187; \u043f\u0440\u0438 <code>isHovered == true<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e &#171;hover_effect&#187;.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u043c \u043e\u0431\u0440\u0430\u0442\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043f\u0440\u0438 <code>isHovered == false<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u0432\u043e\u0437\u0432\u0440\u0430\u0442\u0430 \u0432 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0412\u043e Flutter:<\/strong><\/p>\n<pre><code class=\"dart\">\/\/ class InteractiveProductCard extends StatefulWidget {... } \/\/ class _InteractiveProductCardState extends State&lt;InteractiveProductCard&gt; { \/\/   Artboard? _riveArtboard; \/\/   StateMachineController? _stateMachineController; \/\/   SMIBool? _hoverInput; \/\/ \/\/   @override \/\/   void initState() { \/\/     super.initState(); \/\/     \/\/ \u0417\u0430\u0433\u0440\u0443\u0437\u043a\u0430 Rive \u0444\u0430\u0439\u043b\u0430 (\u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0437\u0430\u0440\u0430\u043d\u0435\u0435) \/\/     rootBundle.load('assets\/product_card.riv').then( \/\/       (data) async { \/\/         final file = RiveFile.import(data); \/\/         final artboard = file.mainArtboard; \/\/         var controller = StateMachineController.fromArtboard(artboard, 'HoverStateMachine'); \/\/ \u0418\u043c\u044f \u0432\u0430\u0448\u0435\u0439 State Machine \/\/         if (controller!= null) { \/\/           artboard.addController(controller); \/\/           _hoverInput = controller.findInput&lt;bool&gt;('isHovered') as SMIBool?; \/\/ \u0418\u043c\u044f \u0432\u0430\u0448\u0435\u0433\u043e Boolean Input \/\/         } \/\/         setState(() =&gt; _riveArtboard = artboard); \/\/       }, \/\/     ); \/\/   } \/\/ \/\/   void _onHover(bool isHovered) { \/\/     _hoverInput?.value = isHovered; \/\/   } \/\/ \/\/   @override \/\/   Widget build(BuildContext context) { \/\/     return MouseRegion( \/\/ \u0414\u043b\u044f \u0434\u0435\u0441\u043a\u0442\u043e\u043f\u0430\/\u0432\u0435\u0431\u0430 \/\/       onEnter: (_) =&gt; _onHover(true), \/\/       onExit: (_) =&gt; _onHover(false), \/\/       child: GestureDetector( \/\/ \u0414\u043b\u044f \u043c\u043e\u0431\u0438\u043b\u044c\u043d\u044b\u0445 (\u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c onTap, onLongPress) \/\/         onTapDown: (_) =&gt; _onHover(true), \/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0434\u043b\u044f \u043a\u0430\u0441\u0430\u043d\u0438\u044f \/\/         onTapUp: (_) =&gt; _onHover(false), \/\/         onTapCancel: () =&gt; _onHover(false), \/\/         child: _riveArtboard == null \/\/            ? const SizedBox() \/\/             : Rive(artboard: _riveArtboard!), \/\/       ), \/\/     ); \/\/   } \/\/ } <\/code><\/pre>\n<\/li>\n<\/ol>\n<\/li>\n<li>\n<p><strong>\u041f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u0430 Rive \u0434\u043b\u044f \u0442\u0430\u043a\u043e\u0433\u043e \u043a\u0435\u0439\u0441\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u0420\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043b\u043e\u0433\u0438\u043a\u0438:<\/strong> \u041b\u043e\u0433\u0438\u043a\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0438 \u0435\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0438\u043d\u043a\u0430\u043f\u0441\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u044b \u0432 Rive-\u0444\u0430\u0439\u043b\u0435. Flutter-\u043a\u043e\u0434 \u043e\u0442\u0432\u0435\u0447\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u0437\u0430 \u043f\u0435\u0440\u0435\u0434\u0430\u0447\u0443 \u0441\u0438\u0433\u043d\u0430\u043b\u043e\u0432 (\u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 Inputs).<\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u0442\u0435\u0440\u0430\u0446\u0438\u0438 \u0434\u0438\u0437\u0430\u0439\u043d\u0430:<\/strong> \u0414\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u044b \u043c\u043e\u0433\u0443\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u043d\u043e\u0432\u044b\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0438 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u0432 Rive Editor, \u0438 \u044d\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u0440\u0430\u0437\u0443 \u043e\u0442\u0440\u0430\u0437\u044f\u0442\u0441\u044f \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438 \u0431\u0435\u0437 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043f\u0435\u0440\u0435\u043f\u0438\u0441\u044b\u0432\u0430\u0442\u044c Dart-\u043a\u043e\u0434 (\u0435\u0441\u043b\u0438 \u0438\u043c\u0435\u043d\u0430 Inputs \u0438 State Machines \u043d\u0435 \u043c\u0435\u043d\u044f\u044e\u0442\u0441\u044f).<\/p>\n<\/li>\n<li>\n<p><strong>\u0421\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u044c:<\/strong> State Machines \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043e\u0447\u0435\u043d\u044c \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0435 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0431\u044b\u043b\u043e \u0431\u044b \u0437\u0430\u0442\u0440\u0443\u0434\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0435\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430\u043c\u0438 Flutter-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<h4>5.3. \u041a\u0435\u0439\u0441 3: \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441\u043f\u0438\u0441\u043a\u0430 \u0441 &#171;\u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u043c&#187; \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435\u043c \u043f\u0440\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438\/\u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 (\u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c flutter_physics \u0438\u043b\u0438 SpringSimulation).<\/h4>\n<ul>\n<li>\n<p><strong>\u0417\u0430\u0434\u0430\u0447\u0430:<\/strong> \u0421\u043e\u0437\u0434\u0430\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a, \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043a\u043e\u0442\u043e\u0440\u043e\u0433\u043e \u043f\u0440\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438 \u043d\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f, \u0430 &#171;\u0432\u043f\u0440\u044b\u0433\u0438\u0432\u0430\u044e\u0442&#187; \u043d\u0430 \u0441\u0432\u043e\u0435 \u043c\u0435\u0441\u0442\u043e \u0441 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u043c \u043f\u0440\u0443\u0436\u0438\u043d\u044b. \u041f\u0440\u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043b\u0430\u0432\u043d\u043e &#171;\u0443\u043b\u0435\u0442\u0430\u0442\u044c&#187; \u0438\u043b\u0438 &#171;\u0441\u0445\u043b\u043e\u043f\u044b\u0432\u0430\u0442\u044c\u0441\u044f&#187; \u0441 \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u0435\u043c, \u0442\u0430\u043a\u0436\u0435 \u0438\u043c\u0438\u0442\u0438\u0440\u0443\u044f \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p><strong>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0438 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b:<\/strong><\/p>\n<ul>\n<li>\n<p><code>AnimatedList<\/code>: \u0411\u0430\u0437\u043e\u0432\u044b\u0439 \u0432\u0438\u0434\u0436\u0435\u0442 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0441\u043f\u0438\u0441\u043a\u0430. \u041e\u043d \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 <code>GlobalKey&lt;AnimatedListState&gt;<\/code> \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u044f\u043c\u0438 <code>insertItem<\/code> \u0438 <code>removeItem<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: \u041a\u0430\u0436\u0434\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0441\u043f\u0438\u0441\u043a\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0438\u043b\u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u0435\u0442, \u0431\u0443\u0434\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u0441\u0432\u043e\u0439 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u0439 <code>AnimationController<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u0424\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438:<\/p>\n<ul>\n<li>\n<p><code>SpringSimulation<\/code> \u0441 <code>AnimationController.animateWith()<\/code>: \u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043f\u0440\u0443\u0436\u0438\u043d\u043d\u043e\u0433\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u043f\u0440\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438. \u00a0 <\/p>\n<\/li>\n<li>\n<p>\u041f\u0430\u043a\u0435\u0442 <code>flutter_physics<\/code>: \u041c\u043e\u0436\u0435\u0442 \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0438\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0432\u044b\u0441\u043e\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u0435 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0446\u0438\u0438 \u0434\u043b\u044f \u043f\u0440\u0443\u0436\u0438\u043d \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u0445 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0442\u0440\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 &#171;\u0443\u043b\u0435\u0442\u0430\u043d\u0438\u0438&#187;). \u00a0 <\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p>\u0412\u0438\u0434\u0436\u0435\u0442\u044b-\u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b: <code>SlideTransition<\/code>, <code>SizeTransition<\/code>, <code>FadeTransition<\/code> \u0431\u0443\u0434\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043d\u043e \u0438\u0445 <code>Animation<\/code> \u0431\u0443\u0434\u0435\u0442 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c\u0441\u044f <code>AnimationController<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439, \u0432 \u0441\u0432\u043e\u044e \u043e\u0447\u0435\u0440\u0435\u0434\u044c, \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c &#171;\u0434\u0432\u0438\u0436\u0438\u043c&#187; \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0435\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0420\u0430\u0437\u0431\u043e\u0440 \u043b\u043e\u0433\u0438\u043a\u0438 \u0438 \u043a\u043e\u0434\u0430:<\/strong><\/p>\n<ol>\n<li>\n<p><strong>\u0421\u0442\u0440\u0443\u043a\u0442\u0443\u0440\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0441\u043f\u0438\u0441\u043a\u0430:<\/strong> \u041a\u0430\u0436\u0434\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0441\u043f\u0438\u0441\u043a\u0430 \u0434\u043e\u043b\u0436\u0435\u043d \u0431\u044b\u0442\u044c <code>StatefulWidget<\/code> (\u0438\u043b\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>StatefulBuilder<\/code> \u0432\u043d\u0443\u0442\u0440\u0438 <code>AnimatedList.itemBuilder<\/code>), \u0447\u0442\u043e\u0431\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u0441\u0432\u043e\u0438\u043c <code>AnimationController<\/code>.<\/p>\n<\/li>\n<li>\n<p><strong>\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 <code>animatedListKey.currentState!.insertItem(index)<\/code> \u0432 <code>itemBuilder<\/code> \u0434\u043b\u044f \u043d\u043e\u0432\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f <code>AnimationController<\/code>.<\/p>\n<\/li>\n<li>\n<p>\u041d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f <code>SpringSimulation<\/code> (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0430 \u0438\u043b\u0438 \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u044f \u043e\u0442 0 \u043a \u0446\u0435\u043b\u0435\u0432\u043e\u043c\u0443 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e).<\/p>\n<\/li>\n<li>\n<p><code>_controller.animateWith(springSimulation)<\/code> \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e.<\/p>\n<\/li>\n<li>\n<p>\u0412\u0438\u0434\u0436\u0435\u0442 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043e\u0431\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 <code>ScaleTransition<\/code> \u0438 <code>FadeTransition<\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0449\u0438\u0435 \u044d\u0442\u043e\u0442 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u043b\u0435\u0440.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u0423\u0434\u0430\u043b\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430:<\/strong><\/p>\n<ul>\n<li>\n<p>\u041f\u0440\u0438 \u0432\u044b\u0437\u043e\u0432\u0435 <code>animatedListKey.currentState!.removeItem(index, (context, animation) =&gt; buildRemovedItem(item, animation))<\/code> \u0434\u043b\u044f \u0443\u0434\u0430\u043b\u044f\u0435\u043c\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f <code>Animation<\/code> (\u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u043c\u0430\u044f <code>AnimatedList<\/code>).<\/p>\n<\/li>\n<li>\n<p>\u042d\u0442\u0443 <code>animation<\/code> \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0433\u043e fade-out\/slide-out \u0438\u043b\u0438 \u0441\u043a\u043e\u043c\u0431\u0438\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441 \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u043e\u0439 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0435\u0439, \u0435\u0441\u043b\u0438 \u043d\u0443\u0436\u043d\u043e \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044d\u043b\u0435\u043c\u0435\u043d\u0442 &#171;\u043e\u0442\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0435\u0442\u0441\u044f&#187; \u0441 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\u044e \u0438 \u0437\u0430\u0442\u0443\u0445\u0430\u0435\u0442).<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 <\/strong><code><strong>SpringDescription<\/strong><\/code><strong>:<\/strong> \u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u2014 \u043f\u043e\u0434\u0431\u043e\u0440 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 <code>mass<\/code>, <code>stiffness<\/code>, <code>damping<\/code> \u0434\u043b\u044f <code>SpringDescription<\/code>, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0436\u0435\u043b\u0430\u0435\u043c\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 &#171;\u0432\u043f\u0440\u044b\u0433\u0438\u0432\u0430\u043d\u0438\u044f&#187; \u2014 \u043d\u0435 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0432\u044f\u043b\u044b\u0439, \u043d\u043e \u0438 \u043d\u0435 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0440\u0435\u0437\u043a\u0438\u0439. \u00a0 <\/p>\n<\/li>\n<\/ol>\n<\/li>\n<li>\n<p><strong>\u0424\u043e\u043a\u0443\u0441 \u043d\u0430 &#171;\u043e\u0449\u0443\u0449\u0435\u043d\u0438\u0438&#187;:<\/strong> \u0424\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0432\u043b\u0438\u044f\u044e\u0442 \u043d\u0430 \u0442\u043e, \u043a\u0430\u043a \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432\u043e\u0441\u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e. \u042d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0438\u0440\u0443\u044f \u0441 \u043d\u0438\u043c\u0438, \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u043e\u0447\u0435\u043d\u044c \u043f\u0440\u0438\u044f\u0442\u043d\u044b\u0445 \u0438 &#171;\u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0445&#187; \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u043b\u0430\u044e\u0442 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441\u043e \u0441\u043f\u0438\u0441\u043a\u043e\u043c \u0431\u043e\u043b\u0435\u0435 \u0436\u0438\u0432\u044b\u043c \u0438 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u043c.<\/p>\n<\/li>\n<\/ul>\n<p>\u0412 \u0440\u0435\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u043e\u0435\u043a\u0442\u0430\u0445 \u0440\u0435\u0434\u043a\u043e \u0431\u044b\u0432\u0430\u0435\u0442 \u0442\u0430\u043a, \u0447\u0442\u043e \u043e\u0434\u043d\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0440\u0435\u0448\u0430\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u0438\u043c \u043f\u0440\u043e\u0441\u0442\u044b\u043c \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u043c \u0438\u043b\u0438 \u043e\u0434\u043d\u043e\u0439 \u0442\u0435\u0445\u043d\u0438\u043a\u043e\u0439. \u0427\u0430\u0449\u0435 \u0432\u0441\u0435\u0433\u043e, \u043a\u0430\u043a \u0432\u0438\u0434\u043d\u043e \u0438\u0437 \u044d\u0442\u0438\u0445 \u043a\u0435\u0439\u0441\u043e\u0432, \u044d\u0442\u043e \u0446\u0435\u043b\u044b\u0439 \u043e\u0440\u043a\u0435\u0441\u0442\u0440 \u0438\u0437 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432: <code>ScrollController<\/code> \u0434\u043b\u044f \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u043d\u0438\u044f \u0441\u043e\u0431\u044b\u0442\u0438\u0439, \u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 (<code>AnimationController<\/code>, <code>Tween<\/code>, <code>*Transition<\/code>) \u0434\u043b\u044f \u0442\u043e\u0447\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f, <code>BackdropFilter<\/code> \u0434\u043b\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, Rive State Machines \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u043e\u0439 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438, \u0444\u0438\u0437\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0441\u0438\u043c\u0443\u043b\u044f\u0446\u0438\u0438 \u0434\u043b\u044f \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0441\u0442\u0438 \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f. \u041c\u0430\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u043e \u0432 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u0445 Flutter \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0437\u043d\u0430\u043d\u0438\u0438 \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432, \u043d\u043e \u0438 \u0432 \u0443\u043c\u0435\u043d\u0438\u0438 \u0438\u0445 \u0442\u0432\u043e\u0440\u0447\u0435\u0441\u043a\u0438 \u043a\u043e\u043c\u0431\u0438\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u0447\u0442\u043e\u0431\u044b \u0440\u0435\u0448\u0430\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0435 \u0434\u0438\u0437\u0430\u0439\u043d\u0435\u0440\u0441\u043a\u0438\u0435 \u0438 UX-\u0437\u0430\u0434\u0430\u0447\u0438. \u0420\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a \u0434\u043e\u043b\u0436\u0435\u043d \u043c\u044b\u0441\u043b\u0438\u0442\u044c \u043a\u0430\u043a \u0430\u0440\u0445\u0438\u0442\u0435\u043a\u0442\u043e\u0440 \u0438\u043b\u0438 \u0440\u0435\u0436\u0438\u0441\u0441\u0435\u0440, \u0441\u043e\u0431\u0438\u0440\u0430\u044f \u0438\u0437 \u0440\u0430\u0437\u043d\u044b\u0445 &#171;\u0441\u0442\u0440\u043e\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0431\u043b\u043e\u043a\u043e\u0432&#187; \u0435\u0434\u0438\u043d\u043e\u0435, \u0433\u0430\u0440\u043c\u043e\u043d\u0438\u0447\u043d\u043e\u0435 \u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e\u0435 \u0446\u0435\u043b\u043e\u0435. \u00a0 <\/p>\n<p><strong>[Future: June 2025]<\/strong> \u0414\u043b\u044f \u044d\u0442\u0438\u0445 \u043a\u0435\u0439\u0441\u043e\u0432 \u0432\u0430\u0436\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0432\u0435\u0440\u0438\u0442\u044c, \u043d\u0435 \u043f\u043e\u044f\u0432\u0438\u043b\u0438\u0441\u044c \u043b\u0438 \u043d\u043e\u0432\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0438\u043b\u0438 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 Flutter, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u043b\u0438 \u0431\u044b \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c \u0438\u0445 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u044e. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 <code>flutter_physics<\/code> \u043f\u043e\u043b\u0443\u0447\u0438\u0442 \u0448\u0438\u0440\u043e\u043a\u043e\u0435 \u0440\u0430\u0441\u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0435\u043d\u0438\u0435 \u0438 \u0431\u043e\u043b\u0435\u0435 \u0432\u044b\u0441\u043e\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u0435 API \u0434\u043b\u044f \u0441\u043f\u0438\u0441\u043a\u043e\u0432, \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u043f\u043e\u0434\u0445\u043e\u0434 \u043a \u0442\u0440\u0435\u0442\u044c\u0435\u043c\u0443 \u043a\u0435\u0439\u0441\u0443. \u0422\u0430\u043a\u0436\u0435 \u0441\u0442\u043e\u0438\u0442 \u0441\u043b\u0435\u0434\u0438\u0442\u044c \u0437\u0430 \u0440\u0430\u0437\u0432\u0438\u0442\u0438\u0435\u043c Rive \u0438 \u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0435\u0439 \u0441 Flutter.<\/p>\n<h3>\u0417\u0430\u043a\u043b\u044e\u0447\u0435\u043d\u0438\u0435<\/h3>\n<p>\u041d\u0443 \u0447\u0442\u043e, \u043a\u043e\u043b\u043b\u0435\u0433\u0438, \u0432\u043e\u0442 \u043c\u044b \u0438 \u043f\u0440\u043e\u043b\u0435\u0442\u0435\u043b\u0438 (\u043d\u0430\u0434\u0435\u044e\u0441\u044c, \u0441 60 FPS!) \u043f\u043e \u043d\u0435\u043e\u0431\u044a\u044f\u0442\u043d\u043e\u043c\u0443 \u043c\u0438\u0440\u0443 Flutter-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. \u041e\u0442 \u043f\u0440\u043e\u0441\u0442\u044b\u0445 <code>AnimatedContainer<\/code> \u0434\u043e \u0441\u043b\u043e\u0436\u043d\u044b\u0445 State Machines \u0432 Rive \u0438 \u043d\u044e\u0430\u043d\u0441\u043e\u0432 \u043e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u0438 \u2013 \u043d\u0430\u0434\u0435\u044e\u0441\u044c, \u044d\u0442\u043e\u0442 \u0433\u0430\u0439\u0434 \u043e\u043a\u0430\u0437\u0430\u043b\u0441\u044f \u0434\u043b\u044f \u0432\u0430\u0441 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u043c \u0438 \u043f\u043e\u043c\u043e\u0436\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0435\u0449\u0435 \u0431\u043e\u043b\u0435\u0435 \u043a\u0440\u0443\u0442\u044b\u0435 \u0438 \u043e\u0442\u0437\u044b\u0432\u0447\u0438\u0432\u044b\u0435 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u044b.<\/p>\n<p><strong>\u041a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0432\u044b\u0432\u043e\u0434\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u043f\u043e\u0434\u0447\u0435\u0440\u043a\u043d\u0443\u0442\u044c:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>Flutter \u2014 \u044d\u0442\u043e \u043c\u043e\u0449\u044c:<\/strong> \u0424\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043e\u0433\u0440\u043e\u043c\u043d\u044b\u0439 \u0438 \u0433\u0438\u0431\u043a\u0438\u0439 \u043d\u0430\u0431\u043e\u0440 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u2014 \u043e\u0442 \u0441\u0430\u043c\u044b\u0445 \u043f\u0440\u043e\u0441\u0442\u044b\u0445 \u0434\u043e \u043d\u0435\u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0438 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u044b\u0445.<\/p>\n<\/li>\n<li>\n<p><strong>Implicit vs. Explicit:<\/strong> \u0427\u0435\u0442\u043a\u043e \u043f\u043e\u043d\u0438\u043c\u0430\u0439\u0442\u0435 \u0440\u0430\u0437\u043d\u0438\u0446\u0443 \u043c\u0435\u0436\u0434\u0443 \u043d\u0435\u044f\u0432\u043d\u044b\u043c\u0438 \u0438 \u044f\u0432\u043d\u044b\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438. \u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u2014 \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u044b\u0445, \u0431\u044b\u0441\u0442\u0440\u044b\u0445 \u0440\u0435\u0448\u0435\u043d\u0438\u0439. \u042f\u0432\u043d\u044b\u0435 \u2014 \u0434\u043b\u044f \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0435\u0432. \u0412\u044b\u0431\u0438\u0440\u0430\u0439\u0442\u0435 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u043f\u043e \u0437\u0430\u0434\u0430\u0447\u0435. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041c\u0430\u0433\u0438\u044f \u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439:<\/strong> \u041d\u0435 \u0431\u043e\u0439\u0442\u0435\u0441\u044c \u043f\u043e\u0433\u0440\u0443\u0436\u0430\u0442\u044c\u0441\u044f \u0432 <code>AnimationController<\/code>, <code>Tween<\/code>, <code>Curve<\/code> \u0438 <code>AnimatedBuilder<\/code>. \u042d\u0442\u043e \u0432\u0430\u0448\u0438 \u043b\u0443\u0447\u0448\u0438\u0435 \u0434\u0440\u0443\u0437\u044c\u044f \u043d\u0430 \u043f\u0443\u0442\u0438 \u043a \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044e \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u0412\u043d\u0435\u0448\u043d\u0438\u0435 \u0441\u0438\u043b\u044b Lottie \u0438 Rive:<\/strong> \u0414\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0432\u0435\u043a\u0442\u043e\u0440\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0439 \u0438 \u043f\u0435\u0440\u0441\u043e\u043d\u0430\u0436\u0435\u0439 Lottie \u0438 Rive \u2014 \u043f\u0440\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043c\u0430\u0441\u0442-\u0445\u044d\u0432. Rive \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0441\u0438\u043b\u0435\u043d \u0432 \u0438\u043d\u0442\u0435\u0440\u0430\u043a\u0442\u0438\u0432\u043d\u043e\u0441\u0442\u0438 \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f State Machines. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u041e\u043f\u0442\u0438\u043c\u0438\u0437\u0430\u0446\u0438\u044f \u2014 \u043d\u0435 \u0440\u043e\u0441\u043a\u043e\u0448\u044c:<\/strong> \u041f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u0430 \u0434\u043b\u044f UX. \u041f\u043e\u043c\u043d\u0438\u0442\u0435 \u043f\u0440\u043e <code>RepaintBoundary<\/code>, \u043f\u0440\u043e\u0444\u0438\u043b\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0432 <code>profile mode<\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 <code>const<\/code> \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u0438 \u0437\u0434\u0440\u0430\u0432\u044b\u0439 \u0441\u043c\u044b\u0441\u043b. \u041d\u0435 \u0437\u0430\u0441\u0442\u0430\u0432\u043b\u044f\u0439\u0442\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439 \u0441\u0442\u0440\u0430\u0434\u0430\u0442\u044c \u043e\u0442 \u043b\u0430\u0433\u043e\u0432. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u042d\u043a\u043e\u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0432 \u043f\u043e\u043c\u043e\u0449\u044c:<\/strong> \u041f\u0430\u043a\u0435\u0442\u044b \u0432\u0440\u043e\u0434\u0435 <code>flutter_animate<\/code>, <code>simple_animations<\/code>, <code>animations<\/code> (Material Motion), <code>flutter_physics<\/code> \u043c\u043e\u0433\u0443\u0442 \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0443\u043f\u0440\u043e\u0441\u0442\u0438\u0442\u044c \u0436\u0438\u0437\u043d\u044c \u0438 \u0441\u043e\u043a\u0440\u0430\u0442\u0438\u0442\u044c \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0431\u043e\u0439\u043b\u0435\u0440\u043f\u043b\u0435\u0439\u0442\u0430. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438\u00a0\u2014 \u044d\u0442\u043e \u043d\u0435\u00a0\u043f\u0440\u043e\u0441\u0442\u043e \u00ab\u0447\u0442\u043e\u0431\u044b \u043a\u0440\u0430\u0441\u0438\u0432\u043e\u00a0\u0431\u044b\u043b\u043e\u00bb. \u042d\u0442\u043e \u043c\u043e\u0449\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u043e\u0431\u0449\u0435\u043d\u0438\u044f \u0441\u00a0\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c, \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f\u00a0\u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u044f \u043d\u0430\u0432\u0438\u0433\u0430\u0446\u0438\u0438, \u0430\u043a\u0446\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u044d\u043c\u043e\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u0432\u044f\u0437\u0438 \u0441\u00a0\u0432\u0430\u0448\u0438\u043c \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u043c. \u042d\u0442\u043e \u0442\u043e, \u0447\u0442\u043e\u00a0\u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0434\u0435\u043b\u0438\u0442\u044c \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0441\u0440\u0435\u0434\u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0430 \u0434\u0440\u0443\u0433\u0438\u0445.<\/p>\n<p>\u0422\u0430\u043a \u0447\u0442\u043e\u00a0\u043d\u0435\u00a0\u0431\u043e\u0439\u0442\u0435\u0441\u044c \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u043d\u043e\u0432\u044b\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044b, \u043a\u043e\u043c\u0431\u0438\u043d\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0438, \u0441\u0430\u043c\u043e\u0435 \u0433\u043b\u0430\u0432\u043d\u043e\u0435, \u0432\u0441\u0435\u0433\u0434\u0430 \u0434\u0443\u043c\u0430\u0439\u0442\u0435 \u043e\u00a0\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435 \u0438 \u0435\u0433\u043e \u043e\u043f\u044b\u0442\u0435.<\/p>\n<p>\u0411\u0443\u0434\u0443 \u0440\u0430\u0434 \u0432\u0430\u0448\u0438\u043c \u0432\u043e\u043f\u0440\u043e\u0441\u0430\u043c, \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f\u043c \u0438 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0442\u0438\u0432\u043d\u044b\u043c \u0445\u043e\u043b\u0438\u0432\u0430\u0440\u0430\u043c \u0432\u00a0\u043a\u043e\u043c\u043c\u0435\u043d\u0442\u0430\u0440\u0438\u044f\u0445. \u041a\u0430\u043a\u0438\u0435 \u0432\u0430\u0448\u0438 \u043b\u044e\u0431\u0438\u043c\u044b\u0435 \u0442\u0435\u0445\u043d\u0438\u043a\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u043e\u00a0Flutter? \u0421\u00a0\u043a\u0430\u043a\u0438\u043c\u0438 \u0441\u0430\u043c\u044b\u043c\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u043c\u0438 \u0438\u043b\u0438\u00a0\u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u043c\u0438 \u0437\u0430\u0434\u0430\u0447\u0430\u043c\u0438 \u043f\u043e\u00a0\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u044b \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u043b\u0438\u0441\u044c? \u041a\u0430\u043a\u0438\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0441\u0442\u0430\u043b\u0438 \u0434\u043b\u044f\u00a0\u0432\u0430\u0441 \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0435\u043c? \u0420\u0435\u0434\u0430\u0447\u0438\u043b \u0442\u0435\u043a\u0441\u0442 \u043f\u0440\u0438\u00a0\u043f\u043e\u043c\u043e\u0449\u0438 \u0418\u0418, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0435\u0441\u043b\u0438 \u0433\u0434\u0435\u2011\u0442\u043e \u043e\u043d \u0432\u0441\u0442\u0430\u0432\u0438\u043b 6\u00a0\u0438\u043b\u0438\u00a0\u0431\u043e\u043b\u0435\u0435 \u043f\u0430\u043b\u044c\u0446\u0435\u0432\u00a0\u2014 \u043f\u0438\u0448\u0438\u0442\u0435 \u0437\u0430\u043c\u0435\u0447\u0430\u043d\u0438\u044f  :\u2011)<\/p>\n<p>\u0423\u0434\u0430\u0447\u0438 \u0432 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043f\u043b\u0430\u0432\u043d\u044b\u0445 \u0438 \u0432\u044b\u0440\u0430\u0437\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u0432!<\/p>\n<\/div>\n<\/div>\n<\/div>\n<p><!----><!----><\/div>\n<p><!----><!----><br \/> \u0441\u0441\u044b\u043b\u043a\u0430 \u043d\u0430 \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b \u0441\u0442\u0430\u0442\u044c\u0438 <a href=\"https:\/\/habr.com\/ru\/articles\/918822\/\"> https:\/\/habr.com\/ru\/articles\/918822\/<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<div><!--[--><!--]--><\/div>\n<div id=\"post-content-body\">\n<div>\n<div class=\"article-formatted-body article-formatted-body article-formatted-body_version-2\">\n<div xmlns=\"http:\/\/www.w3.org\/1999\/xhtml\">\n<p>\u041f\u0440\u0438\u0432\u0435\u0442, \u0425\u0430\u0431\u0440! \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2013 \u044d\u0442\u043e \u0442\u0430 \u0441\u0430\u043c\u0430\u044f \u0432\u0438\u0448\u0435\u043d\u043a\u0430 \u043d\u0430 \u0442\u043e\u0440\u0442\u0435, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0435\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0449\u0435\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432 \u043d\u0435\u0447\u0442\u043e, \u0447\u0435\u043c \u043f\u0440\u0438\u044f\u0442\u043d\u043e \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u0445\u043e\u0447\u0435\u0442\u0441\u044f \u00ab\u043f\u043e\u0442\u0440\u043e\u0433\u0430\u0442\u044c\u00bb. \u041d\u043e \u043a\u0430\u043a \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u044d\u0442\u0430 \u0432\u0438\u0448\u0435\u043d\u043a\u0430 \u043d\u0435 \u043f\u0440\u0435\u0432\u0440\u0430\u0442\u0438\u043b\u0430\u0441\u044c \u0432 \u0442\u044b\u043a\u0432\u0443, \u0442\u043e\u0440\u043c\u043e\u0437\u044f\u0449\u0443\u044e \u0432\u0435\u0441\u044c UI \u0438 \u0441\u044a\u0435\u0434\u0430\u044e\u0449\u0443\u044e \u0431\u0430\u0442\u0430\u0440\u0435\u0439\u043a\u0443?<\/p>\n<p>\u0417\u0430 \u0433\u043e\u0434\u044b \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0438 \u044f \u043f\u0435\u0440\u0435\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u043b, \u043a\u0430\u0436\u0435\u0442\u0441\u044f, \u0432\u0441\u0451: \u043e\u0442 \u043f\u0440\u043e\u0441\u0442\u0435\u0439\u0448\u0438\u0445 <code>AnimatedContainer<\/code> \u0434\u043e \u0437\u0430\u043c\u043e\u0440\u043e\u0447\u0435\u043d\u043d\u044b\u0445 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0440\u0435\u0448\u0435\u043d\u0438\u0439 \u0441 \u0444\u0438\u0437\u0438\u043a\u043e\u0439 \u0438 \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0439 \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u0435\u0439 \u0441 Rive. \u0418 \u0441\u0435\u0433\u043e\u0434\u043d\u044f \u044f \u0445\u043e\u0447\u0443 \u043f\u043e\u0434\u0435\u043b\u0438\u0442\u044c\u0441\u044f \u0441 \u0432\u0430\u043c\u0438 \u044d\u0442\u0438\u043c \u043e\u043f\u044b\u0442\u043e\u043c, \u0441\u043e\u0431\u0440\u0430\u0432 \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u0432\u0441\u0451, \u0447\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u0437\u043d\u0430\u0442\u044c \u043e \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0432\u043e Flutter \u0432 2025 \u0433\u043e\u0434\u0443. \u042d\u0442\u043e \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u043b\u043e\u043d\u0433\u0440\u0438\u0434-\u044d\u043d\u0446\u0438\u043a\u043b\u043e\u043f\u0435\u0434\u0438\u044f, \u0442\u0430\u043a \u0447\u0442\u043e \u0437\u0430\u0432\u0430\u0440\u0438\u0442\u0435 \u043a\u043e\u0444\u0435\u0439\u043a\u0443 \u0438\u043b\u0438 \u0447\u0442\u043e \u043f\u043e\u043a\u0440\u0435\u043f\u0447\u0435!<\/p>\n<p>\u041c\u044b \u043f\u0440\u043e\u0439\u0434\u0435\u043c\u0441\u044f \u043f\u043e \u043e\u0441\u043d\u043e\u0432\u0430\u043c, \u0437\u0430\u0433\u043b\u044f\u043d\u0435\u043c \u043f\u043e\u0434 \u043a\u0430\u043f\u043e\u0442 \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u044b\u0445 \u0442\u0435\u0445\u043d\u0438\u043a, \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u043f\u0430\u043a\u0435\u0442\u044b \u0438, \u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0436\u0435, \u043f\u043e\u0433\u043e\u0432\u043e\u0440\u0438\u043c \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u043d\u0435 \u0443\u0431\u0438\u0442\u044c \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0438 \u0434\u043e\u0431\u0438\u0442\u044c\u0441\u044f \u0437\u0430\u0432\u0435\u0442\u043d\u044b\u0445 60+ FPS. \u041f\u043e\u0435\u0445\u0430\u043b\u0438!<\/p>\n<ul>\n<li>\n<p><strong>\u0410\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c:<\/strong> \u0421\u0442\u0430\u0442\u044c\u044f \u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u0430 \u043d\u0430 \u0438\u044e\u043d\u044c 2025. \u0425\u043e\u0442\u044f \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0440\u0438\u043d\u0446\u0438\u043f\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432\u043e Flutter \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u0441\u0442\u0430\u0431\u0438\u043b\u044c\u043d\u044b\u043c\u0438, \u044f \u043f\u043e\u0441\u0442\u0430\u0440\u0430\u043b\u0441\u044f \u0443\u0447\u0435\u0441\u0442\u044c \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0438\u0435 \u0442\u0435\u043d\u0434\u0435\u043d\u0446\u0438\u0438 \u0438 \u0432\u0435\u0440\u0441\u0438\u0438 \u0431\u0438\u0431\u043b\u0438\u043e\u0442\u0435\u043a. \u041e\u0434\u043d\u0430\u043a\u043e \u043c\u0438\u0440 Flutter \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441\u0442\u0440\u0435\u043c\u0438\u0442\u0435\u043b\u044c\u043d\u043e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u0432\u0435\u0440\u044f\u0439\u0442\u0435\u0441\u044c \u0441 \u043e\u0444\u0438\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0439 \u0434\u043e\u043a\u0443\u043c\u0435\u043d\u0442\u0430\u0446\u0438\u0435\u0439 \u043d\u0430 \u043c\u043e\u043c\u0435\u043d\u0442 \u0447\u0442\u0435\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ul>\n<h3>\u0413\u043b\u0430\u0432\u0430 1: \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u0430\u044f \u0410\u0437\u0431\u0443\u043a\u0430 Flutter \u2013 \u0421\u0442\u0440\u043e\u0438\u043c \u0424\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442<\/h3>\n<p>\u041f\u0440\u0435\u0436\u0434\u0435 \u0447\u0435\u043c \u0441\u0442\u0440\u043e\u0438\u0442\u044c \u043d\u0435\u0431\u043e\u0441\u043a\u0440\u0435\u0431\u044b \u0438\u0437 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u043b\u043e\u0436\u0438\u0442\u044c \u043a\u0440\u0435\u043f\u043a\u0438\u0439 \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442. \u0412 \u044d\u0442\u043e\u0439 \u0433\u043b\u0430\u0432\u0435 \u043c\u044b \u0440\u0430\u0437\u0431\u0435\u0440\u0435\u043c \u0434\u0432\u0430 \u043e\u0441\u043d\u043e\u0432\u043d\u044b\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c \u0432\u043e Flutter, \u0438\u0445 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b \u0438 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u0438, \u043a\u043e\u0433\u0434\u0430 \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043d\u0438\u0445 \u0431\u043b\u0435\u0441\u043d\u0435\u0442. \u0411\u0435\u0437 \u043f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u044f \u044d\u0442\u0438\u0445 \u043e\u0441\u043d\u043e\u0432 \u0434\u0432\u0438\u0433\u0430\u0442\u044c\u0441\u044f \u0434\u0430\u043b\u044c\u0448\u0435 \u0431\u0443\u0434\u0435\u0442 \u0441\u043b\u043e\u0436\u043d\u043e, \u0442\u0430\u043a \u0447\u0442\u043e \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u043e\u0441\u0432\u0435\u0436\u0438\u043c \u0438\u043b\u0438 \u0437\u0430\u043a\u0440\u0435\u043f\u0438\u043c \u0437\u043d\u0430\u043d\u0438\u044f.<\/p>\n<h4>1.1. \u0414\u0432\u0430 \u043a\u0438\u0442\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: \u041d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) vs. \u042f\u0432\u043d\u044b\u0435 (Explicit) \u2013 \u043a\u043e\u0433\u0434\u0430 \u0438 \u0447\u0442\u043e \u0432\u044b\u0431\u0438\u0440\u0430\u0442\u044c?<\/h4>\n<p>\u0412\u043e Flutter \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0434\u0432\u0430 \u0444\u0443\u043d\u0434\u0430\u043c\u0435\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u0430 \u043a \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439: \u043d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) \u0438 \u044f\u0432\u043d\u044b\u0435 (Explicit). \u041f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u0438\u0445 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u0439 \u0438 \u043e\u0431\u043b\u0430\u0441\u0442\u0435\u0439 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u2014 \u044d\u0442\u043e \u043f\u0435\u0440\u0432\u044b\u0439 \u0448\u0430\u0433 \u043a \u043c\u0430\u0441\u0442\u0435\u0440\u0441\u0442\u0432\u0443.<\/p>\n<p><strong>\u041e\u0441\u043d\u043e\u0432\u043d\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438:<\/strong> \u042d\u0442\u043e \u0441\u0430\u043c\u044b\u0439 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0435 \u0432\u00a0\u0432\u0430\u0448 UI. \u041e\u043d\u0438 \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u043f\u043e\u00a0\u043f\u0440\u0438\u043d\u0446\u0438\u043f\u0443 \u00ab\u043e\u043f\u0438\u0448\u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0438 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435, \u0430\u00a0\u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a \u0441\u0434\u0435\u043b\u0430\u0435\u0442 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u043e\u0435\u00bb. \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438, \u043a\u043e\u0433\u0434\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043e\u0434\u043d\u043e \u0438\u0437 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u043c\u044b\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430.. \u041a\u043b\u044e\u0447\u0435\u0432\u043e\u0435 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e \u2013 \u043f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u0438 \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u043a\u043e\u0434\u0430. \u0422\u0430\u043a\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0447\u0430\u0441\u0442\u043e \u043d\u0430\u0437\u044b\u0432\u0430\u044e\u0442 &#171;pre-programmed&#187;, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u0432\u0430\u043c \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043b\u043e\u0433\u0438\u043a\u0443 \u0441\u0430\u043c\u043e\u0439 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u041e\u043d\u0438 \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0442 \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u0442\u044b\u0445 UI-\u043e\u0442\u043a\u043b\u0438\u043a\u043e\u0432, \u043a\u043e\u0433\u0434\u0430 \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u043c. \u00a0 <\/p>\n<\/li>\n<li>\n<p><strong>\u042f\u0432\u043d\u044b\u0435 (Explicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438:<\/strong> \u0417\u0434\u0435\u0441\u044c \u0432\u044b \u0431\u0435\u0440\u0435\u0442\u0435 \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u0432 \u0441\u0432\u043e\u0438 \u0440\u0443\u043a\u0438. \u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0442\u0440\u0435\u0431\u0443\u044e\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043a\u043e\u0434\u0430, \u043d\u043e \u0432\u0437\u0430\u043c\u0435\u043d \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u0433\u0440\u0430\u043d\u0443\u043b\u044f\u0440\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u043a\u0430\u0436\u0434\u044b\u043c \u0430\u0441\u043f\u0435\u043a\u0442\u043e\u043c: \u0434\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e, \u043a\u0440\u0438\u0432\u043e\u0439 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c (\u0437\u0430\u043f\u0443\u0449\u0435\u043d\u0430, \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0430, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0435\u0442\u0441\u044f), \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e \u0438 \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0430\u0446\u0438\u0435\u0439 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439. \u0426\u0435\u043d\u0442\u0440\u0430\u043b\u044c\u043d\u044b\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0437\u0434\u0435\u0441\u044c \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0435\u0442  \u00a0 <\/p>\n<p><code>AnimationController<\/code>. \u041e\u043d\u0438 \u043d\u0435\u0437\u0430\u043c\u0435\u043d\u0438\u043c\u044b \u0434\u043b\u044f \u0441\u043b\u043e\u0436\u043d\u044b\u0445, \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0445 \u0445\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0439, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0438\u0445\u0441\u044f \u0446\u0438\u043a\u043b\u043e\u0432 \u0438\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0445 \u0436\u0435\u0441\u0442\u0430\u043c\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u00a0 <\/p>\n<\/li>\n<\/ul>\n<p><strong>\u041a\u043e\u0433\u0434\u0430 \u0447\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c:<\/strong><\/p>\n<ul>\n<li>\n<p><strong>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/strong> \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0442 \u0434\u043b\u044f:<\/p>\n<ul>\n<li>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043e\u0434\u043d\u043e\u0433\u043e \u0438\u043b\u0438 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430 \u043f\u0440\u0438 \u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0440\u0430\u0437\u043c\u0435\u0440, \u0446\u0432\u0435\u0442, \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043a\u043d\u043e\u043f\u043a\u0438 \u043f\u0440\u0438 \u043d\u0430\u0432\u0435\u0434\u0435\u043d\u0438\u0438 \u0438\u043b\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438).<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u043e\u0441\u0442\u044b\u0445 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u043c\u0435\u0436\u0434\u0443 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f\u043c\u0438 UI.<\/p>\n<\/li>\n<li>\n<p>\u0411\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f &#171;\u0436\u0438\u0432\u043e\u0441\u0442\u0438&#187; \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0443 \u0431\u0435\u0437 \u0433\u043b\u0443\u0431\u043e\u043a\u043e\u0433\u043e \u043f\u043e\u0433\u0440\u0443\u0436\u0435\u043d\u0438\u044f \u0432 \u043c\u0435\u0445\u0430\u043d\u0438\u043a\u0443 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<li>\n<p><strong>\u042f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/strong> \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u044b, \u043a\u043e\u0433\u0434\u0430:<\/p>\n<ul>\n<li>\n<p>\u041d\u0443\u0436\u043d\u0430 \u0441\u043b\u043e\u0436\u043d\u0430\u044f \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 (staggered animations).<\/p>\n<\/li>\n<li>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0434\u043e\u043b\u0436\u043d\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u0442\u044c\u0441\u044f \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u043e \u0438\u043b\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0440\u0430\u0437.<\/p>\n<\/li>\n<li>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439 \u043d\u0443\u0436\u043d\u043e \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e (\u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c, \u043e\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0442\u044c, \u043c\u0435\u043d\u044f\u0442\u044c \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432 \u043e\u0442\u0432\u0435\u0442 \u043d\u0430 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u0438\u0435 \u0441\u043e\u0431\u044b\u0442\u0438\u044f).<\/p>\n<\/li>\n<li>\n<p>\u0422\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439.<\/p>\n<\/li>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b, \u043d\u0435 \u043f\u043e\u043a\u0440\u044b\u0432\u0430\u0435\u043c\u044b\u0435 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u043c\u0438 \u043d\u0435\u044f\u0432\u043d\u044b\u043c\u0438 \u0432\u0438\u0434\u0436\u0435\u0442\u0430\u043c\u0438.<\/p>\n<\/li>\n<\/ul>\n<\/li>\n<\/ul>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0441\u0432\u0435\u0434\u0435\u043c \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0435 \u0440\u0430\u0437\u043b\u0438\u0447\u0438\u044f \u0432 \u0442\u0430\u0431\u043b\u0438\u0446\u0443 \u0434\u043b\u044f \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0441\u0442\u0438:<\/p>\n<p><strong>\u0422\u0430\u0431\u043b\u0438\u0446\u0430 1: \u0421\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u0435 \u041d\u0435\u044f\u0432\u043d\u044b\u0445 \u0438 \u042f\u0432\u043d\u044b\u0445 \u0410\u043d\u0438\u043c\u0430\u0446\u0438\u0439<\/strong><\/p>\n<div>\n<div class=\"table\">\n<table>\n<tbody>\n<tr>\n<td>\n<p align=\"left\">\u0425\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0430<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0435\u044f\u0432\u043d\u044b\u0435 (Implicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u042f\u0432\u043d\u044b\u0435 (Explicit) \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041f\u0440\u043e\u0441\u0442\u043e\u0442\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u044b\u0441\u043e\u043a\u0430\u044f, \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u043a\u043e\u0434\u0430  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u0440\u0435\u0434\u043d\u044f\u044f\/\u041d\u0438\u0437\u043a\u0430\u044f, \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0431\u043e\u043b\u044c\u0448\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0423\u0440\u043e\u0432\u0435\u043d\u044c \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041d\u0438\u0437\u043a\u0438\u0439, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u043c  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0412\u044b\u0441\u043e\u043a\u0438\u0439, \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c \u043d\u0430\u0434 \u0432\u0441\u0435\u043c\u0438 \u0430\u0441\u043f\u0435\u043a\u0442\u0430\u043c\u0438  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0431\u044a\u0435\u043c \u043a\u043e\u0434\u0430<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u0439  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0417\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0431\u043e\u043b\u044c\u0448\u0435<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u041e\u0441\u043d\u043e\u0432\u043d\u043e\u0439 \u043c\u0435\u0445\u0430\u043d\u0438\u0437\u043c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432 \u0432\u0438\u0434\u0436\u0435\u0442\u0430, <code>ImplicitlyAnimatedWidget<\/code><\/p>\n<\/td>\n<td>\n<p align=\"left\"><code>AnimationController<\/code>, <code>Tween<\/code>, <code>Curve<\/code>  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0417\u0430\u043f\u0443\u0441\u043a \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430  \u00a0 <\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u043d\u043e \u0447\u0435\u0440\u0435\u0437 <code>AnimationController<\/code> (e.g., <code>forward()<\/code>, <code>repeat()<\/code>)<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0422\u0438\u043f\u0438\u0447\u043d\u044b\u0435 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0438<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u041f\u0440\u043e\u0441\u0442\u044b\u0435 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044b \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0439, UI-\u043e\u0442\u043a\u043b\u0438\u043a\u0438 (\u0440\u0430\u0437\u043c\u0435\u0440, \u0446\u0432\u0435\u0442, \u043f\u043e\u0437\u0438\u0446\u0438\u044f)<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0421\u043b\u043e\u0436\u043d\u044b\u0435 \u0445\u043e\u0440\u0435\u043e\u0433\u0440\u0430\u0444\u0438\u0438, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0438\u0435\u0441\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u043c\u044b\u0435 \u0436\u0435\u0441\u0442\u0430\u043c\u0438<\/p>\n<\/td>\n<\/tr>\n<tr>\n<td>\n<p align=\"left\"><strong>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c<\/strong><\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0410\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a\u043e\u043c<\/p>\n<\/td>\n<td>\n<p align=\"left\">\u0420\u0443\u0447\u043d\u043e\u0435 \u0447\u0435\u0440\u0435\u0437 <code>AnimationController<\/code>  \u00a0 <\/p>\n<\/td>\n<\/tr>\n<\/tbody>\n<\/table>\n<\/div>\n<\/div>\n<p>\u041c\u043d\u043e\u0433\u0438\u0435 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0438, \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u043d\u043e\u0432\u0438\u0447\u043a\u0438, \u043d\u0430\u0447\u0438\u043d\u0430\u044e\u0442 \u0441\u0432\u043e\u0439 \u043f\u0443\u0442\u044c \u0432 \u043c\u0438\u0440 Flutter-\u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0441 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a <code>AnimatedContainer<\/code>. \u042d\u0442\u043e \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e, \u0432\u0435\u0434\u044c \u043e\u043d\u0438 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0432\u0438\u0434\u0438\u043c\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0441 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u0443\u0441\u0438\u043b\u0438\u044f\u043c\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u043f\u043e \u043c\u0435\u0440\u0435 \u0440\u043e\u0441\u0442\u0430 \u0441\u043b\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0437\u0430\u0434\u0430\u0447 \u0438 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u043e\u0432\u0435\u043d\u0438\u044f \u043f\u043e\u0442\u0440\u0435\u0431\u043d\u043e\u0441\u0442\u0438 \u0432 \u0431\u043e\u043b\u0435\u0435 \u0442\u043e\u043d\u043a\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043a \u044f\u0432\u043d\u044b\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043d\u0435\u0438\u0437\u0431\u0435\u0436\u043d\u044b\u043c. \u042d\u0442\u043e \u0441\u0432\u043e\u0435\u0433\u043e \u0440\u043e\u0434\u0430 \u044d\u0432\u043e\u043b\u044e\u0446\u0438\u043e\u043d\u043d\u044b\u0439 \u043f\u0443\u0442\u044c: \u043e\u0442 \u0432\u044b\u0441\u043e\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u0445 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0446\u0438\u0439, \u0441\u043a\u0440\u044b\u0432\u0430\u044e\u0449\u0438\u0445 \u0434\u0435\u0442\u0430\u043b\u0438 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u043a \u0431\u043e\u043b\u0435\u0435 \u043d\u0438\u0437\u043a\u043e\u0443\u0440\u043e\u0432\u043d\u0435\u0432\u044b\u043c \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442\u0430\u043c, \u0434\u0430\u044e\u0449\u0438\u043c \u043f\u043e\u043b\u043d\u044b\u0439 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044c. \u041f\u043e\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043e\u0431\u043e\u0438\u0445 \u043f\u043e\u0434\u0445\u043e\u0434\u043e\u0432 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u044b\u0431\u0438\u0440\u0430\u0442\u044c \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0438\u0439 \u0438\u043d\u0441\u0442\u0440\u0443\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0439 \u0437\u0430\u0434\u0430\u0447\u0438, \u0430 \u043d\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043e\u0434\u043d\u0438\u043c, \u043f\u0443\u0441\u0442\u044c \u0438 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u044b\u043c, \u0440\u0435\u0448\u0435\u043d\u0438\u0435\u043c. \u0421\u0430\u043c \u0444\u0440\u0435\u0439\u043c\u0432\u043e\u0440\u043a Flutter \u0441\u043f\u0440\u043e\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u0430\u043d \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434. \u041f\u043e\u043c\u043d\u044e, \u043a\u0430\u043a \u0441\u0430\u043c \u043d\u0430\u0447\u0438\u043d\u0430\u043b:  \u00a0 <\/p>\n<p><code>AnimatedContainer<\/code> \u043a\u0430\u0437\u0430\u043b\u0441\u044f \u043c\u0430\u0433\u0438\u0435\u0439! \u041d\u043e \u043f\u043e\u0442\u043e\u043c \u0437\u0430\u0445\u043e\u0442\u0435\u043b\u043e\u0441\u044c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0447\u0442\u043e-\u0442\u043e \u044d\u0434\u0430\u043a\u043e\u0435, \u0438 \u043f\u0440\u0438\u0448\u043b\u043e\u0441\u044c \u043d\u044b\u0440\u044f\u0442\u044c \u0432 <code>AnimationController<\/code>. \u042d\u0442\u043e \u043a\u0430\u043a \u0441 \u0430\u0432\u0442\u043e\u043c\u043e\u0431\u0438\u043b\u0435\u043c: \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0430\u0432\u0442\u043e\u043c\u0430\u0442, \u043f\u043e\u0442\u043e\u043c \u2013 \u043c\u0435\u0445\u0430\u043d\u0438\u043a\u0430 \u0434\u043b\u044f \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u0434\u0440\u0430\u0439\u0432\u0430.<\/p>\n<h4>1.2. \u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438: \u041c\u0430\u0433\u0438\u044f &#171;\u0438\u0437 \u043a\u043e\u0440\u043e\u0431\u043a\u0438&#187;<\/h4>\n<p>\u041d\u0435\u044f\u0432\u043d\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u2014 \u044d\u0442\u043e \u0445\u043b\u0435\u0431 \u0441 \u043c\u0430\u0441\u043b\u043e\u043c \u0434\u043b\u044f \u0431\u044b\u0441\u0442\u0440\u043e\u0433\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u0441\u0442\u044b\u0445, \u043d\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u043d\u044b\u0445 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u0432 \u0432 \u0432\u0430\u0448\u0435\u043c \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. Flutter \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0446\u0435\u043b\u044b\u0439 \u043d\u0430\u0431\u043e\u0440 \u0433\u043e\u0442\u043e\u0432\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0435\u043b\u0430\u044e\u0442 \u044d\u0442\u0443 \u0437\u0430\u0434\u0430\u0447\u0443 \u0442\u0440\u0438\u0432\u0438\u0430\u043b\u044c\u043d\u043e\u0439.<\/p>\n<p><strong>\u041e\u0431\u0437\u043e\u0440 <\/strong><code><strong>ImplicitlyAnimatedWidget<\/strong><\/code><\/p>\n<p>\u0412 \u043e\u0441\u043d\u043e\u0432\u0435 \u0432\u0441\u0435\u0445 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432 \u043b\u0435\u0436\u0438\u0442 \u0430\u0431\u0441\u0442\u0440\u0430\u043a\u0442\u043d\u044b\u0439 \u043a\u043b\u0430\u0441\u0441 <code>ImplicitlyAnimatedWidget<\/code>. \u041e\u043d \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442 \u043e\u0431\u0449\u0438\u0439 \u043a\u043e\u043d\u0442\u0440\u0430\u043a\u0442 \u0434\u043b\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044e\u0442 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u0432\u043e\u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u043c\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u044b \u0431\u0443\u0434\u0435\u0442\u0435 \u0432\u0441\u0442\u0440\u0435\u0447\u0430\u0442\u044c \u0443 \u0435\u0433\u043e \u043f\u043e\u0442\u043e\u043c\u043a\u043e\u0432, \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f: \u00a0 <\/p>\n<ul>\n<li>\n<p><code>duration<\/code>: \u041e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u0430\u043a \u0434\u043e\u043b\u0433\u043e \u0431\u0443\u0434\u0435\u0442 \u0434\u043b\u0438\u0442\u044c\u0441\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f. \u042d\u0442\u043e \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440.<\/p>\n<\/li>\n<li>\n<p><code>curve<\/code>: \u0417\u0430\u0434\u0430\u0435\u0442 \u043a\u0440\u0438\u0432\u0443\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0442\u043e \u0435\u0441\u0442\u044c \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438 (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u043b\u0430\u0432\u043d\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e \u0438 \u043a\u043e\u043d\u0435\u0446, \u043e\u0442\u0441\u043a\u043e\u043a \u0438 \u0442.\u0434.). \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f <code>Curves.linear<\/code>. \u00a0 <\/p>\n<\/li>\n<li>\n<p><code>onEnd<\/code>: \u041a\u043e\u043b\u0431\u044d\u043a, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.<\/p>\n<\/li>\n<\/ul>\n<p> \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u0432\u043e\u0434\u0438\u0442 \u0441\u043f\u0438\u0441\u043e\u043a \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u043a\u0440\u0438\u0432\u044b\u0445, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b\u0445 \u0447\u0435\u0440\u0435\u0437 \u043a\u043b\u0430\u0441\u0441  <code>Curves<\/code>, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a <code>easeIn<\/code> (\u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e, \u0437\u0430\u0442\u0435\u043c \u0443\u0441\u043a\u043e\u0440\u0435\u043d\u0438\u0435), <code>easeOut<\/code> (\u0431\u044b\u0441\u0442\u0440\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e, \u0437\u0430\u0442\u0435\u043c \u0437\u0430\u043c\u0435\u0434\u043b\u0435\u043d\u0438\u0435), <code>easeInOut<\/code> (\u043c\u0435\u0434\u043b\u0435\u043d\u043d\u043e\u0435 \u043d\u0430\u0447\u0430\u043b\u043e \u0438 \u043a\u043e\u043d\u0435\u0446), <code>bounceIn<\/code> (\u044d\u0444\u0444\u0435\u043a\u0442 \u043e\u0442\u0441\u043a\u043e\u043a\u0430 \u043f\u0440\u0438 \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0438) \u0438 \u043c\u043d\u043e\u0433\u0438\u0435 \u0434\u0440\u0443\u0433\u0438\u0435. \u0412\u044b\u0431\u043e\u0440 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u043e\u0439 \u043a\u0440\u0438\u0432\u043e\u0439 \u043c\u043e\u0436\u0435\u0442 \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u043f\u043e\u0432\u043b\u0438\u044f\u0442\u044c \u043d\u0430 \u0432\u043e\u0441\u043f\u0440\u0438\u044f\u0442\u0438\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.<\/p>\n<p><strong>\u0420\u0430\u0437\u0431\u043e\u0440: <\/strong><code><strong>AnimatedContainer<\/strong><\/code><strong>, <\/strong><code><strong>AnimatedOpacity<\/strong><\/code><strong>, <\/strong><code><strong>AnimatedPositioned<\/strong><\/code><strong> <\/strong><\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043f\u0443\u043b\u044f\u0440\u043d\u044b\u0435 \u043d\u0435\u044f\u0432\u043d\u044b\u0435 \u0432\u0438\u0434\u0436\u0435\u0442\u044b:<\/p>\n<ul>\n<li>\n<p><code><strong>AnimatedContainer<\/strong><\/code>: \u041f\u043e\u0436\u0430\u043b\u0443\u0439, \u043e\u0434\u0438\u043d \u0438\u0437 \u0441\u0430\u043c\u044b\u0445 \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c\u044b\u0445. \u042d\u0442\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u043e\u0431\u044b\u0447\u043d\u043e\u0433\u043e <code>Container<\/code>. \u041e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u043b\u0430\u0432\u043d\u044b\u0439 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043c\u0435\u0436\u0434\u0443 \u0441\u0442\u0430\u0440\u044b\u043c\u0438 \u0438 \u043d\u043e\u0432\u044b\u043c\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f\u043c\u0438 \u0442\u0430\u043a\u0438\u0445 \u0441\u0432\u043e\u0439\u0441\u0442\u0432, \u043a\u0430\u043a <code>width<\/code>, <code>height<\/code>, <code>color<\/code>, <code>padding<\/code>, <code>margin<\/code>, <code>decoration<\/code> (\u0432\u043a\u043b\u044e\u0447\u0430\u044f <code>borderRadius<\/code>, <code>boxShadow<\/code>, <code>gradient<\/code>), <code>transform<\/code> \u0438 <code>alignment<\/code> \u043f\u0440\u0438 \u0438\u0445 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0432 <code>setState<\/code>. \u0421\u0443\u0442\u044c \u0435\u0433\u043e \u0440\u0430\u0431\u043e\u0442\u044b \u0432 \u0442\u043e\u043c, \u0447\u0442\u043e \u043a\u043e\u0433\u0434\u0430  <code>AnimatedContainer<\/code> \u043f\u0435\u0440\u0435\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0441 \u043d\u043e\u0432\u044b\u043c\u0438 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u043c\u0438, \u043e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u043f\u0435\u0440\u0435\u0445\u043e\u0434 \u043e\u0442 \u0441\u0442\u0430\u0440\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043a \u043d\u043e\u0432\u044b\u043c. \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedContainer class MyAnimatedContainerWidget extends StatefulWidget {   const MyAnimatedContainerWidget({super.key});    @override   State&lt;MyAnimatedContainerWidget&gt; createState() =&gt; _MyAnimatedContainerWidgetState(); }  class _MyAnimatedContainerWidgetState extends State&lt;MyAnimatedContainerWidget&gt; {   bool _selected = false;    @override   Widget build(BuildContext context) {     return GestureDetector(       onTap: () {         setState(() {           _selected =!_selected;         });       },       child: Center(         child: AnimatedContainer(           width: _selected? 200.0 : 100.0,           height: _selected? 100.0 : 200.0,           color: _selected? Colors.blueGrey : Colors.white,           alignment: _selected? Alignment.center : AlignmentDirectional.topCenter,           duration: const Duration(seconds: 1),           curve: Curves.fastOutSlowIn,           child: const FlutterLogo(size: 75),         ),       ),     );   } } <\/code><\/pre>\n<\/li>\n<li>\n<p><code><strong>AnimatedOpacity<\/strong><\/code>: \u041f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u044c (\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e <code>opacity<\/code>) \u0441\u0432\u043e\u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435  \u00a0 <\/p>\n<p><code>opacity<\/code> \u0432\u0430\u0440\u044c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u043e\u0442 0.0 (\u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439) \u0434\u043e 1.0 (\u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043d\u0435\u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439). \u041e\u0442\u043b\u0438\u0447\u043d\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0438\u0442 \u0434\u043b\u044f \u043f\u043b\u0430\u0432\u043d\u043e\u0433\u043e \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u044f \u0438\u043b\u0438 \u0438\u0441\u0447\u0435\u0437\u043d\u043e\u0432\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedOpacity class MyAnimatedOpacityWidget extends StatefulWidget {   const MyAnimatedOpacityWidget({super.key});    @override   State&lt;MyAnimatedOpacityWidget&gt; createState() =&gt; _MyAnimatedOpacityWidgetState(); }  class _MyAnimatedOpacityWidgetState extends State&lt;MyAnimatedOpacityWidget&gt; {   double _opacityLevel = 1.0;    void _fade() {     setState(() =&gt; _opacityLevel = _opacityLevel == 0? 1.0 : 0.0);   }    @override   Widget build(BuildContext context) {     return Column(       mainAxisAlignment: MainAxisAlignment.center,       children: &lt;Widget&gt;,     );   } } <\/code><\/pre>\n<\/li>\n<li>\n<p><code><strong>AnimatedPositioned<\/strong><\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u0432\u0435\u0440\u0441\u0438\u044f \u0432\u0438\u0434\u0436\u0435\u0442\u0430 <code>Positioned<\/code>. \u0418\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043f\u043e\u0437\u0438\u0446\u0438\u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0436\u0435\u0442\u0430 (\u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430 <code>left<\/code>, <code>top<\/code>, <code>right<\/code>, <code>bottom<\/code>, <code>width<\/code>, <code>height<\/code>) \u0432\u043d\u0443\u0442\u0440\u0438 <code>Stack<\/code>. \u0412\u0430\u0436\u043d\u043e \u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u0447\u0442\u043e  \u00a0 <\/p>\n<p><code>AnimatedPositioned<\/code> \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043a\u0430\u043a \u043f\u0440\u044f\u043c\u043e\u0439 \u043f\u043e\u0442\u043e\u043c\u043e\u043a <code>Stack<\/code>. \u00a0 <\/p>\n<pre><code class=\"dart\">\/\/ \u041f\u0440\u0438\u043c\u0435\u0440 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f AnimatedPositioned class MyAnimatedPositionedWidget extends StatefulWidget {   const MyAnimatedPositionedWidget({super.key});    @override   State&lt;MyAnimatedPositionedWidget&gt; createState() =&gt; _MyAnimatedPositionedWidgetState(); }  class _MyAnimatedPositionedWidgetState extends State&lt;MyAnimatedPositionedWidget&gt; {   bool _selected = false;    @override   Widget build(BuildContext context) {     return SizedBox(       width: 200,       height: 350,       child: Stack(         children: &lt;Widget&gt;,       ),     );   } } <\/code><\/pre>\n<\/li>\n<\/ul>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0434\u0440\u0443\u0433\u0438\u0445 \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u0445 \u043d\u0435\u044f\u0432\u043d\u044b\u0445 \u0432\u0438\u0434\u0436\u0435\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a:<\/p>\n<ul>\n<li>\n<p><code>AnimatedAlign<\/code>: \u0410\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 <\/p>\n<\/li>\n<\/ul>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n","protected":false},"author":1,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[],"tags":[],"class_list":["post-463561","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/463561","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=463561"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/463561\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=463561"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=463561"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=463561"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}