{"id":350354,"date":"2023-07-17T15:01:31","date_gmt":"2023-07-17T15:01:31","guid":{"rendered":"http:\/\/savepearlharbor.com\/?p=350354"},"modified":"-0001-11-30T00:00:00","modified_gmt":"-0001-11-29T21:00:00","slug":"","status":"publish","type":"post","link":"https:\/\/savepearlharbor.com\/?p=350354","title":{"rendered":"<span>\u0427\u0442\u043e \u043d\u043e\u0432\u043e\u0433\u043e \u0432 SwiftUI \u0434\u043b\u044f iOS 17?<\/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>SwiftUI \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u0438 \u0432 \u044d\u0442\u043e\u043c \u0433\u043e\u0434\u0443 \u043c\u044b \u0432\u0438\u0434\u0438\u043c \u043e\u0433\u0440\u043e\u043c\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0439 \u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0435, \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u043d\u043e\u0432\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b SF Symbols, \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u0443\u044e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal \u0438 \u043c\u043d\u043e\u0433\u043e\u0435 \u0434\u0440\u0443\u0433\u043e\u0435.<\/p>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0432 \u044d\u0442\u043e\u043c \u0440\u0435\u043b\u0438\u0437\u0435 \u0438\u0437 \u0447\u0438\u0441\u043b\u0430 \u0442\u0435\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0430\u0432\u0442\u043e\u0440 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u043b \u043b\u0438\u0447\u043d\u043e. \u0421\u0440\u0435\u0434\u0438 \u043d\u0438\u0445 &#8212; \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal, \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435 \u0440\u0430\u0431\u043e\u0442\u044b\u00a0<code>Color<\/code>\u00a0\u0441\u00a0<code>Codable<\/code>, \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u044f \u043f\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0438 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0434\u0430\u0435\u0442 \u043d\u0430\u043c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0433\u0440\u0430\u0434\u0438\u0435\u043d\u0442\u044b. \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u0435\u0449\u0451 \u043c\u043e\u0436\u0435\u043c \u0441\u043a\u0440\u0443\u0433\u043b\u044f\u0442\u044c \u0443\u0433\u043b\u044b \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 \u043f\u043e \u0441\u0432\u043e\u0435\u043c\u0443 \u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u0438\u044e. \u0422\u043e\u043b\u044c\u043a\u043e \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u043f\u0435\u0440\u0432\u043e\u0439 \u0431\u0435\u0442\u0430-\u0432\u0435\u0440\u0441\u0438\u0438 \u0430\u0432\u0442\u043e\u0440 \u0437\u0430\u043a\u0440\u044b\u043b \u043a\u0430\u043a \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u0434\u044e\u0436\u0438\u043d\u0443 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0435\u043d\u0438\u0439!<\/p>\n<h3>\u041d\u0430\u0431\u043e\u0440 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0439 \u0434\u043b\u044f ScrollView<\/h3>\n<h4>\u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 ScrollView \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c \u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c<\/h4>\n<p>\u0412 SwiftUI \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u0432\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u043f\u043b\u0430\u0432\u043d\u043e, \u043d\u043e \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432\u00a0<code>scrollTargetLayout()<\/code>\u00a0\u0438\u00a0<code>scrollTargetBehavior()<\/code>\u00a0\u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u043b\u0441\u044f&#187; \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c \u0438\u043b\u0438 \u0446\u0435\u043b\u044b\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c.<\/p>\n<p>\u041f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 10 \u0441\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432 \u0432 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0439 ScrollView, \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0431\u0443\u0434\u0435\u0442 \u0446\u0435\u043b\u0435\u0432\u044b\u043c \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0435. \u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443\u00a0<code>.scrollTargetBehavior()<\/code>\u00a0\u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d \u043a\u0430\u043a\u00a0<code>.viewAligned<\/code>, SwiftUI \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0431\u0443\u0434\u0435\u0442 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f&#187; \u043a \u043a\u0430\u0436\u0434\u043e\u043c\u0443 \u0438\u0437 \u0441\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     var body: some View {         ScrollView(.horizontal) {             LazyHStack {                 ForEach(0..&lt;10) { index in                     RoundedRectangle(cornerRadius: 25)                         .fill(Color(hue: Double(index) \/ 10, saturation: 1, brightness: 1).gradient)                         .frame(width: 300, height: 100)                 }             }             .scrollTargetLayout()         }         .scrollTargetBehavior(.viewAligned)         .safeAreaPadding(.horizontal, 40)     } }<\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/006\/5fe\/4ff\/0065fe4ffb46e6142168d5f492c83a77.webp\" width=\"772\" height=\"308\"\/><\/figure>\n<p>\u041f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u00a0<code>scrollTargetLayout()<\/code>, \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 \u0441\u0442\u0430\u043d\u043e\u0432\u044f\u0442\u0441\u044f \u0446\u0435\u043b\u044f\u043c\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u043a \u043a\u043e\u0442\u043e\u0440\u044b\u043c ScrollView \u043c\u043e\u0436\u0435\u0442 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f&#187;. \u0415\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u043b\u0430\u0441\u044c&#187; \u0442\u043e\u043b\u044c\u043a\u043e \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c, \u0442\u043e \u0432\u043c\u0435\u0441\u0442\u043e\u00a0<code>scrollTargetLayout()<\/code>\u00a0\u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u00a0<code>scrollTarget()<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<p>\u0415\u0441\u0442\u044c \u0438 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u2014\u00a0<code>.paging<\/code>. \u042d\u0442\u043e\u0442 \u0440\u0435\u0436\u0438\u043c \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 ScrollView \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0442\u044c\u0441\u044f \u0440\u043e\u0432\u043d\u043e \u043d\u0430 \u0448\u0438\u0440\u0438\u043d\u0443 \u0438\u043b\u0438 \u0432\u044b\u0441\u043e\u0442\u0443 \u044d\u043a\u0440\u0430\u043d\u0430, \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .font(.largeTitle)             .frame(maxWidth: .infinity)             .frame(height: 200)             .background(.blue)             .foregroundStyle(.white)             .clipShape(.rect(cornerRadius: 20))     } } .scrollTargetBehavior(.paging)<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f ScrollView, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 50 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0442\u0438\u043f\u0430\u00a0<code>Text<\/code>, \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u043f\u043e\u043b\u043d\u0443\u044e \u0448\u0438\u0440\u0438\u043d\u0443 \u044d\u043a\u0440\u0430\u043d\u0430. \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u00a0<code>.scrollTargetBehavior(.paging)<\/code>\u00a0\u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u0440\u043e\u0432\u043d\u043e \u043d\u0430 \u043e\u0434\u0438\u043d \u044d\u043a\u0440\u0430\u043d \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0438:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6a7\/3bd\/120\/6a73bd12098d939f6818b5944e699e19.gif\" width=\"636\" height=\"1274\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6a7\/3bd\/120\/6a73bd12098d939f6818b5944e699e19.gif\"\/><\/figure>\n<h4>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u043c\u0438 ScrollView<\/h4>\n<p>\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u0432 SwiftUI \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043e\u0431\u0440\u0435\u0437\u0430\u0435\u0442 \u0441\u0432\u043e\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435, \u0447\u0442\u043e\u0431\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0441\u0442\u0430\u0432\u0430\u043b\u0438\u0441\u044c \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u043d\u0443\u0442\u0440\u0438 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430. \u041e\u0434\u043d\u0430\u043a\u043e, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u00a0<code>scrollClipDisabled()<\/code>, \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c, \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0432 \u043e\u0431\u0440\u0435\u0437\u043a\u0443 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e<\/strong>: \u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u043d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043a\u0430\u0441\u0430\u043d\u0438\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u0442.\u0435. \u043e\u0431\u043b\u0430\u0441\u0442\u044c \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u0432 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u0445\u00a0<code>ScrollView<\/code>. \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u043a\u043e\u0433\u0434\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438\u00a0<code>ScrollView<\/code>, \u0432\u0441\u0435 \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u043f\u043e \u044d\u0442\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043d\u0438\u043c\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432\u044b\u0445\u043e\u0434\u044f\u0442 \u0437\u0430 \u0433\u0440\u0430\u043d\u0438\u0446\u044b\u00a0<code>ScrollView<\/code>\u00a0\u0438\u0437-\u0437\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f\u00a0<code>scrollClipDisabled()<\/code>, \u043b\u044e\u0431\u044b\u0435 \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u043f\u043e &#171;\u0432\u044b\u043f\u0430\u0432\u0448\u0438\u043c&#187; \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c \u043d\u0435 \u0431\u0443\u0434\u0443\u0442 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043d\u0438\u043c\u0438. \u0412\u043c\u0435\u0441\u0442\u043e \u044d\u0442\u043e\u0433\u043e, \u044d\u0442\u0438 \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u0431\u0443\u0434\u0443\u0442 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u0442\u0435\u043c, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e\u0434 \u044d\u0442\u0438\u043c\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438.<\/p>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0445\u043e\u0442\u044f\u00a0<code>scrollClipDisabled()<\/code>\u00a0\u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u043c \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u0442\u0435\u043d\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u044b\u0445\u043e\u0434\u044f\u0442 \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0435\u0433\u043e \u0441\u0442\u043e\u0438\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441 \u043e\u0441\u0442\u043e\u0440\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u0412 \u0447\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438, \u0435\u0441\u043b\u0438 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0432\u043d\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0438 \u0441\u0442\u0430\u043d\u043e\u0432\u044f\u0442\u0441\u044f \u043d\u0435\u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u044b\u043c\u0438, \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c \u0441 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u043e\u043f\u044b\u0442\u043e\u043c.<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c c\u00a0<code>VStack<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0441\u0432\u0435\u0440\u0445\u0443 \u0438 \u0441\u043d\u0438\u0437\u0443 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u044b \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u044b\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0430 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438 &#8212; \u043e\u0431\u043b\u0430\u0441\u0442\u044c \u0441 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u043e\u0439. \u041f\u0440\u0438 \u043d\u0430\u0447\u0430\u043b\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u044d\u0442\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0443\u0434\u0443\u0442 \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0442\u044c\u0441\u044f \u043f\u0440\u044f\u043c\u043e \u043f\u043e\u0434 \u0432\u0435\u0440\u0445\u043d\u0438\u043c \u0442\u0435\u043a\u0441\u0442\u043e\u043c, \u043d\u043e \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043e\u043d\u0438 \u0441\u043c\u043e\u0433\u0443\u0442 \u0432\u044b\u0445\u043e\u0434\u0438\u0442\u044c \u0437\u0430 \u0435\u0433\u043e \u0433\u0440\u0430\u043d\u0438\u0446\u044b:<\/p>\n<pre><code class=\"swift\">VStack {     Text(\"Fixed at the top\")         .frame(maxWidth: .infinity)         .frame(height: 100)         .background(.green)         .foregroundStyle(.white)      ScrollView {         ForEach(0..&lt;5) { _ in             Text(\"Scrolling\")                 .frame(maxWidth: .infinity)                 .frame(height: 200)                 .background(.blue)                 .foregroundStyle(.white)         }     }     .scrollClipDisabled()      Text(\"Fixed at the bottom\")         .frame(maxWidth: .infinity)         .frame(height: 100)         .background(.green)         .foregroundStyle(.white) }<\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/37c\/d70\/fba\/37cd70fba19da6e62b8c07f2018eba35.gif\" width=\"1294\" height=\"632\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/37c\/d70\/fba\/37cd70fba19da6e62b8c07f2018eba35.gif\"\/><\/figure>\n<p>\u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c <code>scrollClipDisabled()<\/code> \u0432\u0430\u0436\u043d\u043e \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043e \u0434\u0432\u0443\u0445 \u0432\u0435\u0449\u0430\u0445:<\/p>\n<ol>\n<li>\n<p>\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u0434\u0430\u0442\u044c \u0441\u0432\u043e\u044e \u0444\u043e\u0440\u043c\u0443 \u043e\u0431\u0440\u0435\u0437\u043a\u0438, \u0447\u0442\u043e\u0431\u044b \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0434\u0430\u043b\u0435\u043a\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0431\u0443\u0434\u0443\u0442 \u0432\u044b\u0445\u043e\u0434\u0438\u0442\u044c \u0437\u0430 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 <code>padding()<\/code> \u0432\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0435 \u0444\u043e\u0440\u043c\u0443 \u043e\u0431\u0440\u0435\u0437\u043a\u0438 \u0432 \u0432\u0438\u0434\u0435 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 <code>clipShape(.rect)<\/code>, \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0435 \u0431\u0443\u0434\u0443\u0442 &#171;\u0432\u044b\u043f\u0430\u0434\u0430\u0442\u044c&#187; \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0442\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0433\u0443\u0442 \u043f\u0435\u0440\u0435\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u043e\u043a\u0440\u0443\u0436\u0430\u044e\u0449\u0438\u0435 \u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0432\u0430\u043c \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>zIndex()<\/code> \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u043a\u0438 \u0438\u0445 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0439 Z-\u0438\u043d\u0434\u0435\u043a\u0441, \u0442\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 <code>zIndex(1)<\/code> \u043a ScrollView \u0437\u0430\u0441\u0442\u0430\u0432\u0438\u0442 \u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u0432\u0435\u0440\u0445 \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<h4>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0432 ScrollView \u0441 \u043a\u043e\u043d\u0446\u0430<\/h4>\n<p>\u0412 SwiftUI \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0443 \u0441\u0432\u0435\u0440\u0445\u0443. \u041e\u0434\u043d\u0430\u043a\u043e \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u044b\u0439 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044e &#171;\u0421\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f&#187; \u043e\u0442 Apple, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c ScrollView \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u043d\u0430\u0447\u0438\u043d\u0430\u043b\u0430\u0441\u044c \u0441\u043d\u0438\u0437\u0443. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollPosition()<\/code> \u0441 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u043e\u0439 \u043a \u043d\u0438\u0436\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 (<code>.bottom<\/code>).<\/p>\n<p>\u041d\u0438\u0436\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d \u043f\u0440\u0438\u043c\u0435\u0440, \u0433\u0434\u0435 \u0432 ScrollView \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u044b 50 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432. \u0417\u0434\u0435\u0441\u044c \u0443\u043a\u0430\u0437\u0430\u043d\u043e, \u0447\u0442\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c\u0441\u044f \u0441\u043d\u0438\u0437\u0443, \u0430 \u043d\u0435 \u0441\u0432\u0435\u0440\u0445\u0443:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)             .padding()             .background(.blue)             .clipShape(.rect(cornerRadius: 25))     } } .scrollPosition(initialAnchor: .bottom)<\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7d9\/4aa\/8ff\/7d94aa8ffaa2a0732d4e729b9f4b462a.webp\" width=\"835\" height=\"417\"\/><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0430\u0448 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043a\u0430\u043a\u0438\u043c-\u0442\u043e \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0431\u0435\u0437 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f &#8212; \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0430 \u0438\u043b\u0438 \u0432\u044b \u043c\u0435\u043d\u044f\u0435\u0442\u0435 \u0440\u0430\u0437\u043c\u0435\u0440 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0442\u043e \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u043f\u0440\u0438\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u043d\u043e\u0439 \u043a \u043d\u0438\u0436\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u043c\u0435\u043d\u044f\u0435\u0442 \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u043e\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u0441\u0432\u043e\u0431\u043e\u0434\u043d\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u043e.<\/p>\n<p><strong>\u0421\u043e\u0432\u0435\u0442<\/strong>: \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 <code>initialAnchor<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043b\u044e\u0431\u0443\u044e \u0442\u043e\u0447\u043a\u0443 \u0442\u0438\u043f\u0430 <code>UnitPoint<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>.trailing<\/code> \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0441 \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u043a\u0440\u0430\u044f \u0438\u043b\u0438 \u043b\u044e\u0431\u043e\u0435 \u0442\u043e\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<h4>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0438\u043b\u0438 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0432 ScrollView<\/h4>\n<p>\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u0432 SwiftUI \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u0432\u043e\u0435\u043c\u0443 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u043c\u0443 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0442\u044c \u0432\u0441\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e, \u0430 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0430\u043a\u043a\u0443\u0440\u0430\u0442\u043d\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u043a\u0440\u0430\u044e \u044d\u043a\u0440\u0430\u043d\u0430. \u041e\u0434\u043d\u0430\u043a\u043e, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u00a0<code>contentMargins()<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0438\u043b\u0438 \u043f\u043e\u043b\u043e\u0441 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 &#8212; \u043d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0443\u0433\u043e\u0434\u043d\u043e \u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u0438 \u043f\u043e \u043b\u044e\u0431\u044b\u043c \u043a\u0440\u0430\u044f\u043c.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u043d\u043e\u0441\u0438\u0442 \u043e\u0442\u0441\u0442\u0443\u043f \u0432 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043d\u0430 50 \u043f\u043e\u0438\u043d\u0442\u043e\u0432 \u0441 \u043a\u0430\u0436\u0434\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u043d\u0435 \u043c\u0435\u043d\u044f\u044f \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)             .foregroundStyle(.white)             .background(.blue)     } } .contentMargins(50, for: .scrollContent)<\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/8dd\/8e8\/990\/8dd8e8990731e5d43497768bbbcda5c5.png\" width=\"837\" height=\"487\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8dd\/8e8\/990\/8dd8e8990731e5d43497768bbbcda5c5.png\"\/><\/figure>\n<p>\u0422\u0430\u043a\u0438\u043c \u0436\u0435 \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0442\u0440\u0435\u0433\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u0443 \u043e\u0442\u0441\u0442\u0443\u043f\u0430 \u0434\u043b\u044f \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 ScrollView, \u043b\u0438\u0431\u043e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e, \u043b\u0438\u0431\u043e \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u0440\u0435\u0433\u0443\u043b\u0438\u0440\u043e\u0432\u043a\u043e\u0439 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u043e\u0442\u0441\u0442\u0443\u043f\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e.<\/p>\n<p>\u041a\u0430\u043a \u0438 \u0440\u0430\u043d\u0435\u0435, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0432\u0441\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u0441\u0440\u0430\u0437\u0443 \u0438\u043b\u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u044b. \u0422\u0430\u043a, \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0442\u0441\u0442\u0443\u043f \u0432 100 \u043f\u043e\u0438\u043d\u0442\u043e\u0432 \u0441\u0432\u0435\u0440\u0445\u0443 \u0434\u043b\u044f \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u0430 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u0431\u0435\u0437 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)             .background(.blue)             .foregroundStyle(.white)     } } .contentMargins(.top, 100, for: .scrollIndicators) <\/code><\/pre>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e (content margins) \u0432\u043c\u0435\u0441\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e padding (\u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0439 \u043e\u0442\u0441\u0442\u0443\u043f) \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u0430\u0448\u0435\u043c\u0443 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u043c\u0443 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043e\u0442 \u043a\u0440\u0430\u044f \u0434\u043e \u043a\u0440\u0430\u044f \u043f\u0440\u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u043d\u0438\u043c, \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044f \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430 \u0434\u043b\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 &#8212; \u044d\u0442\u043e \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u0431\u043e\u043b\u0435\u0435 \u0443\u0434\u0430\u0447\u043d\u0430\u044f \u043e\u043f\u0446\u0438\u044f, \u0447\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 padding.<\/p>\n<p>\u0412 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 SwiftUI, padding \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u043c\u0443 \u043e\u0442\u0441\u0442\u0443\u043f\u0443 \u0432\u043e\u043a\u0440\u0443\u0433 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440 \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u0435\u0433\u043e \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f. \u0421 \u0434\u0440\u0443\u0433\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0438\u043b\u0438 content margins \u043e\u0442\u043d\u043e\u0441\u044f\u0442\u0441\u044f \u043a \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0443, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438. \u042d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u043c\u0443 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f &#171;\u043e\u0442 \u043a\u0440\u0430\u044f \u0434\u043e \u043a\u0440\u0430\u044f&#187;, \u0434\u0430\u0432\u0430\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u043e\u0439.<\/p>\n<p>\u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u043c, \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435, \u0447\u0442\u043e\u0431\u044b \u0432\u0430\u0448\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u043b\u043e\u0441\u044c \u0437\u0430 \u043a\u0440\u0430\u044f \u044d\u043a\u0440\u0430\u043d\u0430, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a \u043f\u0440\u043e\u0441\u0442\u043e\u0439 padding \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0442 \u0432\u0430\u0448\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u0437\u0430\u0434\u0430\u043d\u043d\u044b\u0445 \u0433\u0440\u0430\u043d\u0438\u0446.<\/p>\n<h4>\u041f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0441 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u043c<\/h4>\n<p>\u0412 SwiftUI <code>ScrollView<\/code> \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u0441\u0435 \u0441\u0432\u043e\u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043b\u0430\u0432\u043d\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e \u0438\u043b\u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u043c\u044b \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u043c \u043a \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollTransition()<\/code>, \u0442\u043e \u0441\u043c\u043e\u0436\u0435\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0441\u043f\u043e\u0441\u043e\u0431, \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u044d\u0442\u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u044e\u0442 \u0441 \u043d\u0435\u0433\u043e.<\/p>\n<p>\u042d\u0442\u043e\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u043a\u0430\u043a \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u0434\u0432\u0430 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430: \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f (\u043e\u0434\u043d\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0435\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438) \u0438 \u0444\u0430\u0437\u0443 \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438. \u0424\u0430\u0437\u0430 \u043c\u043e\u0436\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u043e\u0434\u043d\u043e \u0438\u0437 \u0442\u0440\u0451\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439:<\/p>\n<ol>\n<li>\n<p>\u0424\u0430\u0437\u0430 <code>.identity<\/code>, \u0447\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0438\u0434\u0438\u043c\u043e \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0424\u0430\u0437\u0430 <code>.topLeading<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u044f\u0432\u0438\u0442\u044c\u0441\u044f \u0441 \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0438\u043b\u0438 \u043b\u0435\u0432\u043e\u0439 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 ScrollView.<\/p>\n<\/li>\n<li>\n<p>\u0424\u0430\u0437\u0430 <code>.bottomTrailing<\/code>, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0430\u043d\u0430\u043b\u043e\u0433\u043e\u043c <code>.topLeading<\/code> \u0434\u043b\u044f \u043d\u0438\u0436\u043d\u0435\u0439\/\u043f\u0440\u0430\u0432\u043e\u0439 \u0433\u0440\u0430\u043d\u0438\u0446\u044b.<\/p>\n<\/li>\n<\/ol>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043c\u043e\u0436\u043d\u043e \u0440\u0430\u0437\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u0440\u044f\u0434 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432 \u0432 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0437\u0430\u0441\u0442\u0430\u0432\u043b\u044f\u044f \u0438\u0445 \u043f\u043e\u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u0442\u044c \u043f\u0440\u0438 \u043f\u0440\u0438\u0431\u043b\u0438\u0436\u0435\u043d\u0438\u0438 \u043a \u043a\u0440\u0430\u044f\u043c \u044d\u043a\u0440\u0430\u043d\u0430:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;10) { index in         RoundedRectangle(cornerRadius: 25)             .fill(.blue)             .frame(height: 80)             .scrollTransition { content, phase in                 content                     .opacity(phase.isIdentity ? 1 : 0)                     .scaleEffect(phase.isIdentity ? 1 : 0.75)                     .blur(radius: phase.isIdentity ? 0 : 10)             }             .padding(.horizontal)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/35b\/127\/a66\/35b127a66f6ee8fd1a58e98a6cf3f8e5.gif\" width=\"1394\" height=\"712\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/35b\/127\/a66\/35b127a66f6ee8fd1a58e98a6cf3f8e5.gif\"\/><\/figure>\n<p>\u041c\u044b \u043c\u043e\u0436\u0435\u043c \u0443\u043a\u0430\u0437\u0430\u0442\u044c, \u043a\u0430\u043a\u0443\u044e \u0447\u0430\u0441\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043d\u0443\u0436\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u043f\u0435\u0440\u0435\u0434 \u0435\u0433\u043e \u043f\u043e\u044f\u0432\u043b\u0435\u043d\u0438\u0435\u043c \u0438\u043b\u0438 \u0443\u0434\u0430\u043b\u0435\u043d\u0438\u0435\u043c.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u043e\u0436\u043d\u043e \u0441\u043a\u0430\u0437\u0430\u0442\u044c, \u0447\u0442\u043e \u043c\u044b \u0445\u043e\u0442\u0438\u043c, \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u0448\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0441\u0442\u0430\u0432\u043b\u044f\u043b\u0438\u0441\u044c \u0432 \u043d\u0430\u0448\u0443 \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u044e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u043e\u0433\u0434\u0430, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d\u0438 \u043d\u0430 90% \u0432\u0438\u0434\u0438\u043c\u044b:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;10) { index in         RoundedRectangle(cornerRadius: 25)             .fill(.blue)             .frame(height: 80)             .scrollTransition(.animated.threshold(.visible(0.9))) { content, phase in                 content                     .opacity(phase.isIdentity ? 1 : 0)                     .scaleEffect(phase.isIdentity ? 1 : 0.75)                     .blur(radius: phase.isIdentity ? 0 : 10)             }             .padding(.horizontal)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3dd\/d9e\/503\/3ddd9e503a0b58445187ef151b5091dd.gif\" width=\"1726\" height=\"846\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3dd\/d9e\/503\/3ddd9e503a0b58445187ef151b5091dd.gif\"\/><\/figure>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u043c\u0435\u0442\u043e\u0434 <code>.animated.threshold(.visible(0.9))<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0437\u0430\u0434\u0430\u0451\u0442 \u043f\u043e\u0440\u043e\u0433 \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u0432 90%. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043f\u0440\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0431\u0443\u0434\u0443\u0442 \u043f\u043e\u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0438\u043b\u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u0442\u044c, \u043a\u043e\u0433\u0434\u0430 \u043e\u043d\u0438 \u0441\u0442\u0430\u043d\u0443\u0442 \u0432\u0438\u0434\u043d\u044b \u043d\u0430 90%.<\/p>\n<p>\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044e \u0444\u0430\u0437\u044b \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0432\u043d\u043e -1 \u0434\u043b\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0432 \u0432\u0435\u0440\u0445\u043d\u0435\u0439 \u0438\u043b\u0438 \u043b\u0435\u0432\u043e\u0439 \u0444\u0430\u0437\u0435 (\u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438), 1 \u0434\u043b\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0432 \u043d\u0438\u0436\u043d\u0435\u0439 \u0438\u043b\u0438 \u043f\u0440\u0430\u0432\u043e\u0439 \u0444\u0430\u0437\u0435, \u0438 0 \u0434\u043b\u044f \u0432\u0441\u0435\u0445 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0445 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434 \u0430\u043a\u043a\u0443\u0440\u0430\u0442\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 \u043e\u0442\u0442\u0435\u043d\u043e\u043a \u043a\u0430\u0436\u0434\u043e\u0439 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u044e\u0449\u0435\u0439\u0441\u044f \u0444\u0438\u0433\u0443\u0440\u044b, \u0441\u043e\u0447\u0435\u0442\u0430\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>phase.value<\/code> \u0441 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c <code>hueRotation()<\/code>:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;10) { index in         RoundedRectangle(cornerRadius: 25)             .fill(.blue)             .frame(height: 80)             .shadow(radius: 3)             .scrollTransition { content, phase in                 content                     .hueRotation(.degrees(45 * phase.value))             }             .padding(.horizontal)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b9f\/5d7\/9e8\/b9f5d79e896056f068642878acb3e0f4.gif\" width=\"1850\" height=\"954\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/b9f\/5d7\/9e8\/b9f5d79e896056f068642878acb3e0f4.gif\"\/><\/figure>\n<h4>\u041c\u0438\u0433\u0430\u043d\u0438\u0435 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u043c\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 ScrollView \u0438\u043b\u0438 List<\/h4>\n<p>\u0412 SwiftUI \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollIndicatorsFlash()<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u043c\u0435\u043d\u0442\u044b, \u043a\u043e\u0433\u0434\u0430 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 <code>ScrollView<\/code> \u0438\u043b\u0438 <code>List<\/code> &#171;\u043c\u0438\u0433\u0430\u044e\u0442&#187; (\u043a\u0440\u0430\u0442\u043a\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u044e\u0442\u0441\u044f \u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u044e\u0442). \u042d\u0442\u043e\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u0435\u043d \u0434\u043b\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439 \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435 \u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0438\u0437\u043c\u0435\u043d\u0438\u043b\u0438\u0441\u044c.<\/p>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollIndicatorsFlash()<\/code> \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d \u0432 \u0434\u0432\u0443\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430\u0445:<\/p>\n<ol>\n<li>\n<p>\u0418\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043c\u0438\u0433\u0430\u044e\u0442 \u043f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f (ScrollView \u0438\u043b\u0438 List). \u042d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u043d\u0430\u043c\u0435\u043a\u043d\u0443\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c, \u0447\u0442\u043e \u0432 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438 \u0435\u0441\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u0434\u0430\u043d\u043d\u044b\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u044b \u043f\u0443\u0442\u0435\u043c \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0418\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043c\u0438\u0433\u0430\u044e\u0442 \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f. \u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u043e \u0432 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u044f\u0445, \u043a\u043e\u0433\u0434\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u044d\u0442\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0432\u0435\u0434\u0435\u0442 \u043a \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044e \u0434\u0430\u043d\u043d\u044b\u0445 \u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438, \u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c \u043d\u0430 \u044d\u0442\u043e \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/p>\n<\/li>\n<\/ol>\n<p>\u0412 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043d\u0430\u0447\u043d\u0443\u0442 \u043c\u0438\u0433\u0430\u0442\u044c \u043f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438 <code>ScrollView<\/code>:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)     } } .scrollIndicatorsFlash(onAppear: true) <\/code><\/pre>\n<p>\u0412 \u0434\u043e\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u043a \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0438\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f, \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollIndicatorsFlash()<\/code> \u043c\u043e\u0436\u0435\u0442 \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0442\u044c \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442, \u043a\u043e\u0433\u0434\u0430 \u0434\u043e\u043b\u0436\u043d\u044b \u043c\u0438\u0433\u0430\u0442\u044c \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043b\u044e\u0431\u043e\u0433\u043e \u0442\u0438\u043f\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0443\u0434\u043e\u0432\u043b\u0435\u0442\u0432\u043e\u0440\u044f\u0435\u0442 \u043f\u0440\u043e\u0442\u043e\u043a\u043e\u043b\u0443 <code>Equatable<\/code>, \u0438 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0435\u0433\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 SwiftUI \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c &#171;\u043c\u0438\u0433\u0430\u043d\u0438\u0435&#187; \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432.<\/p>\n<p>\u0422\u0430\u043a, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0442\u044c \u0446\u0435\u043b\u043e\u0435 \u0447\u0438\u0441\u043b\u043e, \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b\u0439 <code>UUID<\/code> \u0438\u043b\u0438 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0431\u0443\u043b\u0435\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u043c\u0435\u0436\u0434\u0443 <code>true<\/code> \u0438 <code>false<\/code>. \u0412 \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0431\u0443\u043b\u0435\u0432\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0435 <code>exampleState<\/code>. \u041a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443 &#171;Flash!&#187;, \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 <code>exampleState<\/code> \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f (\u043c\u0435\u0436\u0434\u0443 <code>true<\/code> \u0438 <code>false<\/code>), \u0447\u0442\u043e \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u043c\u0438\u0433\u0430\u043d\u0438\u0435 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0432 <code>ScrollView<\/code>:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var exampleState = false      var body: some View {         VStack {             ScrollView {                 ForEach(0..&lt;50) { index in                     Text(\"Item \\(index)\")                         .frame(maxWidth: .infinity)                         .background(.blue)                         .foregroundStyle(.white)                 }             }             .scrollIndicatorsFlash(trigger: exampleState)              Button(\"Flash!\") {                 exampleState.toggle()             }         }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/58d\/a9d\/055\/58da9d05547968835e008a2a96ce5a48.gif\" width=\"1340\" height=\"666\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/58d\/a9d\/055\/58da9d05547968835e008a2a96ce5a48.gif\"\/><\/figure>\n<p>\u0412\u0441\u0451 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u043d\u043e\u0435 \u0432\u044b\u0448\u0435 \u0442\u0430\u043a \u0436\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u043c\u043e \u043a \u0442\u0438\u043f\u0443 <code>List<\/code><\/p>\n<h4>\u0412\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u0430\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u0441\u0442\u0440\u0430\u043d\u0438\u0446<\/h4>\n<p>\u0412 SwiftUI \u043f\u043e\u044f\u0432\u0438\u043b\u0441\u044f \u0441\u0442\u0438\u043b\u044c \u0432\u043a\u043b\u0430\u0434\u043e\u043a <code>.verticalPage<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u044b\u0435 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 \u043d\u0430 watchOS, \u0432 \u043e\u0442\u043b\u0438\u0447\u0438\u0435 \u043e\u0442 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e. \u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044d\u0442\u0438 \u0432\u043a\u043b\u0430\u0434\u043a\u0438 \u0441\u043e\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0442 \u0441\u043e \u0441\u043f\u0438\u0441\u043a\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u043e\u0436\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e, \u043e\u0447\u0435\u043d\u044c \u0432\u0430\u0436\u043d\u043e \u0442\u0449\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u043e\u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0442\u043e\u043c, \u043a\u0430\u043a \u0438\u0445 \u0441\u043e\u0447\u0435\u0442\u0430\u0442\u044c.<\/p>\n<p>\u0414\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430, \u0432\u043e\u0442 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430:<\/p>\n<pre><code class=\"swift\">TabView {     Text(\"First\")         .navigationTitle(\"First Title\")     Text(\"Second\")         .navigationTitle(\"Second Title\")     Text(\"Third\")         .navigationTitle(\"Third Title\") } .tabViewStyle(.verticalPage) <\/code><\/pre>\n<p>\u0417\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u0432\u043a\u043b\u0430\u0434\u043e\u043a \u0437\u0430\u0434\u0430\u044e\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 <code>navigationTitle()<\/code>. \u041f\u0440\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0435 \u044d\u0442\u0438\u0445 \u0432\u043a\u043b\u0430\u0434\u043e\u043a, \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0438 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f watchOS.<\/p>\n<p>\u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u0434\u0440\u0443\u0433\u0438\u043c\u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430\u043c\u0438, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0449\u0438\u043c\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442 \u0432\u043d\u0443\u0442\u0440\u0438 \u0432\u043a\u043b\u0430\u0434\u043e\u043a, \u043e\u0447\u0435\u043d\u044c \u0432\u0430\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u0448\u043b\u0430 \u0434\u043e \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043d\u0430 \u0432\u043a\u043b\u0430\u0434\u043a\u0435. \u0412 \u043f\u0440\u043e\u0442\u0438\u0432\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u043c\u043e\u0433\u0443\u0442 \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u043e \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0438\u0442\u044c \u0432\u043a\u043b\u0430\u0434\u043a\u0438, \u043f\u044b\u0442\u0430\u044f\u0441\u044c \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442.<\/p>\n<p>\u0422\u0430\u043a, \u0432 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043a\u043e\u0434\u0430 \u0435\u0441\u0442\u044c \u0434\u0432\u0435 \u043e\u0431\u044b\u0447\u043d\u044b\u0435 \u0432\u043a\u043b\u0430\u0434\u043a\u0438, \u0437\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u043c\u0438 \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u044b\u0439 \u0441\u043f\u0438\u0441\u043e\u043a:<\/p>\n<pre><code class=\"swift\">TabView {     Text(\"First\")         .navigationTitle(\"First Title\")     Text(\"Second\")         .navigationTitle(\"Second Title\")     List(1..&lt;50) { i in         Text(\"Row \\(i)\")     }     .navigationTitle(\"Third Title\") } .tabViewStyle(.verticalPage) <\/code><\/pre>\n<h3>\u0423\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439<\/h3>\n<h4>\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal \u043a \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c SwiftUI \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u0441\u043b\u043e\u044f<\/h4>\n<p>Metal \u2014 \u044d\u0442\u043e \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0439 API \u043e\u0442 Apple, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u0430\u043c \u043c\u0430\u043a\u0441\u0438\u043c\u0430\u043b\u044c\u043d\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u0438 \u0432\u044b\u0447\u0438\u0441\u043b\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u043e\u0442\u0435\u043d\u0446\u0438\u0430\u043b \u0441\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432 Apple. \u0428\u0435\u0439\u0434\u0435\u0440\u044b, \u043d\u0430\u043f\u0438\u0441\u0430\u043d\u043d\u044b\u0435 \u043d\u0430 \u044f\u0437\u044b\u043a\u0435 Metal, \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u043e\u0432, \u0444\u043e\u0440\u043c \u0438 \u0442.\u0434.<\/p>\n<p>\u041d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 \u0432\u0435\u0440\u0441\u0438\u0438 iOS 17 SwiftUI \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u0448\u0438\u0440\u043e\u043a\u0443\u044e \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044e \u0441 \u0448\u0435\u0439\u0434\u0435\u0440\u0430\u043c\u0438 Metal \u043f\u0440\u044f\u043c\u043e \u043d\u0430 \u0443\u0440\u043e\u0432\u043d\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 &#8212; \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043c\u0430\u043d\u0438\u043f\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0446\u0432\u0435\u0442\u0430\u043c\u0438, \u0444\u043e\u0440\u043c\u0430\u043c\u0438 \u0438 \u043c\u043d\u043e\u0433\u0438\u043c \u0434\u0440\u0443\u0433\u0438\u043c \u0441 \u0432\u044b\u0441\u043e\u043a\u043e\u0439 \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c\u044e.<\/p>\n<p>\u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u0442\u0440\u0438 \u0448\u0430\u0433\u0430:<\/p>\n<ol>\n<li>\n<p>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u0444\u0430\u0439\u043b\u0430 Metal \u0441 \u0432\u0430\u0448\u0438\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u043c. \u041e\u043d \u0434\u043e\u043b\u0436\u0435\u043d \u0438\u043c\u0435\u0442\u044c \u0442\u043e\u0447\u043d\u0443\u044e \u0441\u0438\u0433\u043d\u0430\u0442\u0443\u0440\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0432\u0430\u0440\u044c\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0442\u043e\u0433\u043e, \u043a\u0430\u043a\u043e\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u0432\u044b \u043f\u044b\u0442\u0430\u0435\u0442\u0435\u0441\u044c \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u043a \u0432\u0430\u0448\u0438\u043c SwifUI \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c<\/p>\n<\/li>\n<li>\n<p>\u041e\u043f\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u043a \u0432\u0430\u0448\u0435\u043c\u0443 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044e, \u0447\u0442\u043e\u0431\u044b \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0431\u0435\u0437 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0435\u0433\u043e \u043c\u0430\u043a\u0435\u0442\u0430.<\/p>\n<\/li>\n<\/ol>\n<p>\u0410\u0432\u0442\u043e\u0440 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u043d\u0430\u0431\u043e\u0440 \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0445 \u0438\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal \u0434\u043b\u044f \u044d\u043a\u0441\u043f\u0435\u0440\u0438\u043c\u0435\u043d\u0442\u043e\u0432: <a href=\"https:\/\/www.hackingwithswift.com\/files\/example-swiftui-shaders.metal\" rel=\"noopener noreferrer nofollow\">sample SwiftUI Metal shaders<\/a>. \u041a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043d\u0438\u0445 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u043f\u0440\u0438\u043c\u0435\u0440\u043d\u043e \u0442\u0430\u043a:<\/p>\n<pre><code class=\"swift\">[[ stitchable ]] half4 checkerboard(float2 position, half4 currentColor, float size, half4 newColor) {     uint2 posInChecks = uint2(position.x \/ size, position.y \/ size);     bool isColor = (posInChecks.x ^ posInChecks.y) &amp; 1;     return isColor ? newColor * currentColor.a : half4(0.0, 0.0, 0.0, 0.0); } <\/code><\/pre>\n<p>\u041a\u043e\u0434 \u044d\u0442\u043e\u0433\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u0448\u0430\u0445\u043c\u0430\u0442\u043d\u043e\u0439 \u0434\u043e\u0441\u043a\u0438, \u0433\u0434\u0435 \u043f\u0435\u0440\u0432\u044b\u0435 \u0434\u0432\u0430 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 (\u043f\u043e\u0437\u0438\u0446\u0438\u044f \u0438 \u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u0446\u0432\u0435\u0442) \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0432 SwiftUI, \u0430 \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b (\u0440\u0430\u0437\u043c\u0435\u0440 \u0438 \u043d\u043e\u0432\u044b\u0439 \u0446\u0432\u0435\u0442) \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0432\u0440\u0443\u0447\u043d\u0443\u044e:<\/p>\n<ol>\n<li>\n<p><code>half4 checkerboard(float2 position, half4 currentColor, float size, half4 newColor)<\/code> &#8212; \u044d\u0442\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0441 \u0438\u043c\u0435\u043d\u0435\u043c &#171;checkerboard&#187;. \u0424\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0447\u0435\u0442\u044b\u0440\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430: <code>position<\/code> (\u043f\u043e\u0437\u0438\u0446\u0438\u044e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f), <code>currentColor<\/code> (\u0442\u0435\u043a\u0443\u0449\u0438\u0439 \u0446\u0432\u0435\u0442 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f), <code>size<\/code> (\u0440\u0430\u0437\u043c\u0435\u0440 \u043a\u0432\u0430\u0434\u0440\u0430\u0442\u043e\u0432 \u0448\u0430\u0445\u043c\u0430\u0442\u043d\u043e\u0439 \u0434\u043e\u0441\u043a\u0438), <code>newColor<\/code> (\u043d\u043e\u0432\u044b\u0439 \u0446\u0432\u0435\u0442).<\/p>\n<\/li>\n<li>\n<p><code>uint2 posInChecks = uint2(position.x \/ size, position.y \/ size);<\/code> &#8212; \u0437\u0434\u0435\u0441\u044c \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043a\u0432\u0430\u0434\u0440\u0430\u0442\u0430 \u0448\u0430\u0445\u043c\u0430\u0442\u043d\u043e\u0439 \u0434\u043e\u0441\u043a\u0438 \u043f\u0443\u0442\u0435\u043c \u0434\u0435\u043b\u0435\u043d\u0438\u044f \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442 <code>x<\/code> \u0438 <code>y<\/code> \u043f\u043e\u0437\u0438\u0446\u0438\u0438 \u043d\u0430 \u0440\u0430\u0437\u043c\u0435\u0440 \u043a\u0432\u0430\u0434\u0440\u0430\u0442\u0430.<\/p>\n<\/li>\n<li>\n<p><code>bool isColor = (posInChecks.x ^ posInChecks.y) &amp; 1;<\/code> &#8212; \u044d\u0442\u043e \u0432\u044b\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0435, \u0447\u0442\u043e\u0431\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c, \u0434\u043e\u043b\u0436\u0435\u043d \u043b\u0438 \u0434\u0430\u043d\u043d\u044b\u0439 \u043a\u0432\u0430\u0434\u0440\u0430\u0442 \u0448\u0430\u0445\u043c\u0430\u0442\u043d\u043e\u0439 \u0434\u043e\u0441\u043a\u0438 \u0431\u044b\u0442\u044c \u043e\u043a\u0440\u0430\u0448\u0435\u043d \u0432 \u043d\u043e\u0432\u044b\u0439 \u0446\u0432\u0435\u0442. \u0415\u0441\u043b\u0438 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u0438 XOR \u043c\u0435\u0436\u0434\u0443 \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0430\u043c\u0438 <code>x<\/code> \u0438 <code>y<\/code> \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0435\u0447\u0435\u0442\u043d\u044b\u043c \u0447\u0438\u0441\u043b\u043e\u043c (<code>&amp; 1<\/code>), \u0442\u043e <code>isColor<\/code> \u0431\u0443\u0434\u0435\u0442 <code>true<\/code>.<\/p>\n<\/li>\n<li>\n<p><code>return isColor ? newColor * currentColor.a : half4(0.0, 0.0, 0.0, 0.0);<\/code> &#8212; \u0435\u0441\u043b\u0438 <code>isColor<\/code> \u0440\u0430\u0432\u0435\u043d <code>true<\/code>, \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043d\u043e\u0432\u044b\u0439 \u0446\u0432\u0435\u0442, \u0443\u043c\u043d\u043e\u0436\u0435\u043d\u043d\u044b\u0439 \u043d\u0430 \u0430\u043b\u044c\u0444\u0430-\u043a\u0430\u043d\u0430\u043b \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0446\u0432\u0435\u0442\u0430 (\u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438). \u0415\u0441\u043b\u0438 <code>isColor<\/code> \u0440\u0430\u0432\u043d\u043e <code>false<\/code>, \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442\u0441\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 (<code>half4(0.0, 0.0, 0.0, 0.0)<\/code>).<\/p>\n<\/li>\n<\/ol>\n<p>\u0412 SwiftUI \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u043e\u0438\u0441\u043a \u0447\u043b\u0435\u043d\u043e\u0432. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u043f\u0440\u044f\u043c\u043e \u043f\u043e \u0438\u043c\u0435\u043d\u0438. \u041d\u0435\u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u044b \u0445\u043e\u0442\u0438\u043c \u043f\u0435\u0440\u0435\u0434\u0430\u0442\u044c \u0432 \u0448\u0435\u0439\u0434\u0435\u0440 (\u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0440\u0430\u0437\u043c\u0435\u0440 \u0438 \u0446\u0432\u0435\u0442), \u043c\u044b \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u043c \u043f\u0440\u044f\u043c\u043e \u0432 \u0432\u044b\u0437\u043e\u0432\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430.<\/p>\n<pre><code class=\"swift\">Image(systemName: \"figure.run.circle.fill\")     .font(.system(size: 300))     .colorEffect(ShaderLibrary.checkerboard(.float(10), .color(.blue))) <\/code><\/pre>\n<p>\u041f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043d\u044b\u0439 \u043a\u043e\u0434 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442 \u0448\u0435\u0439\u0434\u0435\u0440 \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e. \u0412 \u044d\u0442\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441\u0438\u0441\u0442\u0435\u043c\u043d\u043e\u0435 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0441 \u0438\u043c\u0435\u043d\u0435\u043c &#171;figure.run.circle.fill&#187;, \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440 \u0434\u043e 300 \u043f\u043e\u0438\u043d\u0442\u043e\u0432, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u044d\u0444\u0444\u0435\u043a\u0442 \u0446\u0432\u0435\u0442\u0430 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043d\u0430\u0448\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 <code>checkerboard()<\/code>. \u0412 \u044d\u0442\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0434\u0432\u0430 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430: \u0440\u0430\u0437\u043c\u0435\u0440 \u043a\u0432\u0430\u0434\u0440\u0430\u0442\u043e\u0432 \u0448\u0430\u0445\u043c\u0430\u0442\u043d\u043e\u0439 \u0434\u043e\u0441\u043a\u0438 (10 \u043f\u043e\u0438\u043d\u0442\u043e\u0432) \u0438 \u043d\u043e\u0432\u044b\u0439 \u0446\u0432\u0435\u0442 (\u0441\u0438\u043d\u0438\u0439).<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1cb\/e1b\/2ac\/1cbe1b2acddcbb40ca2a0131031f52c9.webp\" width=\"894\" height=\"515\"\/><\/figure>\n<p>\u0418 \u0435\u0449\u0435 \u0440\u0430\u0437: \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043f\u043e\u0437\u0438\u0446\u0438\u0438 \u0438 \u0442\u0435\u043a\u0443\u0449\u0435\u0433\u043e \u0446\u0432\u0435\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0442\u0440\u0435\u0431\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430, \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u044e\u0442\u0441\u044f SwiftUI, \u0438 \u0438\u0445 \u043d\u0435 \u043d\u0443\u0436\u043d\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0432\u0440\u0443\u0447\u043d\u0443\u044e.<\/p>\n<p>\u042d\u0442\u043e \u0431\u0430\u0437\u043e\u0432\u044b\u0439 \u043a\u043e\u043d\u0446\u0435\u043f\u0442, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0434\u0430\u0432\u0430\u0439\u0442\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043f\u0440\u043e\u0447\u0438\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u044b, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0438\u0442\u044c \u0432\u0430\u043c \u0440\u044f\u0434 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 \u043e\u043f\u0446\u0438\u0439.<\/p>\n<p>\u0428\u0435\u0439\u0434\u0435\u0440\u044b \u043c\u043e\u0436\u043d\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043f\u043e\u043c\u0435\u0441\u0442\u0438\u0432 \u0438\u0445 \u0432 <code>TimelineView<\/code> \u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u044f \u0432 \u043d\u0435\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0434\u0430\u0442\u044b. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043c\u043e\u0433\u043b\u0438 \u0431\u044b \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u0443\u044e \u0434\u0430\u0442\u0443 \u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043d\u0438\u0446\u0443 \u043c\u0435\u0436\u0434\u0443 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u0438 \u0442\u0435\u043a\u0443\u0449\u0435\u0439 \u0434\u0430\u0442\u043e\u0439 \u0434\u043b\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0448\u0435\u0439\u0434\u0430\u0440\u0430 \u0441 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u043c \u0448\u0443\u043c\u0430:<\/p>\n<pre><code class=\"swift\">[[ stitchable ]] half4 noise(float2 position, half4 currentColor, float time) {     float value = fract(sin(dot(position + time, float2(12.9898, 78.233))) * 43758.5453);     return half4(value, value, value, 1) * currentColor.a; } <\/code><\/pre>\n<p>\u041a\u043e\u0434 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 <code>noise<\/code> \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u0448\u0443\u043c\u0430, \u043e\u0441\u043d\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u043d\u0430 \u0432\u0440\u0435\u043c\u0435\u043d\u0438. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0448\u0443\u043c\u0430 \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u0439 <code>sin<\/code> \u0438 <code>dot<\/code> \u0438 \u0437\u0430\u0442\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043a \u0442\u0435\u043a\u0443\u0449\u0435\u043c\u0443 \u0446\u0432\u0435\u0442\u0443 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u044f \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u0448\u0443\u043c\u0430.<\/p>\n<p>\u0414\u0430\u043b\u0435\u0435 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u0448\u0435\u0439\u0434\u0435\u0440 \u0432 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438 <code>TimelineView<\/code>:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     let startDate = Date()      var body: some View {         TimelineView(.animation) { context in             Image(systemName: \"figure.run.circle.fill\")                 .font(.system(size: 300))                 .colorEffect(ShaderLibrary.noise(.float(startDate.timeIntervalSinceNow)))         }     } } <\/code><\/pre>\n<p>\u0412 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0435 \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0441\u044f \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0448\u0435\u0439\u0434\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0441\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0435\u043c, \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u044f \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u043d\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/1f7\/c91\/e88\/1f7c91e88e4e109d8a6df5168ad1c1cd.webp\" width=\"1340\" height=\"666\"\/><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432 \u0448\u0435\u0439\u0434\u0435\u0440 \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0432\u0430\u0442\u044c \u0446\u0432\u0435\u0442 \u0438\u0437 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0442\u043e \u0434\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0432 Metal \u0444\u0430\u0439\u043b \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0432\u043d\u0435\u0441\u0442\u0438 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f. \u0412\u043e-\u043f\u0435\u0440\u0432\u044b\u0445, \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0441\u0442\u0440\u043e\u0447\u043a\u0443 <code>#include &lt;SwiftUI\/SwiftUI_Metal.h><\/code> \u0432 \u043d\u0430\u0447\u0430\u043b\u043e \u0432\u0430\u0448\u0435\u0433\u043e \u0444\u0430\u0439\u043b\u0430. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u0431\u043e\u0440 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0438 \u0442\u0438\u043f\u043e\u0432 \u0434\u0430\u043d\u043d\u044b\u0445, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0432 SwiftUI \u0434\u043b\u044f Metal. \u0412\u043e-\u0432\u0442\u043e\u0440\u044b\u0445, \u043d\u0443\u0436\u043d\u043e \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u043f\u043e\u0434\u043f\u0438\u0441\u044c \u0432\u0430\u0448\u0435\u0433\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u0430 (\u0442.\u0435. \u043e\u0431\u044a\u044f\u0432\u043b\u0435\u043d\u0438\u0435 \u0432\u0430\u0448\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u0448\u0435\u0439\u0434\u0435\u0440\u0430) \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u0438 \u043f\u043e\u0437\u0438\u0446\u0438\u044e, \u0438 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 <code>SwiftUI::Layer<\/code>.<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u0430\u0432\u0442\u043e\u0440 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u043f\u0438\u043a\u0441\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u0438:<\/p>\n<pre><code class=\"swift\">[[ stitchable ]] half4 pixellate(float2 position, SwiftUI::Layer layer, float strength) {     float min_strength = max(strength, 0.0001);     float coord_x = min_strength * round(position.x \/ min_strength);     float coord_y = min_strength * round(position.y \/ min_strength);     return layer.sample(float2(coord_x, coord_y)); } <\/code><\/pre>\n<p>\u0412 \u043d\u0430\u0447\u0430\u043b\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0430 \u0432\u0445\u043e\u0434\u043d\u043e\u0433\u043e \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 &#171;\u0441\u0438\u043b\u0430&#187; (strength). \u0415\u0441\u043b\u0438 \u044d\u0442\u043e\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u0441\u043b\u0438\u0448\u043a\u043e\u043c \u0431\u043b\u0438\u0437\u043e\u043a \u043a \u043d\u0443\u043b\u044e, \u0442\u043e \u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 \u043d\u0435\u0433\u043e \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0437\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u044b, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f max(), \u0447\u0442\u043e\u0431\u044b \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 &#171;\u0441\u0438\u043b\u044b&#187; \u0432 0.0001.<\/p>\n<p>\u0417\u0430\u0442\u0435\u043c \u043a\u0430\u0436\u0434\u0430\u044f \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0430 \u043f\u0438\u043a\u0441\u0435\u043b\u044f (<code>position.x<\/code> \u0438 <code>position.y<\/code>) \u0434\u0435\u043b\u0438\u0442\u0441\u044f \u043d\u0430 &#171;\u0441\u0438\u043b\u0443&#187; \u043f\u0438\u043a\u0441\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u043e\u043a\u0440\u0443\u0433\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u043e \u0431\u043b\u0438\u0436\u0430\u0439\u0448\u0435\u0433\u043e \u0446\u0435\u043b\u043e\u0433\u043e \u0447\u0438\u0441\u043b\u0430 \u0438 \u0443\u043c\u043d\u043e\u0436\u0430\u0435\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u043d\u0430 &#171;\u0441\u0438\u043b\u0443&#187;. \u042d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0438\u043a\u0441\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u0438, \u0433\u0434\u0435 \u043a\u0430\u0436\u0434\u044b\u0439 \u043f\u0438\u043a\u0441\u0435\u043b\u044c \u0437\u0430\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u043a\u0440\u0443\u043f\u043d\u044b\u0439 &#171;\u0441\u0443\u043f\u0435\u0440\u043f\u0438\u043a\u0441\u0435\u043b\u044c&#187;.<\/p>\n<p>\u0412\u0430\u0436\u043d\u043e\u0439 \u0447\u0430\u0441\u0442\u044c\u044e \u044d\u0442\u043e\u0433\u043e \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430 \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>layer.sample()<\/code>. \u041e\u043d\u0430 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442 \u0446\u0432\u0435\u0442 \u0432 \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0439 \u043f\u043e\u0437\u0438\u0446\u0438\u0438 \u0438\u0437 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f (view), \u043a \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0448\u0435\u0439\u0434\u0435\u0440. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0448\u0435\u0439\u0434\u0435\u0440\u0443 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0442\u044c \u044d\u0444\u0444\u0435\u043a\u0442 \u043f\u0438\u043a\u0441\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043a \u043b\u044e\u0431\u043e\u043c\u0443 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044e.<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0448\u0435\u0439\u0434\u0435\u0440, \u0435\u0433\u043e \u043d\u0443\u0436\u043d\u043e \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043a\u0430\u043a \u044d\u0444\u0444\u0435\u043a\u0442 \u0441\u043b\u043e\u044f (layer):<\/p>\n<pre><code class=\"swift\">Image(systemName: \"figure.run.circle.fill\")     .font(.system(size: 300))     .layerEffect(ShaderLibrary.pixellate(.float(10)), maxSampleOffset: .zero) <\/code><\/pre>\n<p>\u041c\u0435\u0442\u043e\u0434 .layerEffect() \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0438 \u0432 \u043d\u0435\u0433\u043e \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u0448\u0435\u0439\u0434\u0435\u0440 \u043f\u0438\u043a\u0441\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 &#171;\u0441\u0438\u043b\u0430&#187;. \u042d\u0442\u043e \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 SwiftUI, \u0447\u0442\u043e \u043d\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432\u0435\u0441\u044c \u0441\u043b\u043e\u0439 \u0438 \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0434\u043b\u044f \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u044d\u0444\u0444\u0435\u043a\u0442\u0430. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0448\u0435\u0439\u0434\u0435\u0440 \u043f\u0438\u043a\u0441\u0435\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043a \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044e:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/9a2\/938\/830\/9a293883075fcbe37adf029d1f6a0629.webp\" width=\"894\" height=\"515\"\/><\/figure>\n<p>\u0415\u0449\u0451 \u043e\u0434\u0438\u043d \u0442\u0438\u043f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 <code>distortionEffect()<\/code>. \u042d\u0442\u043e\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 &#171;\u0438\u0441\u043a\u0430\u0436\u0430\u0442\u044c&#187; \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435, \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u044f \u043f\u0438\u043a\u0441\u0435\u043b\u0438 \u0438\u0437 \u043e\u0434\u043d\u043e\u0433\u043e \u043c\u0435\u0441\u0442\u0430 \u0432 \u0434\u0440\u0443\u0433\u043e\u0435.<\/p>\n<p>\u041f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u043d\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f &#171;wave&#187;. \u042d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0448\u0435\u0439\u0434\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u0432\u043e\u043b\u043d\u044b \u043d\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438:<\/p>\n<pre><code class=\"swift\">[[ stitchable ]] float2 wave(float2 position, float time) {     return position + float2 (sin(time + position.y \/ 20), sin(time + position.x \/ 20)) * 5; } <\/code><\/pre>\n<p>\u0412 \u044d\u0442\u043e\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u0435 \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u044e\u0442\u0441\u044f \u0434\u0432\u0430 \u0430\u0440\u0433\u0443\u043c\u0435\u043d\u0442\u0430: \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0438\u043a\u0441\u0435\u043b\u044f (position) \u0438 \u0432\u0440\u0435\u043c\u044f (time). \u042d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043d\u043e\u0432\u0443\u044e \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u0434\u043b\u044f \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u043f\u0438\u043a\u0441\u0435\u043b\u044f. \u041d\u043e\u0432\u0430\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043a\u0430\u043a \u0438\u0441\u0445\u043e\u0434\u043d\u0430\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0438\u043a\u0441\u0435\u043b\u044f, \u0441\u043c\u0435\u0449\u0435\u043d\u043d\u0430\u044f \u043d\u0430 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u0434\u043e\u043b\u044c \u043e\u0441\u0435\u0439 x \u0438 y. \u0421\u043c\u0435\u0449\u0435\u043d\u0438\u0435 \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u0430\u043a \u0441\u0438\u043d\u0443\u0441\u043e\u0438\u0434\u0430\u043b\u044c\u043d\u0430\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043e\u0442 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0438 \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u044b \u043f\u0438\u043a\u0441\u0435\u043b\u044f, \u0443\u043c\u043d\u043e\u0436\u0435\u043d\u043d\u0430\u044f \u043d\u0430 5. \u042d\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u0432\u043e\u043b\u043d\u044b, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043f\u0438\u043a\u0441\u0435\u043b\u0438 &#171;\u0432\u043e\u043b\u043d\u0443\u044e\u0442\u0441\u044f&#187; \u0432\u043e \u0432\u0440\u0435\u043c\u0435\u043d\u0438.<\/p>\n<p>\u042d\u0442\u043e\u0442 \u0448\u0435\u0439\u0434\u0435\u0440 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043a\u0443\u043f\u0435 \u0441 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c  <code>distortionEffect()<\/code>:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     let startDate = Date()      var body: some View {         TimelineView(.animation) { context in             Image(systemName: \"figure.run.circle.fill\")                 .font(.system(size: 300))                 .distortionEffect(ShaderLibrary.simpleWave(.float(startDate.timeIntervalSinceNow)), maxSampleOffset: .zero)         }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ff8\/b61\/953\/ff8b61953a0499f38845a5005a78ad08.gif\" width=\"1340\" height=\"670\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/ff8\/b61\/953\/ff8b61953a0499f38845a5005a78ad08.gif\"\/><\/figure>\n<p>\u0414\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u043e\u0433\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0432\u043e\u043b\u043d\u044b, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442, \u0431\u0443\u0434\u0442\u043e \u0432\u044b \u0441\u043c\u043e\u0442\u0440\u0438\u0442\u0435 \u043d\u0430 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u043e\u0434 \u0432\u043e\u0434\u043e\u0439, \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u043e\u0431\u0449\u0438\u0439 \u0440\u0430\u0437\u043c\u0435\u0440 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u042d\u0442\u043e \u0441\u0432\u044f\u0437\u0430\u043d\u043e \u0441 \u0442\u0435\u043c, \u0447\u0442\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u0443 \u0432\u043e\u043b\u043d\u044b \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u0430\u044f \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430\u0445 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0447\u0442\u043e\u0431\u044b \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e \u0432\u044b\u0447\u0438\u0441\u043b\u0438\u0442\u044c \u0438\u0441\u043a\u0430\u0436\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">[[ stitchable ]] float2 complexWave(float2 position, float time, float2 size, float speed, float strength, float frequency) {     float2 normalizedPosition = position \/ size;     float moveAmount = time * speed;      position.x += sin((normalizedPosition.x + moveAmount) * frequency) * strength;     position.y += cos((normalizedPosition.y + moveAmount) * frequency) * strength;      return position; } <\/code><\/pre>\n<p>\u0428\u0435\u0439\u0434\u0435\u0440 <code>complexWave<\/code> \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u0438\u043c\u0435\u0435\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438, \u0441\u0438\u043b\u044b \u0438 \u0447\u0430\u0441\u0442\u043e\u0442\u044b \u0432\u043e\u043b\u043d\u044b. \u0412 \u044d\u0442\u043e\u043c \u0448\u0435\u0439\u0434\u0435\u0440\u0435 \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u043d\u043e\u0440\u043c\u0430\u043b\u0438\u0437\u0443\u0435\u0442\u0441\u044f \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0437\u0430\u0442\u0435\u043c \u0440\u0430\u0441\u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u0430 \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u044f \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0432\u0440\u0435\u043c\u0435\u043d\u0438 \u0438 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438. \u0414\u0430\u043b\u0435\u0435, \u043a \u043a\u043e\u043e\u0440\u0434\u0438\u043d\u0430\u0442\u0430\u043c x \u0438 y \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u043f\u0440\u0438\u0431\u0430\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0444\u0443\u043d\u043a\u0446\u0438\u0439 \u0441\u0438\u043d\u0443\u0441\u0430 \u0438 \u043a\u043e\u0441\u0438\u043d\u0443\u0441\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043f\u0435\u0440\u0435\u0434\u0430\u044e\u0442\u0441\u044f \u043d\u043e\u0440\u043c\u0430\u043b\u0438\u0437\u043e\u0432\u0430\u043d\u043d\u0430\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0438\u043a\u0441\u0435\u043b\u044f \u0438 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u0430 \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u044f, \u0443\u043c\u043d\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u043d\u0430 \u0447\u0430\u0441\u0442\u043e\u0442\u0443 \u0432\u043e\u043b\u043d\u044b \u0438 \u0443\u0441\u0438\u043b\u0435\u043d\u043d\u044b\u0435 \u0437\u0430\u0434\u0430\u043d\u043d\u043e\u0439 \u0441\u0438\u043b\u043e\u0439. \u0412 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0435 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442\u0441\u044f \u043d\u043e\u0432\u0430\u044f \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0438\u043a\u0441\u0435\u043b\u044f.<\/p>\n<p>\u0414\u043b\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u043f\u043e\u043d\u0430\u0434\u043e\u0431\u044f\u0442\u0441\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b <code>visualEffect()<\/code> \u0438 <code>distortionEffect()<\/code>:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     let startDate = Date()      var body: some View {         TimelineView(.animation) { context in             Image(systemName: \"figure.run.circle.fill\")                 .font(.system(size: 300))                 .visualEffect { content, proxy in                     content                         .distortionEffect(ShaderLibrary.complexWave(                             .float(startDate.timeIntervalSinceNow),                             .float2(proxy.size),                             .float(0.5),                             .float(8),                             .float(10)                         ), maxSampleOffset: .zero)                 }         }     } } <\/code><\/pre>\n<p>\u0418\u0445 \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u043d\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043d\u0430\u043c \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u0443\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u0435\u0433\u043e \u0432 \u0440\u0430\u0441\u0447\u0435\u0442\u0430\u0445 \u0448\u0435\u0439\u0434\u0435\u0440\u0430:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/c28\/870\/a18\/c28870a1856b54291b644cdeb0954c5b.png\" width=\"740\" height=\"676\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/c28\/870\/a18\/c28870a1856b54291b644cdeb0954c5b.png\"\/><\/figure>\n<p>\u0414\u043b\u044f \u043d\u0430\u0448\u0435\u0433\u043e \u043f\u043e\u0441\u043b\u0435\u0434\u043d\u0435\u0433\u043e \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u0448\u0435\u0439\u0434\u0435\u0440\u0430 \u0441\u043e\u0437\u0434\u0430\u0434\u0438\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u0444\u0438\u043b\u044c\u0442\u0440 \u0442\u0438\u0441\u043d\u0435\u043d\u0438\u044f, \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <code>Slider<\/code> \u0434\u043b\u044f \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u0441\u0438\u043b\u044b \u0442\u0438\u0441\u043d\u0435\u043d\u0438\u044f. \u0424\u0438\u043b\u044c\u0442\u0440 \u0442\u0438\u0441\u043d\u0435\u043d\u0438\u044f (\u0438\u043b\u0438 \u044d\u043c\u0431\u043e\u0441\u0441\u0438\u043d\u0433) \u2014 \u044d\u0442\u043e \u0432\u0438\u0434 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u0442\u0440\u0435\u0445\u043c\u0435\u0440\u043d\u043e\u0441\u0442\u0438, \u043e\u0431\u044b\u0447\u043d\u043e \u043f\u0443\u0442\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u044f\u0440\u043a\u043e\u0441\u0442\u0438 \u043f\u0438\u043a\u0441\u0435\u043b\u0435\u0439 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0438\u0445 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0441\u0442\u043e\u0447\u043d\u0438\u043a\u0430 \u0441\u0432\u0435\u0442\u0430.<\/p>\n<p>\u0421\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u043e\u0431\u0430\u0432\u044c\u0442\u0435 \u0448\u0435\u0439\u0434\u0435\u0440 \u0432 \u0432\u0430\u0448 \u0444\u0430\u0439\u043b Metal:<\/p>\n<pre><code class=\"swift\">[[ stitchable ]] half4 emboss(float2 position, SwiftUI::Layer layer, float strength) {     half4 current_color = layer.sample(position);     half4 new_color = current_color;      new_color += layer.sample(position + 1) * strength;     new_color -= layer.sample(position - 1) * strength;      return half4(new_color); } <\/code><\/pre>\n<p>\u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u044d\u0442\u043e\u0442 \u043a\u043e\u0434 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442 \u0442\u0438\u0441\u043d\u0435\u043d\u0438\u044f, \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044f \u0438\u043b\u0438 \u0443\u0431\u0438\u0440\u0430\u044f \u044f\u0440\u043a\u043e\u0441\u0442\u044c \u043e\u0442 \u043f\u0438\u043a\u0441\u0435\u043b\u0435\u0439 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0438\u0445 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0432\u043f\u0435\u0447\u0430\u0442\u043b\u0435\u043d\u0438\u0435 \u0442\u0440\u0435\u0445\u043c\u0435\u0440\u043d\u043e\u0441\u0442\u0438.<\/p>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u0448\u0435\u0439\u0434\u0435\u0440 \u0441 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c <code>layerEffect()<\/code>:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var strength = 3.0      var body: some View {         VStack {             Image(systemName: \"figure.run.circle.fill\")                 .foregroundStyle(.linearGradient(colors: [.orange, .red], startPoint: .top, endPoint: .bottom))                 .font(.system(size: 300))                 .layerEffect(ShaderLibrary.emboss(.float(strength)), maxSampleOffset: .zero)              Slider(value: $strength, in: 0...20)         }         .padding()     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7a6\/d04\/2c3\/7a6d042c3ae4fa6b4acdb4f33b4b14dc.gif\" width=\"802\" height=\"906\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/7a6\/d04\/2c3\/7a6d042c3ae4fa6b4acdb4f33b4b14dc.gif\"\/><\/figure>\n<p>\u0422\u0435\u043f\u0435\u0440\u044c, \u043a\u0430\u043a \u0432\u044b \u0432\u0438\u0434\u0438\u0442\u0435, \u0438\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal \u0432 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f SwiftUI \u0441\u0442\u0430\u043b\u0430 \u0434\u043e\u0432\u043e\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0439, \u043e\u0442\u043a\u0440\u044b\u0432\u0430\u044f \u043e\u0431\u0448\u0438\u0440\u043d\u044b\u0439 \u0441\u043f\u0435\u043a\u0442\u0440 \u0441\u043f\u0435\u0446\u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u0431\u0435\u0437 \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u0442\u0440\u0443\u0434\u043e\u0437\u0430\u0442\u0440\u0430\u0442.<\/p>\n<h4>\u0414\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f<\/h4>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>visualEffect()<\/code> \u0432 SwiftUI \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u0447\u0438\u0442\u044b\u0432\u0430\u0442\u044c \u0433\u0435\u043e\u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0431\u0435\u0437 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 <code>GeometryReader<\/code>. \u042d\u0442\u043e \u0437\u043d\u0430\u0447\u0438\u0442, \u0447\u0442\u043e \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440 \u0438 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u043d\u0435 \u0432\u043b\u0438\u044f\u044f \u043d\u0430 \u0435\u0433\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0440\u0430\u0437\u043c\u0435\u0449\u0435\u043d\u0438\u0438.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e<\/strong>: \u042d\u0442\u043e\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d \u0438\u0441\u043a\u043b\u044e\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0434\u043b\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u043a\u043e\u0440\u0440\u0435\u043a\u0446\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432 \u0438\u043b\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u044f. <code>visualEffect()<\/code> \u043d\u0435 \u043c\u043e\u0436\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u0438\u043b\u0438 \u0444\u043e\u0440\u043c\u044b \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u043c\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442, \u043a\u0430\u043a \u0438 \u0433\u0434\u0435 \u043e\u043d \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0442\u044c\u0441\u044f \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u043f\u0440\u0438 \u044d\u0442\u043e\u043c <code>visualEffect()<\/code> \u043c\u043e\u0436\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0430\u0441\u043f\u0435\u043a\u0442\u043e\u0432 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043d\u0435 \u0432\u043b\u0438\u044f\u044e\u0442 \u043d\u0430 \u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0449\u0435\u043d\u0438\u0435. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043e\u043d \u043c\u043e\u0436\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u044f\u0442\u044c \u0441\u043c\u0435\u0449\u0435\u043d\u0438\u0435 (\u0442\u043e \u0435\u0441\u0442\u044c \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0435\u0433\u043e \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f) \u0438 \u043c\u0430\u0441\u0448\u0442\u0430\u0431 (\u0442\u043e \u0435\u0441\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0435\u0433\u043e \u043d\u043e\u0440\u043c\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430).<\/p>\n<p>\u0421\u043c\u0435\u0449\u0435\u043d\u0438\u0435 \u0438 \u043c\u0430\u0441\u0448\u0442\u0430\u0431 \u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f &#171;\u0440\u0430\u043c\u043e\u0447\u043d\u044b\u043c\u0438&#187; \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430\u043c\u0438 \u0432 \u0442\u043e\u043c \u0441\u043c\u044b\u0441\u043b\u0435, \u0447\u0442\u043e \u043e\u043d\u0438 \u0441\u0432\u044f\u0437\u0430\u043d\u044b \u0441 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u043c \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430, \u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u044d\u0442\u0438\u0445 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u043e\u0432 \u043d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0435, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043e\u043d\u0438 \u043d\u0435 \u043c\u0435\u043d\u044f\u044e\u0442 \u0444\u0430\u043a\u0442\u0438\u0447\u0435\u0441\u043a\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e, \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u043c\u043e\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c.<\/p>\n<p>\u0420\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u0443\u0435\u0442 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u044f \u043a \u043a\u0430\u0436\u0434\u043e\u043c\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 \u0432 <code>ScrollView<\/code>. \u0421\u0442\u0435\u043f\u0435\u043d\u044c \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0440\u0430\u0441\u0441\u0442\u043e\u044f\u043d\u0438\u0435\u043c \u043c\u0435\u0436\u0434\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u043c \u0438 \u0446\u0435\u043d\u0442\u0440\u043e\u043c \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438. \u0422\u0430\u043a, \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0435 \u0431\u043b\u0438\u0437\u043a\u043e \u043a \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u043c\u0443 \u0446\u0435\u043d\u0442\u0440\u0443, \u0431\u0443\u0434\u0443\u0442 \u0438\u043c\u0435\u0442\u044c \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u0435 \u0438\u043b\u0438 \u0435\u0433\u043e \u0432\u043e\u043e\u0431\u0449\u0435 \u043d\u0435 \u0431\u0443\u0434\u0435\u0442, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u043a\u0440\u0430\u044f\u0445 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0443\u0434\u0443\u0442 \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0440\u0430\u0437\u043c\u044b\u0442\u044b:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     var body: some View {         ScrollView {             ForEach(0..&lt;100) { i in                 Text(\"Row \\(i)\")                     .font(.largeTitle)                     .frame(maxWidth: .infinity)                     .visualEffect { content, proxy in                         content.blur(radius: blurAmount(for: proxy))                     }             }         }     }      func blurAmount(for proxy: GeometryProxy) -> Double {         let scrollViewHeight = proxy.bounds(of: .scrollView)?.height ?? 100         let ourCenter = proxy.frame(in: .scrollView).midY         let distanceFromCenter = abs(scrollViewHeight \/ 2 - ourCenter)         return Double(distanceFromCenter) \/ 100     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3d2\/1fc\/02d\/3d21fc02dd64d4c411558f0e4414c49e.gif\" width=\"1204\" height=\"936\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3d2\/1fc\/02d\/3d21fc02dd64d4c411558f0e4414c49e.gif\"\/><\/figure>\n<p><strong>\u0421\u043e\u0432\u0435\u0442<\/strong>: \u0412\u044b\u0437\u043e\u0432 <code>proxy.frame(in: .scrollView)<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440 \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432 \u0441\u0430\u043c\u043e\u043c \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0435\u0433\u043e \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442.<\/p>\n<p>\u042d\u0442\u0438 \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u044e\u0442 \u0441 \u043b\u044e\u0431\u044b\u043c \u0442\u0438\u043f\u043e\u043c \u043f\u043e\u0437\u0438\u0446\u0438\u0438, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0442\u0443, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0447\u0435\u0440\u0435\u0437 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0441\u0435\u0440\u0438\u044e \u043a\u0440\u0443\u0436\u043a\u043e\u0432 \u0432 \u0441\u0435\u0442\u043a\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u0440\u0430\u0449\u0430\u044e\u0442\u0441\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0441\u0432\u043e\u0435\u0439 \u043e\u0441\u0438, \u0438 \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0434\u0438\u043d\u0430\u043c\u0438\u0447\u0435\u0441\u043a\u0438 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442 \u0441\u0432\u043e\u0439 \u0446\u0432\u0435\u0442 \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0432\u0440\u0430\u0449\u0435\u043d\u0438\u044f \u043e\u0442\u0442\u0435\u043d\u043a\u0430:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var rotationAmount = 0.0      var body: some View {         Grid {             ForEach(0..&lt;3) { _ in                 GridRow {                     ForEach(0..&lt;3) { _ in                         Circle()                             .fill(.green)                             .frame(width: 100, height: 100)                             .visualEffect { content, proxy in                                 content.hueRotation(.degrees(proxy.frame(in: .global).midY \/ 2))                             }                     }                 }             }         }         .rotationEffect(.degrees(rotationAmount))         .onAppear {             withAnimation(.linear(duration: 5).repeatForever(autoreverses: false)) {                 rotationAmount = 360             }         }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f9c\/456\/219\/f9c4562194c385d5c03094895d1a2b4b.webp\" width=\"1386\" height=\"712\"\/><\/figure>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>visualEffect()<\/code> \u0432 SwiftUI \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u0446\u0432\u0435\u0442\u0430, \u0440\u0430\u0437\u043c\u044b\u0442\u0438\u0435 \u0438\u043b\u0438 \u043e\u0441\u0432\u0435\u0449\u0435\u043d\u0438\u0435. \u042d\u0442\u043e\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043d\u0435 \u043f\u0440\u0435\u0434\u043d\u0430\u0437\u043d\u0430\u0447\u0435\u043d \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f.<\/p>\n<p><strong>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f SF Symbols<\/strong><\/p>\n<p>SwiftUI \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>symbolEffect()<\/code> \u0434\u043b\u044f \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0434\u043b\u044f SF Symbols, \u0447\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0440\u0435\u0430\u043b\u044c\u043d\u043e \u0432\u043f\u0435\u0447\u0430\u0442\u043b\u044f\u044e\u0449\u0438\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u0441 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u044b\u043c\u0438 \u0443\u0441\u0438\u043b\u0438\u044f\u043c\u0438.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u0434\u043b\u044f \u0438\u043a\u043e\u043d\u043a\u0438 \u0441\u043e\u0431\u0430\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0431\u0443\u0434\u0435\u0442 \u043c\u044f\u0433\u043a\u043e \u043f\u043e\u0434\u043f\u0440\u044b\u0433\u0438\u0432\u0430\u0442\u044c \u0432\u0432\u0435\u0440\u0445 \u0438 \u0432\u043d\u0438\u0437 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043d\u043e\u043f\u043a\u0438:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var petCount = 0      var body: some View {         Button(action: { petCount += 1 }) {             Label(\"Pet the Dog\", systemImage: \"dog\")         }         .symbolEffect(.bounce, value: petCount)         .font(.largeTitle)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3bc\/934\/f4b\/3bc934f4bdd234e11190a28a20cccc25.webp\" width=\"794\" height=\"334\"\/><\/figure>\n<p>\u0412\u044b \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u043e\u043f\u0440\u043e\u0431\u043e\u0432\u0430\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>.pulse<\/code> \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438, \u043d\u043e \u043d\u0430\u0441\u0442\u043e\u044f\u0449\u0438\u0439 \u0442\u0432\u043e\u0440\u0447\u0435\u0441\u043a\u0438\u0439 \u043f\u043e\u0434\u0445\u043e\u0434 \u043f\u0440\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 SF Symbols, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0438\u043c\u0435\u044e\u0442 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0441\u043b\u043e\u0435\u0432, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0438\u0445 \u043c\u043e\u0436\u043d\u043e \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438 \u0438\u043b\u0438 \u0432\u043c\u0435\u0441\u0442\u0435.<\/p>\n<p>\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u0441\u043b\u043e\u0438 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044e\u0442\u0441\u044f \u0438\u043d\u0434\u0438\u0432\u0438\u0434\u0443\u0430\u043b\u044c\u043d\u043e, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0442\u0430\u043a\u043e\u0439 \u043a\u043e\u0434 \u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u0432\u043e\u043b\u043d\u043e\u0432\u043e\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u043d\u0430 \u0438\u043a\u043e\u043d\u043a\u0435 &#171;mail.stack&#187;:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var isFavorite = false      var body: some View {         Button(action: { isFavorite.toggle() }) {             Label(\"Activate Inbox Zero\", systemImage: \"mail.stack\")         }         .symbolEffect(.bounce.down, value: isFavorite)         .font(.largeTitle)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5c6\/214\/bac\/5c6214bac143f4be0276fa4de91221cf.webp\" width=\"814\" height=\"246\"\/><\/figure>\n<p>\u0427\u0435\u0441\u0442\u043d\u043e \u0433\u043e\u0432\u043e\u0440\u044f, \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0432\u0430\u0440\u0438\u0430\u0446\u0438\u0439, \u0438 \u0432\u044b \u0434\u0430\u0436\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u0434\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u0438 \u0438 \u0447\u0438\u0441\u043b\u0430 \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u0439.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u0435\u0442 \u0441\u0438\u043c\u0432\u043e\u043b \u0442\u0440\u0438 \u0440\u0430\u0437\u0430 \u0441\u043e \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\u044e \u0432 \u0442\u0440\u0438 \u0440\u0430\u0437\u0430 \u0432\u044b\u0448\u0435 \u043e\u0431\u044b\u0447\u043d\u043e\u0439:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var isFavorite = false      var body: some View {         Button(action: { isFavorite.toggle() }) {             Label(\"Activate Inbox Zero\", systemImage: \"mail.stack\")         }         .symbolEffect(.bounce, options: .speed(3).repeat(3), value: isFavorite)         .font(.largeTitle)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/a2f\/414\/11d\/a2f41411d6ddfe0f7f89ea3517977921.webp\" width=\"900\" height=\"264\"\/><\/figure>\n<p>\u0410\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u044b\u043c \u0446\u0432\u0435\u0442\u043e\u043c \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u043d\u0430, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 SF Symbols \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0443\u043f\u0440\u0430\u0432\u043b\u044f\u0442\u044c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043a\u0430\u0436\u0434\u043e\u0433\u043e \u0441\u043b\u043e\u044f &#8212; <code>.variableColor.iterative<\/code> \u043e\u043a\u0440\u0430\u0448\u0438\u0432\u0430\u0435\u0442 \u043a\u0430\u0436\u0434\u044b\u0439 \u0441\u043b\u043e\u0439 \u043f\u043e \u043e\u0447\u0435\u0440\u0435\u0434\u0438, <code>.variableColor.cumulative<\/code> \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u043a\u0430\u0436\u0434\u044b\u0439 \u043d\u043e\u0432\u044b\u0439 \u0441\u043b\u043e\u0439 \u043a \u0443\u0436\u0435 \u043e\u043a\u0440\u0430\u0448\u0435\u043d\u043d\u044b\u043c \u0441\u043b\u043e\u044f\u043c, \u0438 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c <code>reversing<\/code> \u043a \u043b\u044e\u0431\u043e\u043c\u0443 \u0438\u0437 \u044d\u0442\u0438\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432, \u0447\u0442\u043e\u0431\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043f\u0440\u043e\u0438\u0433\u0440\u044b\u0432\u0430\u043b\u0430\u0441\u044c \u0432\u043f\u0435\u0440\u0435\u0434, \u0430 \u0437\u0430\u0442\u0435\u043c \u043d\u0430\u0437\u0430\u0434.<\/p>\n<p>\u0412\u043e\u0442 \u0431\u043e\u043b\u0435\u0435 \u043e\u0431\u044a\u0435\u043c\u043d\u044b\u0439 \u043f\u0440\u0438\u043c\u0435\u0440, \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0438\u0440\u0443\u044e\u0449\u0438\u0439 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var animationsRunning = false      var body: some View {         Button(\"Start Animations\") {             withAnimation {                 animationsRunning.toggle()             }         }          VStack {             HStack {                 Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.iterative, value: animationsRunning)                  Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.cumulative, value: animationsRunning)                  Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.reversing.iterative, value: animationsRunning)                  Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.reversing.cumulative, value: animationsRunning)             }              HStack {                 Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.iterative, options: .repeating, value: animationsRunning)                  Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.cumulative, options: .repeat(3), value: animationsRunning)                  Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.reversing.iterative, options: .speed(3), value: animationsRunning)                  Image(systemName: \"square.stack.3d.up\")                     .symbolEffect(.variableColor.reversing.cumulative, options: .repeat(3).speed(3), value: animationsRunning)             }         }         .font(.largeTitle)     } } <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/30e\/f46\/a0e\/30ef46a0ea3764f553f8ceb1de4ff278.gif\" width=\"472\" height=\"328\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/30e\/f46\/a0e\/30ef46a0ea3764f553f8ceb1de4ff278.gif\"\/><\/figure>\n<p>\u0418 \u043d\u0430\u043a\u043e\u043d\u0435\u0446, \u0435\u0441\u043b\u0438 \u0432\u044b \u0441\u043e\u0445\u0440\u0430\u043d\u044f\u0435\u0442\u0435 \u0441\u0432\u043e\u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043d\u0435\u0438\u0437\u043c\u0435\u043d\u043d\u044b\u043c\u0438, \u0430 \u043b\u0438\u0448\u044c \u043c\u0435\u043d\u044f\u0435\u0442\u0435 \u0438\u0445 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 &#8212; \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0435 \u0438\u043a\u043e\u043d\u043a\u0443 \u0434\u043b\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f <code>Label<\/code> \u043d\u0430 \u043e\u0441\u043d\u043e\u0432\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f &#8212; \u0442\u043e\u0433\u0434\u0430 \u0432\u0430\u043c \u0441\u043b\u0435\u0434\u0443\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>contentTransition()<\/code> \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u043e\u0434\u043d\u0438\u043c \u0438\u0437 \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u043e\u0432 \u0434\u043b\u044f \u0441\u043c\u0435\u043d\u044b \u0438\u043a\u043e\u043d\u043e\u043a.<\/p>\n<p>\u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434 <code>.replace<\/code>, \u0447\u0442\u043e\u0431\u044b \u0441\u0442\u0430\u0440\u0430\u044f \u0438\u043a\u043e\u043d\u043a\u0430 \u043f\u043b\u0430\u0432\u043d\u043e \u0438\u0441\u0447\u0435\u0437\u043b\u0430, \u0430 \u043d\u0430 \u0435\u0435 \u043c\u0435\u0441\u0442\u0435 \u043f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u043d\u043e\u0432\u0430\u044f:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var isFavorite = false      var body: some View {         VStack {             Button {                 withAnimation {                     isFavorite.toggle()                 }             } label: {                 Label(\"Toggle Favorite\", systemImage: isFavorite ? \"checkmark\": \"heart\")             }             .contentTransition(.symbolEffect(.replace))         }         .font(.largeTitle)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/cd2\/349\/93a\/cd234993a5be1b3ce93ceaec889ca5a5.webp\" width=\"696\" height=\"242\"\/><\/figure>\n<h4>\u0412\u044b\u0437\u043e\u0432 \u0437\u0430\u0432\u0435\u0440\u0448\u0430\u044e\u0449\u0435\u0433\u043e \u0431\u043b\u043e\u043a\u0430 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u044f \u043f\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u044e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438<\/h4>\n<p>\u0412 SwiftUI, \u0444\u0443\u043d\u043a\u0446\u0438\u044f <code>withAnimation()<\/code> \u043c\u043e\u0436\u0435\u0442 \u043e\u043f\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0441 \u043a\u043e\u043b\u0431\u044d\u043a\u043e\u043c \u043f\u0440\u0438 \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0438, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0437\u0430\u0434\u0430\u0435\u0442\u0441\u044f \u043a\u043e\u0434, \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u044e\u0449\u0438\u0439\u0441\u044f \u043f\u043e \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043c\u0435\u0441\u0442\u043e\u043c \u0434\u043b\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0432\u0430\u0448\u0435\u0439 \u043f\u0440\u043e\u0433\u0440\u0430\u043c\u043c\u044b, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043f\u0440\u043e\u0441\u0442\u043e\u0439 \u043c\u0435\u0442\u043e\u0434 \u0434\u043b\u044f \u0446\u0435\u043f\u043e\u0447\u043a\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u2013 \u0430\u043d\u0438\u043c\u0438\u0440\u0443\u044f \u0447\u0442\u043e-\u0442\u043e \u0441\u043d\u0430\u0447\u0430\u043b\u0430, \u0430 \u0437\u0430\u0442\u0435\u043c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043a\u043d\u043e\u043f\u043a\u0438, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0432 \u0440\u0430\u0437\u043c\u0435\u0440\u0435, \u0430 \u0437\u0430\u0442\u0435\u043c \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0439:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var scaleUp = false     @State private var fadeOut = false      var body: some View {         Button(\"Tap Me!\") {             withAnimation {                 scaleUp = true             } completion: {                 withAnimation {                     fadeOut = true                 }             }         }         .scaleEffect(scaleUp ? 3 : 1)         .opacity(fadeOut ? 0 : 1)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/eff\/a9d\/3a5\/effa9d3a562ab06f2a2e33610c2b69b9.gif\" width=\"686\" height=\"208\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/eff\/a9d\/3a5\/effa9d3a562ab06f2a2e33610c2b69b9.gif\"\/><\/figure>\n<p>\u041f\u0440\u0430\u0432\u0434\u0430 \u0437\u0434\u0435\u0441\u044c \u0435\u0441\u0442\u044c \u043e\u0434\u0438\u043d \u043d\u044e\u0430\u043d\u0441, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0436\u0435\u0442 \u0437\u0430\u0441\u0442\u0430\u0442\u044c \u0432\u0430\u0441 \u0432\u0440\u0430\u0441\u043f\u043b\u043e\u0445: \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 &#171;spring&#187; \u0443 \u0432\u0430\u0441 \u043c\u043e\u0436\u0435\u0442 \u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 &#171;\u0445\u0432\u043e\u0441\u0442&#187; \u043c\u0435\u043b\u043a\u043e\u0433\u043e \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u044f \u0432 \u043a\u043e\u043d\u0446\u0435, \u043a\u043e\u0433\u0434\u0430 \u0432\u0430\u0448\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u043a\u0440\u0430\u0439\u043d\u0435 \u043c\u0430\u043b\u044b\u0435 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b, \u043d\u0435\u043f\u0440\u0438\u043c\u0435\u0442\u043d\u044b\u0435 \u0434\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f.<\/p>\n<p>\u0421\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 <code>withAnimation()<\/code> \u0432 SwiftUI \u043f\u0440\u0435\u0434\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442, \u0447\u0442\u043e \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u043d\u043e\u0439, \u043d\u0435\u0441\u043c\u043e\u0442\u0440\u044f \u043d\u0430 \u044d\u0442\u043e\u0442 &#171;\u0445\u0432\u043e\u0441\u0442&#187; \u0438\u0437 \u043c\u0438\u043a\u0440\u043e \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0439. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u0434\u043e\u0436\u0434\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u043e\u043a\u043e\u043d\u0447\u0430\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0435\u0440\u0435\u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0434\u0430\u043d\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0432\u043e\u0442 \u0442\u0430\u043a:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var scaleUp = false     @State private var fadeOut = false      var body: some View {         Button(\"Tap Me!\") {             withAnimation(.bouncy, completionCriteria: .removed) {                 scaleUp = true             } completion: {                 withAnimation {                     fadeOut = true                 }             }         }         .scaleEffect(scaleUp ? 3 : 1)         .opacity(fadeOut ? 0 : 1)     } } <\/code><\/pre>\n<p>\u041d\u043e \u044f \u0431\u044b \u043d\u0435 \u0441\u043e\u0432\u0435\u0442\u043e\u0432\u0430\u043b \u0434\u0435\u043b\u0430\u0442\u044c \u044d\u0442\u043e, \u0435\u0441\u043b\u0438 \u0443 \u0432\u0430\u0441 \u043d\u0435\u0442 \u043e\u0441\u043e\u0431\u043e\u0433\u043e \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f &#8212; \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u043e\u043b\u0436\u043d\u044b \u043f\u043e\u043a\u0440\u044b\u0442\u044c \u0431\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u043e \u0441\u043b\u0443\u0447\u0430\u0435\u0432.<\/p>\n<p><strong>\u0421\u043e\u0432\u0435\u0442<\/strong>: \u0415\u0441\u043b\u0438 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u044b \u0431\u043e\u043b\u0435\u0435 \u0441\u043b\u043e\u0436\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b, \u0432\u043c\u0435\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043a\u043e\u043b\u0431\u044d\u043a\u0430, \u043b\u0443\u0447\u0448\u0435 \u0441\u043c\u043e\u0442\u0440\u0435\u0442\u044c \u0432 \u0441\u0442\u043e\u0440\u043e\u043d\u0443 <code>PhaseAmimator<\/code> \u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>phaseAnimator<\/code>.<\/p>\n<h4>\u0421\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0443\u043f\u0435\u043d\u0447\u0430\u0442\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c PhaseAnimator<\/h4>\n<p>\u0412 SwiftUI \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 <code>PhaseAnimator<\/code> \u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>phaseAnimator<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043c\u043d\u043e\u0433\u043e\u0441\u0442\u0443\u043f\u0435\u043d\u0447\u0430\u0442\u044b\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043f\u0435\u0440\u0435\u043a\u043b\u044e\u0447\u0430\u044f\u0441\u044c \u043c\u0435\u0436\u0434\u0443 \u0444\u0430\u0437\u0430\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043d\u0435\u043f\u0440\u0435\u0440\u044b\u0432\u043d\u043e, \u043b\u0438\u0431\u043e \u043f\u0440\u0438 \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u043e\u0433\u043e \u0442\u0440\u0438\u0433\u0433\u0435\u0440\u0430.<\/p>\n<p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0442\u0430\u043a\u0438\u0445 \u043c\u043d\u043e\u0433\u043e\u0444\u0430\u0437\u043e\u0432\u044b\u0445 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441\u043e\u0441\u0442\u043e\u0438\u0442 \u0438\u0437 \u0442\u0440\u0435\u0445 \u044d\u0442\u0430\u043f\u043e\u0432:<\/p>\n<ol>\n<li>\n<p>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u0444\u0430\u0437: \u0424\u0430\u0437\u044b \u0432 \u044d\u0442\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u0441\u043e\u0431\u043e\u0439 \u044d\u0442\u0430\u043f\u044b \u0438\u043b\u0438 \u0448\u0430\u0433\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438. \u042d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043b\u044e\u0431\u043e\u0439 \u0442\u0438\u043f \u043f\u043e\u0441\u043b\u0435\u0434\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u0445\u043e\u0442\u044f \u0440\u0430\u0431\u043e\u0442\u0430 \u0441 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0435\u043c <code>CaseIterable<\/code> \u043c\u043e\u0436\u0435\u0442 \u043e\u043a\u0430\u0437\u0430\u0442\u044c\u0441\u044f \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u043e\u0439.<\/p>\n<\/li>\n<li>\n<p>\u041e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u0444\u0430\u0437\u044b: \u0417\u0434\u0435\u0441\u044c \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442\u0441\u044f \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u043e\u0434\u043d\u0443 \u0438\u0437 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0432\u0430\u043c\u0438 \u0444\u0430\u0437 \u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0432\u0430\u0448\u0438 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b (\u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f) \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u043d\u0438 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u043b\u0438 \u043e\u0436\u0438\u0434\u0430\u0435\u043c\u043e\u043c\u0443 \u0432\u0438\u0434\u0443 \u0432 \u044d\u0442\u043e\u0439 \u0444\u0430\u0437\u0435. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0432\u044b \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0435, \u043a\u0430\u043a \u0434\u043e\u043b\u0436\u043d\u044b \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c \u0432\u0430\u0448\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430 \u043a\u0430\u0436\u0434\u043e\u043c \u044d\u0442\u0430\u043f\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438.<\/p>\n<\/li>\n<li>\n<p>\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0442\u0440\u0438\u0433\u0433\u0435\u0440\u0430 (\u043e\u043f\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e): \u0422\u0440\u0438\u0433\u0433\u0435\u0440 \u0432 \u044d\u0442\u043e\u043c \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 &#8212; \u044d\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u0438\u043b\u0438 \u0443\u0441\u043b\u043e\u0432\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0437\u0430\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c\u0441\u044f \u0441\u043d\u0430\u0447\u0430\u043b\u0430. \u0411\u0435\u0437 \u044d\u0442\u043e\u0433\u043e \u0442\u0440\u0438\u0433\u0433\u0435\u0440\u0430 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u043f\u0440\u0435\u0440\u044b\u0432\u043d\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u044f \u043e\u0442 \u043e\u0434\u043d\u043e\u0439 \u0444\u0430\u0437\u044b \u043a \u0434\u0440\u0443\u0433\u043e\u0439.<\/p>\n<\/li>\n<\/ol>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0435 \u043a\u043e\u0434\u0430 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u0441\u0442\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0441\u043d\u0430\u0447\u0430\u043b\u0430 \u0434\u0435\u043b\u0430\u0435\u0442 \u0442\u0435\u043a\u0441\u0442 \u043c\u0438\u043d\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u0438 \u043d\u0435\u0432\u0438\u0434\u0438\u043c\u044b\u043c, \u0437\u0430\u0442\u0435\u043c \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0435\u0442 \u0435\u0433\u043e \u0434\u043e \u043e\u0440\u0438\u0433\u0438\u043d\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430, \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0434\u0435\u043b\u0430\u044f \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u0438\u0434\u0438\u043c\u044b\u043c, \u0438, \u043d\u0430\u043a\u043e\u043d\u0435\u0446, \u0434\u043e\u0432\u043e\u0434\u0438\u0442 \u0435\u0433\u043e \u0434\u043e \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440\u0430, \u0441\u043d\u043e\u0432\u0430 \u0434\u0435\u043b\u0430\u044f \u043d\u0435\u0432\u0438\u0434\u0438\u043c\u044b\u043c. \u0414\u043b\u044f \u043e\u0431\u043e\u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0443\u0440\u043e\u0432\u043d\u0435\u0439 \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043c\u0430\u0441\u0441\u0438\u0432 \u0447\u0438\u0441\u0435\u043b 0, 1 \u0438 3, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0445 \u0441\u043e\u0431\u043e\u0439 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u043f\u0440\u043e\u0446\u0435\u043d\u0442\u044b \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f (0%, 100% \u0438 300%). \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u0442\u0435\u043a\u0441\u0442 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u0432\u0438\u0434\u0438\u043c\u044b\u043c, \u043a\u043e\u0433\u0434\u0430 \u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440 \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442 100% (\u0447\u0438\u0441\u043b\u043e 1 \u0432 \u043c\u0430\u0441\u0441\u0438\u0432\u0435):<\/p>\n<pre><code class=\"swift\">Text(\"Hello, world!\")     .font(.largeTitle)     .phaseAnimator([0, 1, 3]) { view, phase in         view             .scaleEffect(phase)             .opacity(phase == 1 ? 1 : 0)     } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/d5f\/07f\/c66\/d5f07fc664ce0199a41793e93434ca07.webp\" width=\"1186\" height=\"294\"\/><\/figure>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>phaseAnimator<\/code> \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u043a \u043e\u0434\u043d\u043e\u043c\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430. \u0415\u0441\u043b\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0441\u0440\u0430\u0437\u0443 \u043a \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c \u043e\u0431\u044a\u0435\u043a\u0442\u0430\u043c, \u0442\u043e \u0432\u043c\u0435\u0441\u0442\u043e \u043d\u0435\u0433\u043e \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 <code>PhaseAnimator<\/code>. \u0412 \u0442\u0430\u043a\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435, \u043e\u0431\u0451\u0440\u043d\u0443\u0442\u044b\u0435 \u0432 \u044d\u0442\u043e\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0431\u0443\u0434\u0443\u0442 \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0442\u044c\u0441\u044f \u043c\u0435\u0436\u0434\u0443 \u0444\u0430\u0437\u0430\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e. \u042d\u0442\u043e \u0443\u0434\u043e\u0431\u043d\u043e, \u0435\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u0447\u0442\u043e\u0431\u044b \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u0441\u0438\u043d\u0445\u0440\u043e\u043d\u043d\u043e:<\/p>\n<pre><code class=\"swift\">VStack(spacing: 50) {     PhaseAnimator([0, 1, 3]) { value in         Text(\"Hello, world!\")             .font(.largeTitle)             .scaleEffect(value)             .opacity(value == 1 ? 1 : 0)          Text(\"Goodbye, world!\")             .font(.largeTitle)             .scaleEffect(3 - value)             .opacity(value == 1 ? 1 : 0)     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/09b\/75a\/4e4\/09b75a4e4556a02b684e252609582499.webp\" width=\"1104\" height=\"470\"\/><\/figure>\n<p>\u0414\u043b\u044f \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u0430 \u0438\u0437 \u043e\u0434\u043d\u043e\u0439 \u0444\u0430\u0437\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0432 \u0434\u0440\u0443\u0433\u0443\u044e \u0442\u0430\u043a \u0436\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0435. \u041f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u0435\u0442 \u0438\u043c\u0435\u0442\u044c \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 &#171;\u0441\u044b\u0440\u044b\u0435&#187; \u0438\u043b\u0438 \u0431\u0430\u0437\u043e\u0432\u044b\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f (\u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 &#8212; \u0447\u0438\u0441\u043b\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u044e\u0442 \u0441\u0442\u0435\u043f\u0435\u043d\u044c \u043c\u0430\u0441\u0448\u0442\u0430\u0431\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u044f \u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438), \u043d\u043e \u044d\u0442\u043e \u043d\u0435 \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u0435. \u041d\u0438\u0436\u0435 \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d \u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u043e\u0433\u043e \u0436\u0435 \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043d\u043e \u0443\u0436\u0435 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">enum AnimationPhase: Double, CaseIterable {     case fadingIn = 0     case middle = 1     case zoomingOut = 3 }  struct ContentView: View {     var body: some View {         Text(\"Hello, world!\")             .font(.largeTitle)             .phaseAnimator(AnimationPhase.allCases) { view, phase in                 view                     .scaleEffect(phase.rawValue)                     .opacity(phase.rawValue == 1 ? 1 : 0)             }     } } <\/code><\/pre>\n<p>\u0410\u043d\u0438\u043c\u0430\u0442\u043e\u0440 \u0444\u0430\u0437 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u043d\u0435 \u0446\u0438\u043a\u043b\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u043b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e, \u0430 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u043b \u0435\u0435 \u043f\u043e \u043a\u043e\u043c\u0430\u043d\u0434\u0435. \u042d\u0442\u043e \u043c\u043e\u0436\u043d\u043e \u0441\u0434\u0435\u043b\u0430\u0442\u044c, \u0434\u043e\u0431\u0430\u0432\u0438\u0432 \u043a \u0430\u043d\u0438\u043c\u0430\u0442\u043e\u0440\u0443 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435-\u0442\u0440\u0438\u0433\u0433\u0435\u0440, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u0443\u0434\u0435\u0442 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c\u0441\u044f SwiftUI. \u0417\u043d\u0430\u0447\u0435\u043d\u0438\u0435\u043c \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b <code>UUID<\/code> \u0438\u043b\u0438 \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u043e \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u044e\u0449\u0435\u0435\u0441\u044f \u0447\u0438\u0441\u043b\u043e. \u041f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, SwiftUI \u0431\u0443\u0434\u0435\u0442 \u0441\u0431\u0440\u0430\u0441\u044b\u0432\u0430\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0442\u043e\u0440 \u0438 \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044e.<\/p>\n<p>\u0412 \u043d\u0438\u0436\u0435\u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u043d\u0430\u0436\u0438\u043c\u0430\u0435\u0442 \u043d\u0430 \u043a\u043d\u043e\u043f\u043a\u0443, \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0443\u0435\u0442\u0441\u044f \u0442\u0440\u0435\u0445\u0448\u0430\u0433\u043e\u0432\u0430\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0438\u0437 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u044f. \u0412\u043d\u0430\u0447\u0430\u043b\u0435 \u043c\u044b \u0437\u0430\u0434\u0430\u0435\u043c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u0444\u0430\u0437\u044b \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0430 \u0437\u0430\u0442\u0435\u043c \u043f\u0440\u043e\u0445\u043e\u0434\u0438\u043c \u0447\u0435\u0440\u0435\u0437 \u043d\u0438\u0445 \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437, \u043a\u043e\u0433\u0434\u0430 \u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430:<\/p>\n<pre><code class=\"swift\">enum AnimationPhase: CaseIterable {     case start, middle, end }  struct ContentView: View {     @State private var animationStep = 0      var body: some View {         Button(\"Tap Me!\") {             animationStep += 1         }         .font(.largeTitle)         .phaseAnimator(AnimationPhase.allCases, trigger: animationStep) { content, phase in             content                 .blur(radius: phase == .start ? 0 : 10)                 .scaleEffect(phase == .middle ? 3 : 1)         }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/79e\/041\/ecb\/79e041ecba610f7b8dfeb97d23ab1843.webp\" width=\"898\" height=\"428\"\/><\/figure>\n<p>\u0414\u043b\u044f \u043b\u0443\u0447\u0448\u0435\u0439 \u0447\u0438\u0442\u0430\u0435\u043c\u043e\u0441\u0442\u0438 \u043a\u043e\u0434\u0430 \u043a \u0444\u0430\u0437\u0430\u043c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0432\u044b\u0447\u0438\u0441\u043b\u044f\u0435\u043c\u044b\u0435 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430, \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u043f\u0435\u0440\u0435\u0447\u0438\u0441\u043b\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">enum AnimationPhase: CaseIterable {     case fadingIn, middle, zoomingOut      var scale: Double {         switch self {         case .fadingIn: 0         case .middle: 1         case .zoomingOut: 3         }     }      var opacity: Double {         switch self {         case .fadingIn: 0         case .middle: 1         case .zoomingOut: 0         }     } }  struct ContentView: View {     var body: some View {         Text(\"Hello, world!\")             .font(.largeTitle)             .phaseAnimator(AnimationPhase.allCases) { content, phase in                 content                     .scaleEffect(phase.scale)                     .opacity(phase.opacity)             }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/05d\/9cc\/564\/05d9cc564f886dba7096023020a22179.webp\" width=\"1186\" height=\"294\"\/><\/figure>\n<h4>\u041a\u043e\u043c\u0431\u0438\u043d\u0438\u0440\u043e\u0432\u0430\u043d\u0438\u0435 \u0444\u043e\u0440\u043c \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043d\u043e\u0432\u044b\u0445 \u0444\u0438\u0433\u0443\u0440<\/h4>\n<p>\u0412\u0441\u0435 \u0433\u0435\u043e\u043c\u0435\u0442\u0440\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0444\u043e\u0440\u043c\u044b \u0432 SwiftUI \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0432\u043c\u0435\u0449\u0430\u0442\u044c \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u0430\u043c\u0438 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u043d\u043e\u0432\u044b\u0445 \u0444\u0438\u0433\u0443\u0440. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0442\u0430\u043a\u0438\u0435 \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u0438 \u043a\u0430\u043a \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 (\u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u044c, \u0441\u043e\u0432\u043c\u0435\u0449\u0430\u044e\u0449\u0443\u044e \u043e\u0431\u0435 \u0444\u0438\u0433\u0443\u0440\u044b), \u043f\u0435\u0440\u0435\u0441\u0435\u0447\u0435\u043d\u0438\u0435 (\u0441\u043e\u0437\u0434\u0430\u0435\u0442 \u043e\u0431\u043b\u0430\u0441\u0442\u044c, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u0440\u0438\u0441\u0443\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u0432 \u043e\u0431\u0435\u0438\u0445 \u0444\u0438\u0433\u0443\u0440\u0430\u0445), \u043f\u0435\u0440\u0435\u0441\u0435\u0447\u0435\u043d\u0438\u0435 \u043b\u0438\u043d\u0438\u0439 (\u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u043b\u0438\u043d\u0438\u044e \u043e\u0434\u043d\u043e\u0439 \u0444\u0438\u0433\u0443\u0440\u044b, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0430\u0441\u043b\u0430\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430 \u0437\u0430\u043b\u0438\u0432\u043a\u0443 \u0434\u0440\u0443\u0433\u043e\u0439) \u0438 \u043c\u043d\u043e\u0433\u0438\u0435 \u0434\u0440\u0443\u0433\u0438\u0435.<\/p>\n<p>\u0412 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043a\u0440\u0443\u0433 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442\u0441\u044f \u0441 \u043a\u0430\u043f\u0441\u0443\u043b\u043e\u0439, \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u044e\u0449\u0435\u0439 \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u043a\u0440\u0443\u0436\u043d\u043e\u0441\u0442\u0438 \u043d\u0430 100 \u043f\u043e\u0438\u043d\u0442\u043e\u0432, \u0441 \u0437\u0430\u043b\u0438\u0432\u043a\u043e\u0439 \u0438\u0442\u043e\u0433\u043e\u0432\u043e\u0433\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430 \u0432 \u0441\u0438\u043d\u0438\u0439 \u0446\u0432\u0435\u0442:<\/p>\n<pre><code class=\"swift\">Circle()     .union(.capsule.inset(by: 100))     .fill(.blue) <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/6a8\/c91\/3c7\/6a8c913c7dfc9286ceff71bdc106ca11.png\" width=\"665\" height=\"366\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6a8\/c91\/3c7\/6a8c913c7dfc9286ceff71bdc106ca11.png\"\/><\/figure>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0434\u043d\u043e\u0439 \u0444\u043e\u0440\u043c\u044b \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u043f\u0440\u0435\u0438\u043c\u0443\u0449\u0435\u0441\u0442\u0432\u043e\u043c: \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0438\u0442 \u0435\u0441\u0442\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c \u043f\u0440\u0438 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0438 \u043f\u0440\u043e\u0437\u0440\u0430\u0447\u043d\u043e\u0441\u0442\u0438, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u0432\u044b \u0440\u0435\u043d\u0434\u0435\u0440\u0438\u0442\u0435 \u043d\u0435 \u0434\u0432\u0435 \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044e\u0449\u0438\u0435\u0441\u044f \u0444\u043e\u0440\u043c\u044b \u043f\u043e \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u0430 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u044f\u0435\u0442\u0435 \u0438\u0445 \u0432 \u043e\u0434\u043d\u0443.<\/p>\n<p>\u0422\u0430\u043a\u0438\u043c \u0436\u0435 \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>lineSubtraction()<\/code> \u0434\u043b\u044f \u0438\u0437\u0432\u043b\u0435\u0447\u0435\u043d\u0438\u044f \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 \u0438\u0437 \u043e\u043a\u0440\u0443\u0436\u043d\u043e\u0441\u0442\u0438. \u0412 \u044d\u0442\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u0440\u0435\u0437\u0430\u043d \u0438\u0437 \u043e\u043a\u0440\u0443\u0436\u043d\u043e\u0441\u0442\u0438, \u0430 \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0439 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442 \u043c\u044b \u043e\u0431\u0432\u043e\u0434\u0438\u043c \u043b\u0438\u043d\u0438\u0435\u0439 \u0441 \u043e\u043a\u0440\u0443\u0433\u043b\u044b\u043c \u043a\u043e\u043d\u0446\u043e\u043c. \u0412 \u0438\u0442\u043e\u0433\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0438\u043c \u043d\u043e\u0432\u0443\u044e \u0443\u043d\u0438\u043a\u0430\u043b\u044c\u043d\u0443\u044e \u0444\u0438\u0433\u0443\u0440\u0443, \u0447\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u043e, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u043d\u0435\u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0445 \u0438\u043b\u0438 \u0441\u043b\u043e\u0436\u043d\u044b\u0445 \u0433\u0440\u0430\u0444\u0438\u0447\u0435\u0441\u043a\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0432 SwiftUI:<\/p>\n<pre><code class=\"swift\">Circle()     .lineSubtraction(.rect.inset(by: 30))     .stroke(style: .init(lineWidth: 20, lineCap: .round))     .padding() <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/6ad\/edc\/818\/6adedc81880148a7dfe4da1eca13c38b.png\" width=\"513\" height=\"369\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6ad\/edc\/818\/6adedc81880148a7dfe4da1eca13c38b.png\"\/><\/figure>\n<p>\u0418\u043b\u0438 \u043c\u044b \u043c\u043e\u0433\u043b\u0438 \u0431\u044b \u0440\u0430\u0437\u043c\u0435\u0441\u0442\u0438\u0442\u044c \u043e\u0434\u0438\u043d \u043a\u0440\u0443\u0433 \u0441\u043b\u0435\u0432\u0430, \u0430 \u0437\u0430\u0442\u0435\u043c \u0432\u044b\u0447\u0435\u0441\u0442\u044c \u0434\u0440\u0443\u0433\u043e\u0439 \u043a\u0440\u0443\u0433, \u0441\u043c\u0435\u0449\u0435\u043d\u043d\u044b\u0439 \u0432\u043f\u0440\u0430\u0432\u043e:<\/p>\n<pre><code class=\"swift\">Circle()     .offset(x: -100)     .symmetricDifference(.circle.offset(x: 100))     .fill(.red)     .padding() <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2b1\/259\/ad4\/2b1259ad4521a3ec6c430c4e85eeeb8c.png\" width=\"600\" height=\"374\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2b1\/259\/ad4\/2b1259ad4521a3ec6c430c4e85eeeb8c.png\"\/><\/figure>\n<h4>\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0440\u0430\u0437\u043c\u0435\u0440\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0435\u0433\u043e \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430<\/h4>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>containerRelativeFrame()<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440\u044b \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0435\u043b\u044c\u043d\u043e \u0438\u0445 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430. \u041a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u043e\u043c \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0441\u0442\u0443\u043f\u0430\u0442\u044c \u043a\u0430\u043a \u0432\u0441\u0451 \u043e\u043a\u043d\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f, \u0442\u0430\u043a \u0438 ScrollView \u0438\u043b\u0438 \u0441\u0442\u0440\u043e\u043a\u0430 \u0441\u043f\u0438\u0441\u043a\u0430.<\/p>\n<p>\u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u0434\u0430\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u043d\u0438 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0430\u0434\u0430\u043f\u0442\u0438\u0440\u043e\u0432\u0430\u043b\u0438\u0441\u044c \u043a \u0440\u0430\u0437\u043c\u0435\u0440\u0430\u043c \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u043d\u0438 \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f. \u042d\u0442\u043e \u0443\u0434\u043e\u0431\u043d\u043e \u043f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0430\u0434\u0430\u043f\u0442\u0438\u0432\u043d\u043e\u0433\u043e \u0434\u0438\u0437\u0430\u0439\u043d\u0430, \u043a\u043e\u0433\u0434\u0430 \u0432\u0430\u0436\u043d\u043e, \u0447\u0442\u043e\u0431\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u043b\u0438\u0441\u044c \u043f\u0440\u0438 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u043e\u043a\u043d\u0430 \u0438\u043b\u0438 \u043f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u043d\u0430 \u0440\u0430\u0437\u043d\u044b\u0445 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u0441 \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u0440\u0430\u0437\u043c\u0435\u0440\u0430\u043c\u0438 \u044d\u043a\u0440\u0430\u043d\u0430.<\/p>\n<p>\u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u044d\u0442\u0438\u043c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0442\u0440\u0438 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0445 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430: \u043e\u0441\u044c, \u043a\u043e\u0442\u043e\u0440\u0443\u044e \u0432\u044b \u0441\u043e\u0431\u0438\u0440\u0430\u0435\u0442\u0435\u0441\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c, \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0441\u0435\u0433\u043c\u0435\u043d\u0442\u043e\u0432, \u043d\u0430 \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u0440\u0430\u0437\u0431\u0438\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e, \u0438 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0441\u0435\u0433\u043c\u0435\u043d\u0442\u043e\u0432, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u043f\u0440\u0438\u0445\u043e\u0434\u0438\u0442\u044c\u0441\u044f \u043d\u0430 \u043a\u0430\u0436\u0434\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u0438\u043b\u043b\u044e\u0441\u0442\u0440\u0430\u0446\u0438\u0438, \u0432 \u043f\u0440\u0438\u0432\u0435\u0434\u0435\u043d\u043d\u043e\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c, \u043d\u0430\u0445\u043e\u0434\u044f\u0449\u0438\u043c\u0441\u044f \u0432 <code>ScrollView<\/code>, \u0437\u0430\u0434\u0430\u0435\u0442\u0441\u044f \u0448\u0438\u0440\u0438\u043d\u0430, \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0430\u044f 2\/5 \u0448\u0438\u0440\u0438\u043d\u044b \u0438\u0445 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430:<\/p>\n<pre><code class=\"swift\">ScrollView(.horizontal, showsIndicators: false) {     HStack {         ForEach(0..&lt;10) { item in             Text(\"Item \\(item)\")                 .foregroundStyle(.white)                 .containerRelativeFrame(.horizontal, count: 5, span: 2, spacing: 10)                 .background(.blue)         }     } } <\/code><\/pre>\n<p>\u041f\u0435\u0440\u0432\u044b\u0435 \u0434\u0432\u0430 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430, <code>count<\/code> \u0438 <code>span<\/code>, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e\u0442\u0441\u044f \u0434\u043b\u044f \u0437\u0430\u0434\u0430\u043d\u0438\u044f \u0441\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u044f \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430. \u0412 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u043c\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f (scroll view) \u0440\u0430\u0437\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u043d\u0430 \u043f\u044f\u0442\u044c \u0440\u0430\u0432\u043d\u044b\u0445 \u0447\u0430\u0441\u0442\u0435\u0439 (count = 5), \u0430 \u043a\u0430\u0436\u0434\u043e\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0437\u0430\u043d\u0438\u043c\u0430\u0435\u0442 \u0434\u0432\u0435 \u043f\u044f\u0442\u044b\u0445 \u044d\u0442\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430 (span = 2).<\/p>\n<p>\u0422\u0430\u043a\u043e\u0435 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430 \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c \u0432\u0438\u0434\u0435\u0442\u044c \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e 2,5 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f &#8212; \u0434\u0432\u0430 \u043f\u043e\u043b\u043d\u044b\u0445 \u0438 \u043f\u043e\u043b\u043e\u0432\u0438\u043d\u0443 \u0442\u0440\u0435\u0442\u044c\u0435\u0433\u043e, \u0447\u0442\u043e \u043f\u043e\u0434\u0441\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442 \u043e \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438.<\/p>\n<p>\u041f\u0440\u0438 \u0440\u0430\u0437\u0434\u0435\u043b\u0435\u043d\u0438\u0438 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430 \u043c\u043e\u0436\u043d\u043e \u0432\u044b\u0431\u0438\u0440\u0430\u0442\u044c \u043b\u044e\u0431\u043e\u0435 \u0441\u043e\u043e\u0442\u043d\u043e\u0448\u0435\u043d\u0438\u0435, \u043d\u043e \u0447\u0430\u0441\u0442\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u0435\u043b\u0435\u043d\u0438\u0435 \u043d\u0430 12 \u0447\u0430\u0441\u0442\u0435\u0439, \u0442\u0430\u043a \u043a\u0430\u043a \u044d\u0442\u043e \u0447\u0438\u0441\u043b\u043e \u0434\u0435\u043b\u0438\u0442\u0441\u044f \u043d\u0430 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0434\u0435\u043b\u0438\u0442\u0435\u043b\u0435\u0439, \u0447\u0442\u043e \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442 \u0433\u0438\u0431\u043a\u043e\u0441\u0442\u0438 \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0435 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432.<\/p>\n<p>\u041a\u0440\u043e\u043c\u0435 \u0442\u043e\u0433\u043e, <code>containerRelativeFrame()<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0437\u0430\u0434\u0430\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043c\u0435\u0440\u044b \u043f\u043e \u043e\u0431\u0435\u0438\u043c \u043e\u0441\u044f\u043c, \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0439 (<code>[.horizontal, .vertical]<\/code>), \u0430 \u0442\u0430\u043a\u0436\u0435 \u0443\u043a\u0430\u0437\u044b\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0435 \u0432\u044b\u0440\u0430\u0432\u043d\u0438\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0432 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0435 \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 <code>alignment<\/code>.<\/p>\n<h3>\u041f\u0440\u043e\u0447\u0438\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u043d\u043e\u0432\u043e\u0432\u0432\u0435\u0434\u0435\u043d\u0438\u044f<\/h3>\n<h4>\u0418\u043d\u0442\u0435\u0433\u0440\u0430\u0446\u0438\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043a\u0443\u043f\u043e\u043a (in-app purchases) \u0432 SwiftUI<\/h4>\n<p>\u041f\u0440\u0438 \u0438\u043c\u043f\u043e\u0440\u0442\u0435 StoreKit \u0432\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>StoreView<\/code>, <code>SubscriptionStoreView<\/code> \u0438 <code>ProductView<\/code> \u0434\u043b\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043a\u0443\u043f\u043e\u043a, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0437\u0430\u043f\u0443\u0441\u043a \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0430 \u043f\u043e\u043a\u0443\u043f\u043a\u0438. \u041e\u0434\u043d\u0430\u043a\u043e \u0443\u0447\u0442\u0438\u0442\u0435, \u0447\u0442\u043e \u0432\u0430\u043c \u0432\u0441\u0435 \u0440\u0430\u0432\u043d\u043e \u043f\u0440\u0438\u0434\u0435\u0442\u0441\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u0443\u044e \u0447\u0430\u0441\u0442\u044c \u0440\u0430\u0431\u043e\u0442\u044b \u0441\u043e StoreKit, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0439 \u043f\u043e\u043a\u0443\u043f\u043a\u0438 \u0438 \u0442\u043e\u043c\u0443 \u043f\u043e\u0434\u043e\u0431\u043d\u043e\u0435. \u0422\u0430\u043a\u0436\u0435 \u0441\u0442\u043e\u0438\u0442 \u0443\u0447\u0435\u0441\u0442\u044c, \u0447\u0442\u043e Apple \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u044d\u0442\u043e\u0433\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0432 \u0431\u0443\u0434\u0443\u0449\u0438\u0445 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f\u0445.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e:<\/strong> \u0414\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441\u043e StoreKit, \u0435\u0433\u043e \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0438\u043c\u043f\u043e\u0440\u0442\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432 \u0441\u0430\u043c\u043e\u043c \u043d\u0430\u0447\u0430\u043b\u0435 \u0444\u0430\u0439\u043b\u0430.<\/p>\n<p>\u0412 \u0441\u0430\u043c\u043e\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435 \u0440\u0435\u0430\u043b\u0438\u0437\u0430\u0446\u0438\u0438 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c <code>ProductView<\/code> \u0441 \u043e\u0434\u043d\u0438\u043c \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430, \u0432\u043e\u0442 \u0442\u0430\u043a:<\/p>\n<pre><code class=\"swift\">\/\/ just show a single product ProductView(id: \"com.hackingwithswift.plus.subscription\") <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/5f2\/a34\/b10\/5f2a34b103aff9e5dc94db8ce9a37002.png\" width=\"252\" height=\"137\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/5f2\/a34\/b10\/5f2a34b103aff9e5dc94db8ce9a37002.png\"\/><\/figure>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e \u043d\u0430 \u043f\u0440\u0430\u043a\u0442\u0438\u043a\u0435 \u0432\u0430\u043c, \u0432\u0435\u0440\u043e\u044f\u0442\u043d\u043e, \u0437\u0430\u0445\u043e\u0447\u0435\u0442\u0441\u044f \u043f\u043e\u0438\u0433\u0440\u0430\u0442\u044c\u0441\u044f \u0441 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u043c\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u043c\u0438. \u041d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430 \u043c\u043e\u0436\u0435\u0442 \u0432\u043a\u043b\u044e\u0447\u0430\u0442\u044c \u0432 \u0441\u0435\u0431\u044f \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 (\u043a\u043e\u043c\u043f\u043e\u043d\u043e\u0432\u043a\u0430), \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430, \u0448\u0440\u0438\u0444\u0442\u043e\u0432, \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 (\u0441\u0442\u0438\u043b\u0438\u0437\u0430\u0446\u0438\u044f) \u0438 \u0442.\u0434., \u0447\u0442\u043e\u0431\u044b \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430 \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0438\u0432\u043b\u0435\u043a\u0430\u0442\u0435\u043b\u044c\u043d\u044b\u043c \u0438\u043b\u0438 \u0432\u043f\u0438\u0441\u044b\u0432\u0430\u044e\u0449\u0438\u043c\u0441\u044f \u0432 \u043e\u0431\u0449\u0443\u044e \u043a\u043e\u043d\u0446\u0435\u043f\u0446\u0438\u044e \u0434\u0438\u0437\u0430\u0439\u043d\u0430 \u0432\u0430\u0448\u0435\u0433\u043e \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">VStack {     Text(\"Welcome to my store\")         .font(.title)      ProductView(id: \"com.hackingwithswift.plus.subscription\") {         Image(systemName: \"crown\")     }     .productViewStyle(.compact)     .padding() } <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/281\/19e\/93f\/28119e93ff660d3a55064e738203ad1d.png\" width=\"396\" height=\"183\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/281\/19e\/93f\/28119e93ff660d3a55064e738203ad1d.png\"\/><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432, \u0442\u043e \u0443 \u0432\u0430\u0441 \u0435\u0441\u0442\u044c \u0434\u0432\u0430 \u043f\u0443\u0442\u0438. \u0412\u043e-\u043f\u0435\u0440\u0432\u044b\u0445, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430 \u0441\u0432\u043e\u0439 \u0432\u043a\u0443\u0441 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u0433\u0440\u0443\u043f\u043f\u044b <code>ProductView<\/code> \u0432 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u043c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0435. \u0412\u043e-\u0432\u0442\u043e\u0440\u044b\u0445, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0432\u043e\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c\u0441\u044f <code>StoreView<\/code>, \u0438 \u0443\u043a\u0430\u0437\u0430\u0442\u044c \u0441\u043f\u0438\u0441\u043e\u043a ID \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f. \u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u0442\u0430\u043a\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u0430:<\/p>\n<pre><code class=\"swift\">VStack {     Text(\"Hacking with Swift+\")         .font(.title)      StoreView(ids: [\"com.hackingwithswift.plus.subscription\", \"com.hackingwithswift.plus.lifetime\"]) } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/3d5\/7f9\/f4a\/3d57f9f4a28f3106cd5924e7ea977631.png\" width=\"657\" height=\"329\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/3d5\/7f9\/f4a\/3d57f9f4a28f3106cd5924e7ea977631.png\"\/><\/figure>\n<p>\u0421\u0442\u043e\u0438\u0442 \u043f\u043e\u043c\u043d\u0438\u0442\u044c, \u0447\u0442\u043e \u0445\u043e\u0442\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0430\u0435\u0442 \u043f\u0440\u043e\u0434\u0443\u043a\u0442, \u043e\u043d \u043d\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0443 \u043f\u043e\u0441\u043b\u0435 \u043f\u043e\u043a\u0443\u043f\u043a\u0438 \u0438\u043b\u0438 \u0432\u043e\u0441\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u043a\u0443\u043f\u043e\u043a. \u041d\u0435 \u0437\u0430\u0431\u044b\u0432\u0430\u0439\u0442\u0435 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0441\u0442\u0430\u0442\u0443\u0441\u043e\u0432 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0439.<\/p>\n<p><strong>\u0421\u043e\u0432\u0435\u0442:<\/strong> <code>ProductView<\/code>, <code>StoreView<\/code> \u0438 <code>SubscriptionStoreView<\/code> \u0432 iOS \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043f\u0440\u043e\u0432\u0435\u0440\u044f\u044e\u0442 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 Screen Time \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u0447\u0442\u043e\u0431\u044b \u0443\u0431\u0435\u0434\u0438\u0442\u044c\u0441\u044f, \u0447\u0442\u043e \u043e\u043d \u0440\u0430\u0437\u0440\u0435\u0448\u0438\u043b \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u043f\u043e\u043a\u0443\u043f\u043a\u0438.<\/p>\n<blockquote>\n<p>Screen Time \u2014 \u044d\u0442\u043e \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u0432 iOS, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c (\u0438\u043b\u0438 \u0438\u0445 \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044f\u043c\/\u043e\u043f\u0435\u043a\u0443\u043d\u0430\u043c) \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0440\u0435\u043c\u044f, \u043f\u0440\u043e\u0432\u0435\u0434\u0435\u043d\u043d\u043e\u0435 \u0441 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e\u043c, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0432\u0430\u0442\u044c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c \u0444\u0443\u043d\u043a\u0446\u0438\u044f\u043c \u0438 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f\u043c, \u0432\u043a\u043b\u044e\u0447\u0430\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u043f\u043e\u043a\u0443\u043f\u043a\u0438. \u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0435\u0441\u043b\u0438 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u043f\u043e\u043a\u0443\u043f\u043a\u0438 \u043e\u0442\u043a\u043b\u044e\u0447\u0435\u043d\u044b \u0432 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0430\u0445 Screen Time, \u044d\u0442\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0443\u0447\u0442\u0443\u0442 \u044d\u0442\u043e.<\/p>\n<\/blockquote>\n<p><code>StoreView<\/code> \u043e\u0442\u043b\u0438\u0447\u043d\u043e \u0441\u043f\u0440\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441 \u0437\u0430\u0434\u0430\u0447\u0435\u0439 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u043a\u0443\u043f\u043e\u043a, \u043d\u043e, \u043d\u0430 \u043c\u043e\u0439 \u0432\u0437\u0433\u043b\u044f\u0434, \u0438\u0441\u0442\u0438\u043d\u043d\u0430\u044f \u0446\u0435\u043d\u043d\u043e\u0441\u0442\u044c \u0437\u0430\u043a\u043b\u044e\u0447\u0430\u0435\u0442\u0441\u044f \u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 <code>SubscriptionStoreView<\/code> \u0434\u043b\u044f \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043f\u043e\u0434\u043f\u0438\u0441\u043e\u043a. \u0411\u043e\u043b\u044c\u0448\u0438\u043d\u0441\u0442\u0432\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u0432 \u0441\u0442\u0430\u043b\u043a\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u0441 \u0442\u0440\u0443\u0434\u043d\u043e\u0441\u0442\u044f\u043c\u0438 \u043f\u0440\u0438 \u043f\u043e\u043f\u044b\u0442\u043a\u0435 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0443\u0434\u043e\u0432\u043b\u0435\u0442\u0432\u043e\u0440\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442 \u0441 \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0430\u043c\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u044b \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u043e\u0432\u0430\u043b \u0442\u0440\u0435\u0431\u043e\u0432\u0430\u043d\u0438\u044f\u043c \u043a\u043e\u043c\u0430\u043d\u0434\u044b \u043f\u043e \u043f\u0440\u043e\u0432\u0435\u0440\u043a\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0439 (App Review) \u0432 Apple. \u041a\u043b\u044e\u0447\u0435\u0432\u044b\u043c \u0430\u0441\u043f\u0435\u043a\u0442\u043e\u043c \u0437\u0434\u0435\u0441\u044c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u044f\u0441\u043d\u043e\u0435 \u0438 \u0447\u0435\u0442\u043a\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0443\u0441\u043b\u043e\u0432\u0438\u0439 \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0439 \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0438 \u0434\u043b\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u0439.<\/p>\n<p>\u0412 \u0431\u0430\u0437\u043e\u0432\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435 \u0432\u0430\u043c \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0443\u0436\u043d\u043e \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u044c \u0438\u0434\u0435\u043d\u0442\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u043e\u0432 \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u043d\u043e \u0443 \u0432\u0430\u0441 \u0442\u0430\u043a\u0436\u0435 \u0435\u0441\u0442\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0432\u0438\u0434\u0438\u043c\u043e\u0441\u0442\u044c \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u043a\u043d\u043e\u043f\u043e\u043a. \u041a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, \u043c\u043e\u0436\u043d\u043e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0438 \u0434\u043b\u044f \u0432\u043e\u0441\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u043a\u0443\u043f\u043e\u043a \u0438\u043b\u0438 \u0430\u043a\u0442\u0438\u0432\u0430\u0446\u0438\u0438 \u043f\u0440\u043e\u043c\u043e\u043a\u043e\u0434\u0430:<\/p>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/2ed\/1a9\/59b\/2ed1a959b49ba967bf00b581528f9858.png\" width=\"658\" height=\"330\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2ed\/1a9\/59b\/2ed1a959b49ba967bf00b581528f9858.png\"\/><\/figure>\n<pre><code class=\"swift\">SubscriptionStoreView(productIDs:  [\"com.hackingwithswift.plus.subscription\"])     .storeButton(.visible, for: .restorePurchases, .redeemCode) <\/code><\/pre>\n<p>\u041d\u043e \u0441\u0430\u043c\u043e\u0435 \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u043e\u0435 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442\u0441\u044f \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u043a\u0430\u0441\u0442\u043e\u043c\u0438\u0437\u0430\u0446\u0438\u0438 \u043d\u0430\u0441\u0442\u0440\u043e\u0435\u043a \u0434\u0430\u043d\u043d\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0438 \u0434\u043b\u044f \u043f\u0435\u0440\u0441\u043e\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0433\u043e \u0432\u0445\u043e\u0434\u0430 \u0432 \u0441\u0438\u0441\u0442\u0435\u043c\u0443, \u0443\u0441\u043b\u043e\u0432\u0438\u0439 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0443\u0441\u043b\u0443\u0433 \u0438 \u043f\u043e\u043b\u0438\u0442\u0438\u043a\u0438 \u043a\u043e\u043d\u0444\u0438\u0434\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u044d\u043a\u0440\u0430\u043d\u044b \u0434\u043b\u044f \u0438\u0445 \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0430\u0446\u0438\u0438, \u0432\u0441\u0442\u0430\u0432\u0438\u0442\u044c \u0432\u0441\u043f\u043b\u044b\u0432\u0430\u044e\u0449\u0435\u0435 \u043e\u043a\u043d\u043e, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043d\u043e\u043f\u043a\u0438 \u0432\u0445\u043e\u0434\u0430, \u0430 \u0442\u0430\u043a\u0436\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u0437\u0430\u043c\u0435\u0442\u043d\u044b\u0439 \u0434\u0438\u0437\u0430\u0439\u043d \u0434\u043b\u044f \u0432\u044b\u0431\u043e\u0440\u0430 \u043f\u043e\u0434\u043f\u0438\u0441\u043a\u0438:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var showingSignIn = false      var body: some View {         SubscriptionStoreView(productIDs:  [\"com.hackingwithswift.plus.subscription\"])             .storeButton(.visible, for: .restorePurchases, .redeemCode, .policies, .signIn)             .subscriptionStorePolicyDestination(for: .privacyPolicy) {                 Text(\"Privacy policy here\")             }             .subscriptionStorePolicyDestination(for: .termsOfService) {                 Text(\"Terms of service here\")             }             .subscriptionStoreSignInAction {                 showingSignIn = true             }             .sheet(isPresented: $showingSignIn) {                 Text(\"Sign in here\")             }             .subscriptionStoreControlStyle(.prominentPicker)     } } <\/code><\/pre>\n<p><strong>\u0421\u043e\u0432\u0435\u0442:<\/strong> \u041f\u043e\u043b\u0438\u0442\u0438\u043a\u0430 \u043a\u043e\u043d\u0444\u0438\u0434\u0435\u043d\u0446\u0438\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u0438, \u043a\u0430\u043a \u0438 \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u043e\u0431\u0441\u043b\u0443\u0436\u0438\u0432\u0430\u043d\u0438\u044f \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u044b \u043d\u0435 \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u0432\u0438\u0434\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435, \u043d\u043e \u0438 \u0432 \u0432\u0438\u0434\u0435 URL-\u0430\u0434\u0440\u0435\u0441\u043e\u0432.<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0440\u0430\u0437\u043d\u043e\u043e\u0431\u0440\u0430\u0437\u043d\u044b\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u044b \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0432\u043d\u0435\u0448\u043d\u0435\u0433\u043e \u0432\u0438\u0434\u0430 \u044d\u043a\u0440\u0430\u043d\u0430, \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0442\u0449\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u043d Apple \u0441 \u0446\u0435\u043b\u044c\u044e \u0441\u043e\u0445\u0440\u0430\u043d\u0435\u043d\u0438\u044f \u0432\u0441\u0435\u0445 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u0445 \u0444\u0443\u043d\u043a\u0446\u0438\u0439 &#8212; \u0447\u0442\u043e\u0431\u044b \u0432 \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u043c \u0438\u0442\u043e\u0433\u0435 \u0432\u0430\u0448 \u044d\u043a\u0440\u0430\u043d \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u043b \u0432\u0441\u044e \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044e \u043e \u043f\u043e\u043a\u0443\u043f\u043a\u0435 \u0442\u0430\u043a, \u043a\u0430\u043a \u044d\u0442\u043e \u0442\u0440\u0435\u0431\u0443\u0435\u0442 Apple.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u0440\u0435\u043a\u043b\u0430\u043c\u043d\u043e\u0433\u043e \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043a\u0430 \u0434\u043b\u044f \u043c\u043e\u0438\u0445 \u043f\u043e\u0434\u043f\u0438\u0441\u043e\u043a \u0441 \u0433\u043e\u043b\u0443\u0431\u044b\u043c \u0433\u0440\u0430\u0434\u0438\u0435\u043d\u0442\u043e\u043c \u043d\u0430 \u0437\u0430\u0434\u043d\u0435\u043c \u043f\u043b\u0430\u043d\u0435:<\/p>\n<pre><code class=\"swift\">SubscriptionStoreView(productIDs:  [\"com.hackingwithswift.plus.subscription\"]) {     VStack {         Text(\"HWS+\")             .font(.largeTitle)             .fontWeight(.black)          Text(\"Take your Swift learning to the next level by subscribing to Hacking with Swift+!\")             .multilineTextAlignment(.center)     }     .foregroundStyle(.white)     .containerBackground(.blue.gradient, for: .subscriptionStore) } .storeButton(.visible, for: .restorePurchases, .redeemCode) .subscriptionStoreControlStyle(.prominentPicker) <\/code><\/pre>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435:<\/strong> \u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u0432 \u0441\u0432\u043e\u0439 \u043a\u043e\u0434 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u043d\u0438\u044f \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0439 \u0441\u043e\u0432\u0435\u0440\u0448\u0430\u0435\u043c\u044b\u0445 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438, \u043e\u0434\u043d\u0430\u043a\u043e \u043e\u043d \u043d\u0435 \u0441\u043c\u043e\u0436\u0435\u0442 \u0441\u0442\u0430\u0442\u044c \u043f\u043e\u043b\u043d\u043e\u0446\u0435\u043d\u043d\u043e\u0439 \u0437\u0430\u043c\u0435\u043d\u043e\u0439 StoreKit, \u0433\u0434\u0435 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0438 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u044e\u0442\u0441\u044f \u043d\u0430\u0438\u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c.<\/p>\n<p>\u0412 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u0444\u0440\u0430\u0433\u043c\u0435\u043d\u0442\u0435 \u043a\u043e\u0434\u0430 \u043c\u044b \u0432\u044b\u0432\u043e\u0434\u0438\u043c \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0441\u0442\u0430\u0440\u0442\u0435 \u043f\u043e\u043a\u0443\u043f\u043a\u0438 \u043f\u0440\u043e\u0434\u0443\u043a\u0442\u0430, \u0430 \u0437\u0430\u0442\u0435\u043c, \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0438\u0441\u0445\u043e\u0434\u0430 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0438, \u043f\u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u043c \u043e\u0434\u043d\u043e \u0438\u0437 \u0434\u0432\u0443\u0445 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 \u0441\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u0439:<\/p>\n<pre><code class=\"swift\">ProductView(id: \"com.hackingwithswift.plus.subscription\") {     Image(systemName: \"crown\") } .productViewStyle(.compact) .padding() .onInAppPurchaseStart { product in     print(\"User has started buying \\(product.id)\") } .onInAppPurchaseCompletion { product, result in     if case .success(.success(let transaction)) = result {         print(\"Purchased successfully: \\(transaction.signedDate)\")     } else {         print(\"Something else happened\")     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/80e\/d57\/4ac\/80ed574ac4dd02699a492942480a5703.gif\" width=\"1664\" height=\"718\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/80e\/d57\/4ac\/80ed574ac4dd02699a492942480a5703.gif\"\/><\/figure>\n<p>\u0414\u0430, \u0432 \u0434\u0430\u043d\u043d\u043e\u043c API \u0435\u0441\u0442\u044c \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043d\u0435\u0443\u043a\u043b\u044e\u0436\u0435\u0441\u0442\u044c \u2013 \u0434\u0432\u043e\u0439\u043d\u043e\u0439 <code>.success<\/code> \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c, \u0442\u0430\u043a \u043a\u0430\u043a \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0434\u0432\u0430 \u0432\u043b\u043e\u0436\u0435\u043d\u043d\u044b\u0445 enum&#8217;\u0430, \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u043f\u043e\u0434\u0440\u043e\u0431\u043d\u043e\u0441\u0442\u0438 \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0433\u0443\u0442 \u0431\u044b\u0442\u044c \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u044b \u0434\u043b\u044f \u0432\u043d\u0435\u0448\u043d\u0435\u0439 \u0432\u0435\u0440\u0438\u0444\u0438\u043a\u0430\u0446\u0438\u0438 \u043f\u043e\u043a\u0443\u043f\u043a\u0438 \u043f\u0440\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438.<\/p>\n<p>\u0411\u0443\u0434\u044c\u0442\u0435 \u0432\u043d\u0438\u043c\u0430\u0442\u0435\u043b\u044c\u043d\u044b: \u043e\u0434\u043d\u043e\u0433\u043e \u044d\u0442\u043e\u0433\u043e \u043a\u043e\u0434\u0430 \u043d\u0435\u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e, \u043f\u043e\u0442\u043e\u043c\u0443 \u0447\u0442\u043e \u043e\u0434\u0438\u043d \u0438\u0437 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u044b\u0445 \u0438\u0441\u0445\u043e\u0434\u043e\u0432 &#8212; \u044d\u0442\u043e \u0441\u0442\u0430\u0442\u0443\u0441 &#171;\u043e\u0436\u0438\u0434\u0430\u043d\u0438\u0435&#187;: \u043f\u043e\u043a\u0443\u043f\u043a\u0430 \u0443\u0436\u0435 \u0437\u0430\u043f\u0443\u0449\u0435\u043d\u0430, \u043d\u043e \u0435\u0449\u0435 \u043d\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0430, \u0442\u0430\u043a \u0447\u0442\u043e \u0432\u0430\u043c \u0432\u0441\u0435 \u0435\u0449\u0435 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u0441\u043b\u0435\u0434\u0438\u0442\u044c \u0437\u0430 \u043e\u0447\u0435\u0440\u0435\u0434\u044c\u044e \u0442\u0440\u0430\u043d\u0437\u0430\u043a\u0446\u0438\u0439, \u0447\u0442\u043e\u0431\u044b \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0446\u0435\u0441\u0441.<\/p>\n<h4>\u041d\u043e\u0432\u044b\u0439 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 inspector()<\/h4>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>inspector()<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u044f\u0432\u043b\u044f\u0442\u044c\u0441\u044f \u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u0442\u044c \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u041f\u0440\u0438\u043d\u0446\u0438\u043f \u0440\u0430\u0431\u043e\u0442\u044b \u0442\u0430\u043a\u043e\u0439 \u0436\u0435, \u043a\u0430\u043a \u0432 Xcode: \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0441 \u043f\u0440\u0430\u0432\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0441\u043e\u0431\u043e\u0439 \u043f\u0430\u043d\u0435\u043b\u044c \u0441 \u0430\u0442\u0440\u0438\u0431\u0443\u0442\u0430\u043c\u0438. \u0418\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440 \u043c\u043e\u0436\u0435\u0442 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e \u0441\u043e\u0432\u043c\u0435\u0449\u0430\u0442\u044c\u0441\u044f \u0441 <code>NavigationStack<\/code> \u0438\u043b\u0438 <code>NavigationSplitView<\/code> \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043f\u043e\u0442\u0440\u0435\u0431\u043d\u043e\u0441\u0442\u0435\u0439.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043d\u0430\u0433\u043b\u044f\u0434\u043d\u043e\u0433\u043e \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043d\u0438\u0436\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d \u0441\u0446\u0435\u043d\u0430\u0440\u0438\u0439, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043d\u043e\u043f\u043a\u0438:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var isShowingInspector = false      var body: some View {         Button(\"Hello, world!\") {             isShowingInspector.toggle()         }         .font(.largeTitle)         .inspector(isPresented: $isShowingInspector) {             Text(\"Inspector View\")         }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2d6\/c00\/9af\/2d6c009af1d8fd6d8cb20a837b9bca47.gif\" width=\"1320\" height=\"962\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/2d6\/c00\/9af\/2d6c009af1d8fd6d8cb20a837b9bca47.gif\"\/><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u043e \u043e\u0431\u043b\u0430\u0434\u0430\u0435\u0442 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u044b\u043c \u044d\u043a\u0440\u0430\u043d\u043e\u043c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u044d\u0442\u043e \u043f\u043e\u043b\u043d\u043e\u044d\u043a\u0440\u0430\u043d\u043d\u043e\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0434\u043b\u044f iPad \u0438\u043b\u0438 macOS, \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440 \u0431\u0443\u0434\u0435\u0442 \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0442\u044c\u0441\u044f \u0441\u0431\u043e\u043a\u0443 \u043e\u0442 \u043a\u043d\u043e\u043f\u043a\u0438 (\u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430), \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044f \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0432\u0438\u0434\u0435\u0442\u044c \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043e\u0441\u043d\u043e\u0432\u043d\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430 \u0438 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u043d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u0441 \u0431\u043e\u043b\u0435\u0435 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u043d\u044b\u043c \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e\u043c, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a iPhone, \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430 \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f. \u0417\u0434\u0435\u0441\u044c \u043e\u043d \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u0430\u043a &#171;\u0432\u044b\u0435\u0437\u0436\u0430\u044e\u0449\u0430\u044f \u043f\u0430\u043d\u0435\u043b\u044c&#187; \u0438\u043b\u0438 &#171;\u043b\u0438\u0441\u0442&#187;, \u0437\u0430\u043d\u0438\u043c\u0430\u044f \u0432\u0435\u0441\u044c \u044d\u043a\u0440\u0430\u043d. \u0422\u0430\u043a\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u043e\u043f\u0442\u0438\u043c\u0430\u043b\u044c\u043d\u043e\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430 \u043d\u0430 \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0438\u0445 \u044d\u043a\u0440\u0430\u043d\u0430\u0445.<\/p>\n<p>\u041d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0430\u0445 \u0441 \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u044b\u043c\u0438 \u044d\u043a\u0440\u0430\u043d\u0430\u043c\u0438 \u0448\u0438\u0440\u0438\u043d\u0443 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430 \u043c\u043e\u0436\u043d\u043e \u043d\u0430\u0441\u0442\u0440\u0430\u0438\u0432\u0430\u0442\u044c \u043f\u0440\u0438 \u043f\u043e\u043c\u043e\u0449\u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 <code>.inspectorColumnWidth()<\/code>. \u041e\u043d \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0437\u0430\u0434\u0430\u0442\u044c \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u044b\u0439 \u0440\u0430\u0437\u043c\u0435\u0440 \u0448\u0438\u0440\u0438\u043d\u044b \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>.inspectorColumnWidth(500)<\/code>. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440 \u0431\u0443\u0434\u0435\u0442 \u0437\u0430\u043d\u0438\u043c\u0430\u0442\u044c \u0444\u0438\u043a\u0441\u0438\u0440\u043e\u0432\u0430\u043d\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u0448\u0438\u0440\u0438\u043d\u043e\u0439 500 \u043f\u043e\u0438\u043d\u0442\u043e\u0432.<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u044d\u0442\u043e\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0434\u043b\u044f \u0437\u0430\u0434\u0430\u043d\u0438\u044f \u0434\u0438\u0430\u043f\u0430\u0437\u043e\u043d\u0430 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432 \u0448\u0438\u0440\u0438\u043d\u044b, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, <code>.inspectorColumnWidth(min: 50, ideal: 150, max: 200)<\/code>. \u042d\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0448\u0438\u0440\u0438\u043d\u0430 \u043a\u043e\u043b\u043e\u043d\u043a\u0438 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430 \u0431\u0443\u0434\u0435\u0442 \u0432\u0430\u0440\u044c\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430, \u043d\u043e \u043d\u0435 \u0431\u0443\u0434\u0435\u0442 \u043c\u0435\u043d\u044c\u0448\u0435 50 \u043f\u043e\u0438\u043d\u0442\u043e\u0432 \u0438 \u0431\u043e\u043b\u044c\u0448\u0435 200 \u043f\u043e\u0438\u043d\u0442\u043e\u0432. \u041f\u0440\u0438 \u044d\u0442\u043e\u043c \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e\u0439 \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0448\u0438\u0440\u0438\u043d\u0430 150 \u043f\u043e\u0438\u043d\u0442\u043e\u0432:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var isShowingInspector = false      var body: some View {         Button(\"Hello, world!\") {             isShowingInspector.toggle()         }         .font(.largeTitle)         .inspector(isPresented: $isShowingInspector) {             Text(\"Inspector View\")                 .inspectorColumnWidth(min: 50, ideal: 150, max: 200)         }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/641\/20d\/a0d\/64120da0da8bf7f2dc17fff16ae24386.gif\" width=\"1310\" height=\"978\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/641\/20d\/a0d\/64120da0da8bf7f2dc17fff16ae24386.gif\"\/><\/figure>\n<p>\u041f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0438 \u043e\u043a\u043d\u0430 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u043e \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0448\u0438\u0440\u0438\u043d\u044b, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0431\u044b\u043b\u043e \u0437\u0430\u0434\u0430\u043d\u043e \u0440\u0430\u0437\u0440\u0430\u0431\u043e\u0442\u0447\u0438\u043a\u043e\u043c \u043f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430.<\/p>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435\u043c \u0438\u0437\u043c\u0435\u043d\u0438\u0442 \u0440\u0430\u0437\u043c\u0435\u0440 \u043e\u043a\u043d\u0430 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430 (\u0435\u0441\u043b\u0438 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044f \u044d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442), \u0442\u043e \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0437\u0430\u043f\u043e\u043c\u043d\u0438\u0442 \u043d\u043e\u0432\u044b\u0439 \u0440\u0430\u0437\u043c\u0435\u0440. \u041f\u0440\u0438 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043e\u0442\u043a\u0440\u044b\u0442\u0438\u0438 \u043e\u043a\u043d\u0430 \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u0430, \u0441\u0438\u0441\u0442\u0435\u043c\u0430 \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u044d\u0442\u043e\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0440\u0430\u0437\u043c\u0435\u0440, \u0430 \u043d\u0435 \u0438\u0441\u0445\u043e\u0434\u043d\u043e\u0435 \u0438\u0434\u0435\u0430\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435.<\/p>\n<p>SwiftUI \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c \u0441\u0440\u0430\u0437\u0443 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0438\u043d\u0441\u043f\u0435\u043a\u0442\u043e\u0440\u043e\u0432, \u0445\u043e\u0442\u044f \u044d\u0442\u043e \u043a\u0430\u0436\u0435\u0442\u0441\u044f \u043d\u0435 \u043e\u0447\u0435\u043d\u044c \u0445\u043e\u0440\u043e\u0448\u0435\u0439 \u0438\u0434\u0435\u0435\u0439.<\/p>\n<h4>\u041d\u043e\u0432\u044b\u0439 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 onKeyPress()<\/h4>\n<p>SwiftUI \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>onKeyPress()<\/code>, \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u043a\u043e\u0442\u043e\u0440\u043e\u043c\u0443 \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0440\u0435\u0430\u0433\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043d\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u0430\u043f\u043f\u0430\u0440\u0430\u0442\u043d\u043e\u0439 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u044b, \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u044f\u0449\u0438\u0435 \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u0415\u0434\u0438\u043d\u0441\u0442\u0432\u0435\u043d\u043d\u044b\u043c \u0443\u0441\u043b\u043e\u0432\u0438\u0435\u043c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0442\u043e, \u0447\u0442\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430\u0436\u0430\u0442\u0438\u0435 \u043a\u043b\u0430\u0432\u0438\u0448, \u0434\u043e\u043b\u0436\u043d\u043e \u0431\u044b\u0442\u044c \u0432 \u0444\u043e\u043a\u0443\u0441\u0435.<\/p>\n<p>\u041c\u043e\u043d\u0438\u0442\u043e\u0440\u0438\u043d\u0433 \u043d\u0430\u0436\u0430\u0442\u0438\u0439 \u043a\u043b\u0430\u0432\u0438\u0448 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u043d \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u0430\u043c\u0438, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u0432\u0430\u0448\u0438\u0445 \u043d\u0443\u0436\u0434. \u041e\u0434\u043d\u0430\u043a\u043e, \u0432\u043d\u0435 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u0432\u0430\u043c\u0438 \u043c\u0435\u0442\u043e\u0434\u0430, \u0432\u0430\u0448\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0434\u043e\u043b\u0436\u043d\u043e \u0443\u043c\u0435\u0442\u044c \u043f\u043e\u043b\u0443\u0447\u0430\u0442\u044c \u0444\u043e\u043a\u0443\u0441 \u0434\u043b\u044f \u043e\u0442\u0432\u0435\u0442\u0430 \u043d\u0430 \u043d\u0430\u0436\u0430\u0442\u0438\u0435 \u043a\u043b\u0430\u0432\u0438\u0448:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @FocusState private var focused: Bool     @State private var key = \"\"      var body: some View {         Text(key)             .focusable()             .focused($focused)             .onKeyPress { press in                 key += press.characters                 return .handled             }             .onAppear {                 focused = true             }     } } <\/code><\/pre>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/01d\/597\/042\/01d597042301751dc826983d1700ca8c.webp\" width=\"1442\" height=\"338\"\/><\/figure>\n<p><code>return .handled<\/code> \u0441\u043e\u043e\u0431\u0449\u0430\u0435\u0442 SwiftUI, \u0447\u0442\u043e \u0441\u043e\u0431\u044b\u0442\u0438\u0435 \u043d\u0430\u0436\u0430\u0442\u0438\u044f \u043a\u043b\u0430\u0432\u0438\u0448\u0438 \u0431\u044b\u043b\u043e \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u043d\u043e \u0431\u043b\u043e\u043a\u043e\u043c \u043a\u043e\u0434\u0430, \u043d\u0430\u0445\u043e\u0434\u044f\u0449\u0438\u043c\u0441\u044f \u0432 \u0431\u043b\u043e\u043a\u0435 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u044f. \u0415\u0441\u043b\u0438 \u0436\u0435 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442\u0441\u044f <code>.ignored<\/code>, \u0442\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043d\u0430\u0436\u0430\u0442\u0438\u044f \u043a\u043b\u0430\u0432\u0438\u0448\u0438 \u043f\u0435\u0440\u0435\u0434\u0430\u0451\u0442\u0441\u044f \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c\u0443 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044e \u0432 \u0438\u0435\u0440\u0430\u0440\u0445\u0438\u0438, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0441\u043f\u043e\u0441\u043e\u0431\u043d\u043e \u0435\u0433\u043e \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u0430\u0442\u044c.<\/p>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435:<\/strong> \u0421\u0438\u043c\u0432\u043e\u043b\u044b, \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c\u044b\u0435 \u043f\u0440\u0438 \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043a\u043b\u0430\u0432\u0438\u0448\u0438, \u043d\u0435 \u0432\u043a\u043b\u044e\u0447\u0430\u044e\u0442 \u0432 \u0441\u0435\u0431\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b (\u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, Shift \u0438\u043b\u0438 Ctrl), \u0447\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u0432\u044b \u043d\u0435 \u043f\u043e\u043b\u0443\u0447\u0438\u0442\u0435 \u0437\u0430\u0433\u043b\u0430\u0432\u043d\u044b\u0435 \u0431\u0443\u043a\u0432\u044b \u0438\u043b\u0438 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0435 \u0441\u0438\u043c\u0432\u043e\u043b\u044b \u043f\u0440\u0438 \u0438\u0445 \u043d\u0430\u0436\u0430\u0442\u0438\u0438.<\/p>\n<p>\u0412\u0430\u0440\u0438\u0430\u0446\u0438\u0438 <code>onKeyPress()<\/code> \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u044e\u0442 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c, \u043d\u0430 \u043a\u0430\u043a\u043e\u0439 \u0441\u0442\u0430\u0434\u0438\u0438 \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0430 \u0441\u043e\u0431\u044b\u0442\u0438\u044f \u043d\u0430\u0436\u0430\u0442\u0438\u044f \u043a\u043b\u0430\u0432\u0438\u0448\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u043a\u043e\u0434\u0435 \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u043c\u043e\u043c\u0435\u043d\u0442 \u043e\u0442\u043f\u0443\u0441\u043a\u0430\u043d\u0438\u044f \u043a\u043b\u0430\u0432\u0438\u0448\u0438 (\u0444\u0430\u0437\u0430 <code>.up<\/code>), \u0438 \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0432\u044b\u0432\u043e\u0434\u0438\u0442 \u0441\u0438\u043c\u0432\u043e\u043b\u044b, \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u044e\u0449\u0438\u0435 \u043d\u0430\u0436\u0430\u0442\u043e\u0439 \u043a\u043b\u0430\u0432\u0438\u0448\u0435:<\/p>\n<pre><code class=\"swift\">Text(key)     .onKeyPress(phases: .up) { press in         print(\"Received \\(press.characters)\")         return .handled     } <\/code><\/pre>\n<p>\u0421\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u0430\u0440\u0438\u0430\u0446\u0438\u044f, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 \u043d\u0430\u0436\u0430\u0442\u0438\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0442\u0438\u043f\u043e\u0432 \u043a\u043b\u0430\u0432\u0438\u0448:<\/p>\n<pre><code class=\"swift\">Text(key)     .onKeyPress(characters: .alphanumerics) { press in         print(\"Received \\(press.characters)\")         return .handled     } <\/code><\/pre>\n<p>\u0418 \u0434\u0430\u0436\u0435 \u0435\u0441\u0442\u044c \u0432\u0430\u0440\u0438\u0430\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0440\u0435\u0430\u0433\u0438\u0440\u0443\u0435\u0442 \u043d\u0430 \u043d\u0430\u0436\u0430\u0442\u0438\u0435 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u044b\u0445 \u0441\u0438\u043c\u0432\u043e\u043b\u043e\u0432, \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0445 \u043b\u0438\u0431\u043e \u0432 \u0432\u0438\u0434\u0435 \u0441\u043f\u0438\u0441\u043a\u0430 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043a\u043e\u043d\u0441\u0442\u0430\u043d\u0442, \u043b\u0438\u0431\u043e \u0441\u0438\u043c\u0432\u043e\u043b\u043e\u0432. \u0422\u0430\u043a, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043d\u0438\u0436\u0435 \u043a\u043e\u0434 \u0431\u0443\u0434\u0435\u0442 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u043c\u0435\u043d\u0442\u044b, \u043a\u043e\u0433\u0434\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0438 \u0432 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u0438 \u043e\u0442\u0447\u0430\u044f\u043d\u0438\u044f \u043f\u044b\u0442\u0430\u044e\u0442\u0441\u044f \u0432\u044b\u0439\u0442\u0438 \u0438\u0437 Vim, \u043d\u0430\u0436\u0438\u043c\u0430\u044f \u043a\u043b\u0430\u0432\u0438\u0448\u0438:<\/p>\n<pre><code class=\"swift\">Text(key)     .onKeyPress(keys: [.escape, \"w\", \"q\"]) { press in         print(\"Received \\(press.characters)\")         return .handled     } <\/code><\/pre>\n<h4>\u0423\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435\u043c \u043a\u043e\u043b\u043e\u043d\u043e\u043a NavigationSplitView \u0432 \u043a\u043e\u043c\u043f\u0430\u043a\u0442\u043d\u044b\u0445 \u043c\u0430\u043a\u0435\u0442\u0430\u0445<\/h4>\n<p>\u041a\u043e\u0433\u0434\u0430 <code>NavigationSplitView<\/code> \u043d\u0430 \u0443\u0441\u0442\u0440\u043e\u0439\u0441\u0442\u0432\u0435 \u0441 \u043c\u0430\u043b\u0435\u043d\u044c\u043a\u0438\u043c \u044d\u043a\u0440\u0430\u043d\u043e\u043c, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440 \u043d\u0430 iPhone \u0438\u043b\u0438 \u0432 \u043f\u043e\u0440\u0442\u0440\u0435\u0442\u043d\u043e\u0439 \u043e\u0440\u0438\u0435\u043d\u0442\u0430\u0446\u0438\u0438 \u043d\u0430 iPad, SwiftUI \u043f\u044b\u0442\u0430\u0435\u0442\u0441\u044f \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c, \u043a\u0430\u043a\u0443\u044e \u043f\u0430\u043d\u0435\u043b\u044c \u043b\u0443\u0447\u0448\u0435 \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e. \u042d\u0442\u043e\u0442 \u0432\u044b\u0431\u043e\u0440 \u0447\u0430\u0441\u0442\u043e \u043e\u043a\u0430\u0437\u044b\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u0430\u0432\u0438\u043b\u044c\u043d\u044b\u043c, \u043e\u0434\u043d\u0430\u043a\u043e \u0432\u044b \u0432\u0441\u0435\u0433\u0434\u0430 \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0435\u0433\u043e, \u0437\u0430\u0434\u0430\u0432 \u0436\u0435\u043b\u0430\u0435\u043c\u0443\u044e \u043a\u043e\u043b\u043e\u043d\u043a\u0443 \u0434\u043b\u044f \u043a\u043e\u043c\u043f\u0430\u043a\u0442\u043d\u043e\u0433\u043e \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u0432 \u0432\u0430\u0448\u0435\u043c Split View.<\/p>\n<p>\u0412\u043e\u0442 \u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0441 \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u0435\u0439 \u0443\u0441\u0442\u0430\u043d\u0430\u0432\u043b\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e, \u0447\u0442\u043e \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u0442 \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0433\u043e \u0432\u044b\u0431\u043e\u0440\u0430 SwiftUI:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var preferredColumn = NavigationSplitViewColumn.detail      var body: some View {         NavigationSplitView(preferredCompactColumn: $preferredColumn) {             Text(\"Sidebar View\")         } detail: {             Text(\"Detail View\")         }     } } <\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0438\u0442\u0435 \u043d\u0435\u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u044e\u0449\u0435\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043f\u043e\u043f\u0440\u043e\u0441\u0438\u0442\u0435 \u043f\u0440\u0438\u043e\u0440\u0438\u0442\u0435\u0442\u043d\u043e \u043f\u043e\u043a\u0430\u0437\u0430\u0442\u044c \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u043d\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435, \u043a\u043e\u0433\u0434\u0430 \u0443 \u0432\u0430\u0441 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u0442\u043e\u043b\u044c\u043a\u043e \u0431\u043e\u043a\u043e\u0432\u0430\u044f \u043f\u0430\u043d\u0435\u043b\u044c \u0438 \u0434\u0435\u0442\u0430\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435, \u0442\u043e SwiftUI \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442 \u0431\u043e\u043a\u043e\u0432\u0443\u044e \u043f\u0430\u043d\u0435\u043b\u044c.<\/p>\n<h4>\u0414\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0441\u0435\u043d\u0441\u043e\u0440\u043d\u043e\u0439 \u043e\u0431\u0440\u0430\u0442\u043d\u043e\u0439 \u0441\u0432\u044f\u0437\u0438<\/h4>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>sensoryFeedback()<\/code> \u0432 SwiftUI \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0434\u043b\u044f \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0430 \u0431\u0430\u0437\u043e\u0432\u044b\u0445 \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u0447\u0435\u043c\u0443 \u043c\u043e\u0436\u043d\u043e \u0433\u0435\u043d\u0435\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0438\u0431\u0440\u0430\u0446\u0438\u043e\u043d\u043d\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b, \u0441\u0438\u0433\u043d\u0430\u043b\u0438\u0437\u0438\u0440\u0443\u044e\u0449\u0438\u0435 \u043e \u0442\u043e\u043c, \u0447\u0442\u043e \u043e\u043f\u0435\u0440\u0430\u0446\u0438\u044f \u0437\u0430\u0432\u0435\u0440\u0448\u0438\u043b\u0430\u0441\u044c \u0443\u0441\u043f\u0435\u0448\u043d\u043e, \u043f\u0440\u043e\u0438\u0437\u043e\u0448\u043b\u0430 \u043e\u0448\u0438\u0431\u043a\u0430, \u0432\u044b\u0431\u0440\u0430\u043d \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0439 \u044d\u043b\u0435\u043c\u0435\u043d\u0442, \u0438 \u0442\u0430\u043a \u0434\u0430\u043b\u0435\u0435.<\/p>\n<p>\u0427\u0442\u043e\u0431\u044b \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u0440\u0430\u0442\u043d\u0443\u044e \u0441\u0432\u044f\u0437\u044c, \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u0438\u0441\u043e\u0435\u0434\u0438\u043d\u0438\u0442\u0435 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>sensoryFeedback()<\/code> \u043a \u043b\u044e\u0431\u043e\u043c\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430, \u0443\u043a\u0430\u0437\u0430\u0432 \u0436\u0435\u043b\u0430\u0435\u043c\u044b\u0439 \u0442\u0438\u043f \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0438 \u0442\u0440\u0438\u0433\u0433\u0435\u0440 \u2013 \u043c\u043e\u043c\u0435\u043d\u0442 \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u044d\u0444\u0444\u0435\u043a\u0442\u0430. SwiftUI \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u0431\u043b\u044e\u0434\u0430\u0442\u044c \u0437\u0430 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435\u043c \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0438 \u043a\u0430\u0436\u0434\u044b\u0439 \u0440\u0430\u0437 \u043f\u0440\u0438 \u0435\u0433\u043e \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0438 \u0437\u0430\u043f\u0443\u0441\u043a\u0430\u0442\u044c \u0432\u0430\u0448 \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442.<\/p>\n<p>\u0412\u043e\u0437\u044c\u043c\u0435\u043c \u0434\u043b\u044f \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043a\u043d\u043e\u043f\u043a\u0443, \u043a\u043e\u0442\u043e\u0440\u0430\u044f \u043e\u0442\u043c\u0435\u0447\u0430\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u0437\u0430\u0434\u0430\u0447\u0438. \u0422\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u043c\u043e\u0436\u043d\u043e \u0432\u043e\u0441\u043f\u0440\u043e\u0438\u0437\u0432\u0435\u0441\u0442\u0438 \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u0435\u0435 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var taskIsComplete = false      var body: some View {         Button(\"Mark Complete\") {             taskIsComplete = true         }         .sensoryFeedback(.success, trigger: taskIsComplete)     } } <\/code><\/pre>\n<p>\u0414\u043b\u044f \u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u043b\u043d\u043e\u0433\u043e \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u044f \u043d\u0430\u0434 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u043e\u043c, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0442\u043e\u0447\u043d\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c, \u043a\u0430\u043a\u043e\u0439 \u0438\u043c\u0435\u043d\u043d\u043e \u0442\u0438\u043f \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u043e\u0433\u043e \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0432\u044b\u0437\u0432\u0430\u0442\u044c, \u0441\u0440\u0430\u0432\u043d\u0438\u0432 \u043f\u0440\u0435\u0434\u044b\u0434\u0443\u0449\u0435\u0435 \u0438 \u043d\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432\u0430\u0448\u0435\u0433\u043e \u0442\u0440\u0438\u0433\u0433\u0435\u0440\u0430. \u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043a\u043e\u0434\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 <code>.impact<\/code> \u0441 \u0438\u0437\u043c\u0435\u043d\u044f\u044e\u0449\u0435\u0439\u0441\u044f \u0438\u043d\u0442\u0435\u043d\u0441\u0438\u0432\u043d\u043e\u0441\u0442\u044c\u044e, \u0437\u0430\u0432\u0438\u0441\u044f\u0449\u0435\u0439 \u043e\u0442 \u0440\u0430\u0437\u043d\u043e\u0441\u0442\u0438 \u0434\u0432\u0443\u0445 \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b\u0445 \u0447\u0438\u0441\u0435\u043b:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var randomNumber = 0.0      var body: some View {         Button(\"Mark Complete\") {             randomNumber = Double.random(in: 0...1)         }         .sensoryFeedback(trigger: randomNumber) { oldValue, newValue in             let amount = abs(oldValue - newValue)             return .impact(flexibility: .solid, intensity: amount)         }     } } <\/code><\/pre>\n<p>\u0418 \u043d\u0430\u043a\u043e\u043d\u0435\u0446, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043f\u043e\u0441\u0442\u043e\u044f\u043d\u043d\u044b\u0439 \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 \u0438 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0443\u0441\u043b\u043e\u0432\u0438\u044f \u0435\u0433\u043e \u0432\u044b\u0437\u043e\u0432\u0430, \u0441\u043e\u0437\u0434\u0430\u0432 \u0441\u0432\u043e\u044e \u0444\u0443\u043d\u043a\u0446\u0438\u044e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044f. \u041a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043a\u043e\u0434\u0435 \u0442\u0430\u043a\u0442\u0438\u043b\u044c\u043d\u044b\u0439 \u044d\u0444\u0444\u0435\u043a\u0442 <code>.success<\/code> \u0430\u043a\u0442\u0438\u0432\u0438\u0440\u0443\u0435\u0442\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u0440\u0430\u0437\u043d\u0438\u0446\u0430 \u043c\u0435\u0436\u0434\u0443 \u0434\u0432\u0443\u043c\u044f \u0441\u043b\u0443\u0447\u0430\u0439\u043d\u044b\u043c\u0438 \u0447\u0438\u0441\u043b\u0430\u043c\u0438 \u0441\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0431\u043e\u043b\u0435\u0435 0.5:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var randomNumber = 0.0      var body: some View {         Button(\"Mark Complete\") {             randomNumber = Double.random(in: 0...1)         }         .sensoryFeedback(.success, trigger: randomNumber) { oldValue, newValue in             abs(oldValue - newValue) > 0.5         }     } } <\/code><\/pre>\n<h4>\u0423\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043e \u043d\u0435\u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0441\u0442\u0438 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430<\/h4>\n<p>\u0412 SwiftUI \u0438\u043c\u0435\u0435\u0442\u0441\u044f \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u0442\u0438\u043f <code>ContentUnavailableView<\/code>, \u0441\u043e\u0437\u0434\u0430\u043d\u043d\u044b\u0439 \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u0435\u043c\u043e\u043d\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f\u043c, \u0447\u0442\u043e \u043d\u0430 \u0434\u0430\u043d\u043d\u044b\u0439 \u043c\u043e\u043c\u0435\u043d\u0442 \u0434\u043b\u044f \u043f\u0440\u043e\u0441\u043c\u043e\u0442\u0440\u0430 \u043d\u0438\u0447\u0435\u0433\u043e \u043d\u0435\u0442. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0441\u043b\u0443\u0447\u0430\u0435, \u0435\u0441\u043b\u0438 \u0438\u0445 \u043f\u043e\u0438\u0441\u043a \u043d\u0435 \u043f\u0440\u0438\u0432\u0435\u043b \u043a \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430\u043c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 <code>ContentUnavailableView<\/code> \u0431\u0443\u0434\u0435\u0442 \u043d\u0430\u043c\u043d\u043e\u0433\u043e \u043b\u0443\u0447\u0448\u0435, \u0447\u0435\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043f\u0443\u0441\u0442\u043e\u0433\u043e \u044d\u043a\u0440\u0430\u043d\u0430.<\/p>\n<p>\u0412 \u0441\u0432\u043e\u0435\u043c \u0441\u0430\u043c\u043e\u043c \u0431\u0430\u0437\u043e\u0432\u043e\u043c \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0435, \u0434\u043b\u044f \u043e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f \u044d\u043a\u0440\u0430\u043d\u0430 \u0441 \u043d\u0435\u043d\u0430\u0439\u0434\u0435\u043d\u043d\u044b\u043c\u0438 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430\u043c\u0438 \u043f\u043e\u0438\u0441\u043a\u0430 \u0432\u0430\u043c \u0434\u043e\u0441\u0442\u0430\u0442\u043e\u0447\u043d\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     var body: some View {         ContentUnavailableView.search     } } <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/033\/64c\/5e9\/03364c5e99552330d09226fcf91bf841.webp\" width=\"471\" height=\"208\"\/><\/figure>\n<p>\u0412\u044b \u0443\u0432\u0438\u0434\u0438\u0442\u0435 \u0438\u043a\u043e\u043d\u043a\u0443 \u043b\u0443\u043f\u044b, \u0430 \u043f\u043e\u0434 \u043d\u0435\u0439 \u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a \u0438 \u043f\u043e\u0434\u0437\u0430\u0433\u043e\u043b\u043e\u0432\u043e\u043a, \u043e\u0431\u044a\u044f\u0441\u043d\u044f\u044e\u0449\u0438\u0435, \u0447\u0442\u043e \u043f\u043e\u0438\u0441\u043a \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u043d\u0435 \u0434\u0430\u043b \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u043e\u0432.<\/p>\n<p>\u041f\u0440\u0438 \u0436\u0435\u043b\u0430\u043d\u0438\u0438, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0435\u0433\u043e, \u0434\u043e\u0431\u0430\u0432\u0438\u0432 \u0442\u043e, \u0447\u0442\u043e \u0438\u0441\u043a\u0430\u043b \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c:<\/p>\n<pre><code class=\"swift\">ContentUnavailableView.search(text: \"Life, the Universe, and Everything\") <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/6ab\/7d0\/7f6\/6ab7d07f647d3e9c4838eccd24ec04e1.webp\" width=\"473\" height=\"203\"\/><\/figure>\n<p>\u041a\u0440\u043e\u043c\u0435 \u0442\u043e\u0433\u043e \u0432\u044b \u0442\u0430\u043a\u0436\u0435 \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c \u0438\u043a\u043e\u043d\u043a\u0443 \u0438 \u043e\u043f\u0438\u0441\u0430\u043d\u0438\u0435:<\/p>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/8c3\/2f4\/726\/8c32f4726db7a5cb009afb20a96b92d2.webp\" width=\"327\" height=\"199\"\/><\/figure>\n<h4>\u0421\u0447\u0438\u0442\u044b\u0432\u0430\u043d\u0438\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 RGB \u0438\u0437 \u0446\u0432\u0435\u0442\u0430<\/h4>\n<p>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u0432 SwiftUI \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0441\u043e\u043e\u0442\u0432\u0435\u0442\u0441\u0442\u0432\u0443\u0435\u0442 \u043a\u043e\u043d\u043a\u0440\u0435\u0442\u043d\u043e\u043c\u0443 \u043e\u0442\u0442\u0435\u043d\u043a\u0443, \u0432\u0435\u0434\u044c \u043e\u043a\u043e\u043d\u0447\u0430\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u0430 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u044f\u0435\u0442\u0441\u044f \u0442\u043e\u043b\u044c\u043a\u043e \u0432 \u043c\u043e\u043c\u0435\u043d\u0442 \u0435\u0433\u043e \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u043a\u0438 \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u0432\u043d\u043e\u0441\u0438\u0442\u044c \u043d\u0435\u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043e\u0442\u043b\u0438\u0447\u0438\u044f \u043c\u0435\u0436\u0434\u0443 \u0441\u0432\u0435\u0442\u043b\u044b\u043c \u0438 \u0442\u0435\u043c\u043d\u044b\u043c \u0440\u0435\u0436\u0438\u043c\u0430\u043c\u0438, \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u044f \u043d\u0430\u0438\u043b\u0443\u0447\u0448\u0438\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u043e\u043f\u044b\u0442. \u041e\u0434\u043d\u0430\u043a\u043e \u044d\u0442\u043e \u0442\u0430\u043a\u0436\u0435 \u043f\u043e\u0434\u0440\u0430\u0437\u0443\u043c\u0435\u0432\u0430\u0435\u0442, \u0447\u0442\u043e \u0434\u043b\u044f \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u044f \u0442\u043e\u0447\u043d\u044b\u0445 RGB-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u043e\u0432 \u0446\u0432\u0435\u0442\u0430 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043e\u0431\u0440\u0430\u0442\u0438\u0442\u044c\u0441\u044f \u043a \u0441\u0438\u0441\u0442\u0435\u043c\u0435 \u0441 \u0437\u0430\u043f\u0440\u043e\u0441\u043e\u043c \u043e \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u0438\u0438 \u0430\u043a\u0442\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0439 \u0446\u0432\u0435\u0442\u0430, \u0438\u0441\u0445\u043e\u0434\u044f \u0438\u0437 \u0442\u0435\u043a\u0443\u0449\u0438\u0445 \u0443\u0441\u043b\u043e\u0432\u0438\u0439.<\/p>\n<p>\u041f\u0440\u043e\u0446\u0435\u0441\u0441 \u0440\u0430\u0441\u043a\u0440\u044b\u0442\u0438\u044f \u0446\u0432\u0435\u0442\u043e\u0432\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f \u0434\u0435\u043b\u0438\u0442\u0441\u044f \u043d\u0430 \u0434\u0432\u0430 \u044d\u0442\u0430\u043f\u0430: \u0432 \u043d\u0430\u0447\u0430\u043b\u0435 \u043c\u044b \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u043c \u0434\u043e\u0441\u0442\u0443\u043f \u043a \u0442\u0435\u043a\u0443\u0449\u0435\u043c\u0443 \u043e\u043a\u0440\u0443\u0436\u0435\u043d\u0438\u044e, \u0437\u0430\u0442\u0435\u043c \u044d\u0442\u0430 \u0438\u043d\u0444\u043e\u0440\u043c\u0430\u0446\u0438\u044f \u043f\u0435\u0440\u0435\u0434\u0430\u0435\u0442\u0441\u044f \u0432 \u043c\u0435\u0442\u043e\u0434 <code>resolve(in:)<\/code> \u0432\u044b\u0431\u0440\u0430\u043d\u043d\u043e\u0433\u043e \u0446\u0432\u0435\u0442\u0430. \u041f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0435 \u0442\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0434\u0430\u043d\u043d\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u0441\u043e\u0445\u0440\u0430\u043d\u0438\u0442\u044c \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>Codable<\/code> \u0438\u043b\u0438 \u0434\u0440\u0443\u0433\u043e\u0433\u043e \u043f\u043e\u0434\u0445\u043e\u0434\u044f\u0449\u0435\u0433\u043e \u0432\u0430\u0440\u0438\u0430\u043d\u0442\u0430.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u043c\u043e\u0436\u043d\u043e \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0438\u0442\u044c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0438\u0442\u044c \u0441\u0432\u043e\u0439 \u0446\u0432\u0435\u0442, \u0430 \u0437\u0430\u0442\u0435\u043c \u043e\u0442\u043e\u0431\u0440\u0430\u0437\u0438\u0442\u044c \u0435\u0433\u043e RGB-\u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442\u044b:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @Environment(\\.self) var environment     @State private var color = Color.red     @State private var resolvedColor: Color.Resolved?      var body: some View {         VStack {             ColorPicker(\"Select your favorite color\", selection: $color)              if let resolvedColor {                 Text(\"Red: \\(resolvedColor.red)\")                 Text(\"Green: \\(resolvedColor.green)\")                 Text(\"Blue: \\(resolvedColor.blue)\")                 Text(\"Opacity: \\(resolvedColor.opacity)\")             }         }         .padding()         .onChange(of: color, initial: true, getColor)     }      func getColor() {         resolvedColor = color.resolve(in: environment)     } } <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f3f\/ad0\/c87\/f3fad0c87876f6df910f5e5b9b411e96.png\" width=\"395\" height=\"186\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f3f\/ad0\/c87\/f3fad0c87876f6df910f5e5b9b411e96.png\"\/><\/figure>\n<p><strong>\u0412\u0430\u0436\u043d\u043e<\/strong>: \u0414\u0430\u043d\u043d\u044b\u0435 \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u0432 \u0444\u043e\u0440\u043c\u0430\u0442\u0435 <code>Float<\/code>, \u0430 \u043d\u0435 <code>Double<\/code>.<\/p>\n<p>\u0412 \u044d\u0442\u043e\u043c \u043a\u043e\u0434\u0435 \u043f\u0435\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f <code>resolved<\/code> \u043f\u043e\u043b\u0443\u0447\u0430\u0435\u0442 \u0442\u0438\u043f <code>Color.Resolved<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u043d \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u043d\u043e\u0432\u044b\u0439 \u043e\u0431\u044a\u0435\u043a\u0442 <code>Color<\/code> \u0438\u043b\u0438 \u043f\u0435\u0440\u0435\u0432\u0435\u0434\u0435\u043d \u0432 JSON \u0438\u043b\u0438 \u0447\u0442\u043e-\u0442\u043e \u043f\u043e\u0434\u043e\u0431\u043d\u043e\u0435 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <code>Codable<\/code>.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u044c \u043d\u0430\u0448 \u0446\u0432\u0435\u0442, \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u043d\u044b\u0439 \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e resolved \u0432 JSON \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @Environment(\\.self) var environment     @State private var color = Color.red      @State private var resolvedColor: Color.Resolved?     @State private var colorJSON = \"\"      var body: some View {         VStack {             ColorPicker(\"Select your favorite color\", selection: $color)              if let resolvedColor {                 Text(\"Red: \\(resolvedColor.red)\")                 Text(\"Green: \\(resolvedColor.green)\")                 Text(\"Blue: \\(resolvedColor.blue)\")                 Text(\"Opacity: \\(resolvedColor.opacity)\")             }              Text(\"Color JSON: \\(colorJSON)\")         }         .padding()         .onChange(of: color, initial: true, getColor)     }      func getColor() {         resolvedColor = color.resolve(in: environment)          if let colorData = try? JSONEncoder().encode(resolvedColor) {             colorJSON = String(decoding: colorData, as: UTF8.self)         }     } } <\/code><\/pre>\n<p><strong>\u041f\u0440\u0438\u043c\u0435\u0447\u0430\u043d\u0438\u0435:<\/strong> \u0422\u0430\u043a \u043a\u0430\u043a \u043c\u044b \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u043c \u0441 \u0434\u0440\u043e\u0431\u043d\u044b\u043c\u0438 \u0447\u0438\u0441\u043b\u0430\u043c\u0438, \u0442\u043e \u0432 \u0438\u0442\u043e\u0433\u043e\u0432\u044b\u0445 \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430\u0445 \u043c\u043e\u0433\u0443\u0442 \u0432\u043e\u0437\u043d\u0438\u043a\u043d\u0443\u0442\u044c \u043d\u0435\u0437\u043d\u0430\u0447\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0435 \u043e\u0442\u043a\u043b\u043e\u043d\u0435\u043d\u0438\u044f.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u0443\u0442\u043e\u0447\u043d\u0435\u043d\u043d\u044b\u0439 \u0446\u0432\u0435\u0442 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e \u043f\u0440\u0435\u043e\u0431\u0440\u0430\u0437\u043e\u0432\u0430\u0442\u044c \u043e\u0431\u0440\u0430\u0442\u043d\u043e \u0432 \u044d\u043a\u0437\u0435\u043c\u043f\u043b\u044f\u0440 <code>Color<\/code>, \u043f\u0440\u043e\u0441\u0442\u043e \u0432\u0441\u0442\u0430\u0432\u044c\u0442\u0435 \u0435\u0433\u043e \u0432 \u0438\u043d\u0438\u0446\u0438\u0430\u043b\u0438\u0437\u0430\u0442\u043e\u0440, \u043a\u0430\u043a \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u043e \u043d\u0438\u0436\u0435:<\/p>\n<pre><code class=\"swift\">let resolvedColor = Color.Resolved(red: 0, green: 0.6, blue: 0.9, opacity: 1)  Rectangle()     .fill(Color(resolvedColor).gradient)     .ignoresSafeArea() <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/34d\/4d1\/b66\/34d4d1b66d0387cfe78e5d3ed25e347c.png\" width=\"395\" height=\"228\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/34d\/4d1\/b66\/34d4d1b66d0387cfe78e5d3ed25e347c.png\"\/><\/figure>\n<figure class=\"full-width\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e98\/5d1\/2b1\/e985d12b15ecfd53ab942224b21775b7.webp\" width=\"892\" height=\"441\"\/><\/figure>\n<h4>\u0421\u043e\u0437\u0430\u0434\u043d\u0438\u0435 \u043a\u043d\u043e\u043f\u043e\u043a, \u043f\u043e\u0432\u0442\u043e\u0440\u044f\u044e\u0449\u0438\u0445 \u0441\u0432\u043e\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435, \u043f\u043e\u043a\u0430 \u043a\u043d\u043e\u043f\u043a\u0430 \u0443\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442\u0441\u044f<\/h4>\n<p>\u0412 SwiftUI \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0441\u043f\u0435\u0446\u0438\u0430\u043b\u044c\u043d\u044b\u0439 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>buttonRepeatBehavior()<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u044b\u0437\u044b\u0432\u0430\u0435\u0442 \u043f\u043e\u0432\u0442\u043e\u0440\u043d\u043e\u0435 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u043a\u043d\u043e\u043f\u043a\u0438, \u043f\u043e\u043a\u0430 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0443\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0435\u0451 \u043d\u0430\u0436\u0430\u0442\u043e\u0439. \u0421\u043a\u043e\u0440\u043e\u0441\u0442\u044c \u0432\u044b\u0437\u043e\u0432\u0430 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u043f\u043e\u0441\u0442\u0435\u043f\u0435\u043d\u043d\u043e \u0443\u0432\u0435\u043b\u0438\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0447\u0435\u043c \u0434\u043e\u043b\u044c\u0448\u0435 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0443\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u043a\u043d\u043e\u043f\u043a\u0443 \u043d\u0430\u0436\u0430\u0442\u043e\u0439, \u0442\u0435\u043c \u0431\u044b\u0441\u0442\u0440\u0435\u0435 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442 \u0432\u044b\u0437\u043e\u0432 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u0435\u0441\u043b\u0438 \u043d\u0430\u0436\u0430\u0442\u044c \u0442\u0430\u043a\u0443\u044e \u043a\u043d\u043e\u043f\u043a\u0443, \u043e\u043d\u0430 \u0434\u043e\u0431\u0430\u0432\u0438\u0442 1 \u043a \u0441\u0447\u0451\u0442\u0447\u0438\u043a\u0443, \u043d\u043e \u0435\u0441\u043b\u0438 \u0443\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c \u043a\u043d\u043e\u043f\u043a\u0443 \u043d\u0430\u0436\u0430\u0442\u043e\u0439, \u043e\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0442\u044c 1 \u0432\u0441\u0451 \u0431\u044b\u0441\u0442\u0440\u0435\u0435 \u0438 \u0431\u044b\u0441\u0442\u0440\u0435\u0435:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var tapCount = 0      var body: some View {         Button(\"Tap Count: \\(tapCount)\") {             tapCount += 1         }         .buttonRepeatBehavior(.enabled)     } } <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/522\/325\/ee9\/522325ee9351999f07eabb75eb8db13e.gif\" width=\"468\" height=\"174\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/522\/325\/ee9\/522325ee9351999f07eabb75eb8db13e.gif\"\/><\/figure>\n<p>\u042d\u0442\u0430 \u0444\u0443\u043d\u043a\u0446\u0438\u044f \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u044f \u0442\u0430\u043a\u0436\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u043d\u044b\u043c\u0438 \u0441\u043e\u0447\u0435\u0442\u0430\u043d\u0438\u044f\u043c\u0438, \u0445\u043e\u0442\u044f \u0442\u0430\u043c \u043e\u043d\u0430 \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0435\u043d\u0430 \u0441\u043a\u043e\u0440\u043e\u0441\u0442\u044c\u044e \u043f\u043e\u0432\u0442\u043e\u0440\u0435\u043d\u0438\u044f \u043a\u043b\u0430\u0432\u0438\u0448, \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u0435\u043c.<\/p>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043f\u0440\u0438\u043c\u0435\u0440 \u043a\u043e\u0434\u0430 \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044e \u0443\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0442\u044c Shift + Return \u0434\u043b\u044f \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e\u0433\u043e \u0432\u044b\u0437\u043e\u0432\u0430 \u043d\u0430\u0448\u0435\u0439 \u043a\u043d\u043e\u043f\u043a\u0438:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var tapCount = 0      var body: some View {         Button(\"Tap Count: \\(tapCount)\") {             tapCount += 1         }         .buttonRepeatBehavior(.enabled)         .keyboardShortcut(.return, modifiers: .shift)     } } <\/code><\/pre>\n<h3>\u0418 \u044d\u0442\u043e \u043d\u0435 \u0432\u0441\u0451&#8230;<\/h3>\n<h4>\u041e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u0430\u044f \u0437\u0430\u043b\u0438\u0432\u043a\u0430 \u0438 \u043e\u0431\u0432\u043e\u0434\u043a\u0430 \u0444\u0438\u0433\u0443\u0440<\/h4>\n<p>\u0412 iOS 17 \u0438 \u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u0437\u0434\u043d\u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0442\u044c \u0438 \u043e\u0431\u0432\u043e\u0434\u0438\u0442\u044c \u0444\u043e\u0440\u043c\u044b, \u043f\u0440\u043e\u0441\u0442\u043e \u043d\u0430\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b, \u0432\u043e\u0442 \u0442\u0430\u043a:<\/p>\n<pre><code class=\"swift\">Circle()     .stroke(.red, lineWidth: 20)     .fill(.orange)     .frame(width: 150, height: 150) <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/f9a\/2ae\/abc\/f9a2aeabc77d9cfe04fde5b8ae128fe3.png\" width=\"315\" height=\"227\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/f9a\/2ae\/abc\/f9a2aeabc77d9cfe04fde5b8ae128fe3.png\"\/><\/figure>\n<p>\u042d\u0442\u043e \u0434\u0430\u0436\u0435 \u0440\u0430\u0431\u043e\u0442\u0430\u0435\u0442 \u0441 \u043d\u0435\u0441\u043a\u043e\u043b\u044c\u043a\u0438\u043c\u0438 \u043e\u0431\u0432\u043e\u0434\u043a\u0430\u043c\u0438 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u0440\u0430\u0437\u043c\u0435\u0440\u043e\u0432:<\/p>\n<pre><code class=\"swift\">Circle()     .stroke(.blue, lineWidth: 45)     .stroke(.green, lineWidth: 35)     .stroke(.yellow, lineWidth: 25)     .stroke(.orange, lineWidth: 15)     .stroke(.red, lineWidth: 5)     .frame(width: 150, height: 150) <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/07c\/e65\/d69\/07ce65d697b7d24fc8c3a50b83a938e0.png\" width=\"390\" height=\"270\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/07c\/e65\/d69\/07ce65d697b7d24fc8c3a50b83a938e0.png\"\/><\/figure>\n<p>\u0412 iOS 16 \u0438 \u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u043d\u043d\u0438\u0445 \u0432\u0435\u0440\u0441\u0438\u044f\u0445 SwiftUI \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u044b <code>fill()<\/code>, <code>stroke()<\/code> \u0438 <code>strokeBorder()<\/code> \u0434\u043b\u044f \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 \u0440\u0438\u0441\u043e\u0432\u0430\u043d\u0438\u044f \u0444\u043e\u0440\u043c, \u043d\u043e \u043d\u0435 \u043f\u0440\u0435\u0434\u0443\u0441\u043c\u0430\u0442\u0440\u0438\u0432\u0430\u0435\u0442 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u043e\u0439 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u043e\u0434\u043d\u043e\u0432\u0440\u0435\u043c\u0435\u043d\u043d\u043e\u0433\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0438 \u043e\u0431\u0432\u043e\u0434\u043a\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0434\u043e\u0441\u0442\u0438\u0447\u044c \u0442\u0430\u043a\u043e\u0433\u043e \u0436\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u0434\u0432\u0443\u043c\u044f \u0440\u0430\u0437\u043d\u044b\u043c\u0438 \u0441\u043f\u043e\u0441\u043e\u0431\u0430\u043c\u0438.<\/p>\n<p>\u041f\u0435\u0440\u0432\u043e\u0435 \u0440\u0435\u0448\u0435\u043d\u0438\u0435 &#8212; \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c <code>strokeBorder()<\/code> \u0434\u043b\u044f \u0442\u043e\u0433\u043e, \u0447\u0442\u043e\u0431\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043a\u043e\u043d\u0442\u0443\u0440 \u0432\u043e\u043a\u0440\u0443\u0433 \u0432\u0430\u0448\u0435\u0439 \u0444\u0438\u0433\u0443\u0440\u044b, \u043f\u043e\u0441\u043b\u0435 \u0447\u0435\u0433\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0438\u0442\u044c \u0443\u0436\u0435 \u0437\u0430\u043f\u043e\u043b\u043d\u0435\u043d\u043d\u0443\u044e \u0444\u043e\u0440\u043c\u0443 \u043d\u0430 \u0444\u043e\u043d\u0435 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 <code>background()<\/code>. \u041f\u0440\u0438\u043c\u0435\u0440 \u043d\u0438\u0436\u0435 \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0435\u0442 \u043e\u0440\u0430\u043d\u0436\u0435\u0432\u044b\u0439 \u043a\u0440\u0443\u0433 \u0441 \u043a\u0440\u0430\u0441\u043d\u044b\u043c \u043a\u043e\u043d\u0442\u0443\u0440\u043e\u043c:<\/p>\n<pre><code class=\"swift\">Circle()     .strokeBorder(.red, lineWidth: 20)     .background(Circle().fill(.orange))     .frame(width: 150, height: 150) <\/code><\/pre>\n<figure class=\"\"><img loading=\"lazy\" decoding=\"async\" src=\"https:\/\/habrastorage.org\/r\/w1560\/getpro\/habr\/upload_files\/e33\/68c\/530\/e3368c53021d980473b42f3699b7ee7f.png\" width=\"369\" height=\"235\" data-src=\"https:\/\/habrastorage.org\/getpro\/habr\/upload_files\/e33\/68c\/530\/e3368c53021d980473b42f3699b7ee7f.png\"\/><\/figure>\n<p>\u0412\u0442\u043e\u0440\u043e\u0439 \u0432\u0430\u0440\u0438\u0430\u043d\u0442 \u2014 \u043d\u0430\u043b\u043e\u0436\u0438\u0442\u044c \u0434\u0432\u0430 \u043a\u0440\u0443\u0433\u0430 \u0432\u0440\u0443\u0447\u043d\u0443\u044e \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e <code>ZStack<\/code>:<\/p>\n<pre><code class=\"swift\">ZStack {     Circle()         .fill(.orange)      Circle()         .strokeBorder(.red, lineWidth: 20) } .frame(width: 150, height: 150) <\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0437\u0430\u043f\u043e\u043b\u043d\u0438\u0442\u044c \u0438 \u043e\u0431\u0432\u0435\u0441\u0442\u0438 \u0431\u043e\u043b\u044c\u0448\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0444\u043e\u0440\u043c, \u0441\u0442\u043e\u0438\u0442 \u043f\u043e\u0434\u0443\u043c\u0430\u0442\u044c \u043e \u0442\u043e\u043c, \u0447\u0442\u043e\u0431\u044b \u043e\u0431\u0435\u0440\u043d\u0443\u0442\u044c \u044d\u0442\u0443 \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0432 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435. \u041d\u043e \u0441\u0442\u043e\u0438\u0442 \u0443\u0447\u0435\u0441\u0442\u044c, \u0447\u0442\u043e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>strokeBorder()<\/code> \u0434\u043e\u0441\u0442\u0443\u043f\u0435\u043d \u0442\u043e\u043b\u044c\u043a\u043e \u0434\u043b\u044f <code>InsettableShapes<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u0430\u043c \u043f\u043e\u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0434\u0432\u0430 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u044f \u2013 \u043e\u0434\u043d\u043e \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441 \u043e\u0431\u044b\u0447\u043d\u044b\u043c\u0438 \u0444\u0438\u0433\u0443\u0440\u0430\u043c\u0438 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <code>stroke()<\/code>, \u0438 \u0434\u0440\u0443\u0433\u043e\u0435 &#8212; \u0434\u043b\u044f <code>InsettableShapes<\/code> \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c <code>strokeBorder()<\/code>:<\/p>\n<pre><code class=\"swift\">extension Shape {     func fill&lt;Fill: ShapeStyle, Stroke: ShapeStyle>(_ fillStyle: Fill, strokeBorder strokeStyle: Stroke, lineWidth: Double = 1) -> some View {         self             .stroke(strokeStyle, lineWidth: lineWidth)             .background(self.fill(fillStyle))     } }  extension InsettableShape {     func fill&lt;Fill: ShapeStyle, Stroke: ShapeStyle>(_ fillStyle: Fill, strokeBorder strokeStyle: Stroke, lineWidth: Double = 1) -> some View {         self             .strokeBorder(strokeStyle, lineWidth: lineWidth)             .background(self.fill(fillStyle))     } } <\/code><\/pre>\n<h4>\u0417\u0430\u043f\u0443\u0441\u043a \u043a\u043e\u0434\u0430 \u043f\u0440\u0438 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0438 \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c onChange()<\/h4>\n<p>\u041d\u0430\u0447\u0438\u043d\u0430\u044f \u0441 \u0432\u0435\u0440\u0441\u0438\u0438 iOS 17 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>onChange()<\/code> \u0432 SwiftUI \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u043f\u0440\u0438\u0432\u044f\u0437\u0430\u0442\u044c \u043a \u043b\u044e\u0431\u043e\u043c\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0443 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430 \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0431\u0443\u0434\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u044f\u0442\u044c\u0441\u044f, \u043a\u043e\u0433\u0434\u0430 \u043f\u0440\u043e\u0438\u0437\u043e\u0439\u0434\u0435\u0442 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0451\u043d\u043d\u043e\u0433\u043e \u0441\u043e\u0441\u0442\u043e\u044f\u043d\u0438\u044f \u0432 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0438. \u042d\u0442\u043e \u043e\u0441\u043e\u0431\u0435\u043d\u043d\u043e \u0446\u0435\u043d\u043d\u043e, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u043d\u0430\u043c \u043d\u0435 \u0432\u0441\u0435\u0433\u0434\u0430 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u044b \u043d\u0430\u0431\u043b\u044e\u0434\u0430\u0442\u0435\u043b\u0438 \u0437\u0430 \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u0430\u043c\u0438, \u0442\u0430\u043a\u0438\u0435 \u043a\u0430\u043a <code>didSet<\/code>, \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u043a\u043e\u043d\u0441\u0442\u0440\u0443\u043a\u0446\u0438\u044f\u043c\u0438 \u043f\u043e\u0434\u043e\u0431\u043d\u044b\u043c\u0438 <code>@State<\/code>.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e<\/strong>: \u042d\u0442\u043e \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0432\u0441\u0442\u0443\u043f\u0430\u0435\u0442 \u0432 \u0441\u0438\u043b\u0443 \u0441 \u0432\u0435\u0440\u0441\u0438\u0438 iOS 17, \u0430 \u0441\u0442\u0430\u0440\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u0441\u044f \u0437\u0430\u0434\u0435\u043f\u0440\u0438\u043a\u0435\u0439\u0447\u0435\u043d\u043d\u044b\u043c.<\/p>\n<p>\u0412 \u0441\u043b\u0443\u0447\u0430\u0435 \u0440\u0430\u0431\u043e\u0442\u044b \u0441 iOS 16 \u0438 \u0431\u043e\u043b\u0435\u0435 \u0440\u0430\u043d\u043d\u0438\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c\u0438, <code>onChange()<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043e\u0434\u0438\u043d \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 \u0438 \u0432\u043e\u0437\u0432\u0440\u0430\u0449\u0430\u0435\u0442 \u0435\u0433\u043e \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u0431\u043b\u043e\u043a\u0435 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u044f. \u041a \u043f\u0440\u0438\u043c\u0435\u0440\u0443, \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u0438\u043c\u0435\u043d\u0438 \u043c\u043e\u0436\u043d\u043e \u043e\u0442\u0441\u043b\u0435\u0436\u0438\u0432\u0430\u0442\u044c \u0438 \u0432\u044b\u0432\u043e\u0434\u0438\u0442\u044c \u0432 \u0440\u0435\u0430\u043b\u044c\u043d\u043e\u043c \u0432\u0440\u0435\u043c\u0435\u043d\u0438:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var name = \"\"      var body: some View {         TextField(\"Enter your name:\", text: $name)             .textFieldStyle(.roundedBorder)             .onChange(of: name) { newValue in                 print(\"Name changed to \\(name)!\")             }     } } <\/code><\/pre>\n<p>\u0415\u0441\u043b\u0438 \u0432\u044b \u043d\u0430\u0446\u0435\u043b\u0435\u043d\u044b \u043d\u0430 \u0440\u0430\u0431\u043e\u0442\u0443 \u0441 iOS 17 \u0438\u043b\u0438 \u0431\u043e\u043b\u0435\u0435 \u043f\u043e\u0437\u0434\u043d\u0438\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c\u0438, \u0441\u0443\u0449\u0435\u0441\u0442\u0432\u0443\u0435\u0442 \u0432\u0430\u0440\u0438\u0430\u043d\u0442, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043d\u0435 \u0442\u0440\u0435\u0431\u0443\u0435\u0442 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432 \u2013 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043f\u0440\u043e\u0441\u0442\u043e \u043f\u0440\u043e\u0447\u0438\u0442\u0430\u0442\u044c \u0441\u0432\u043e\u0439\u0441\u0442\u0432\u043e \u043d\u0430\u043f\u0440\u044f\u043c\u0443\u044e \u0438 \u0431\u044b\u0442\u044c \u0443\u0432\u0435\u0440\u0435\u043d\u043d\u044b\u043c\u0438 \u0432 \u043f\u043e\u043b\u0443\u0447\u0435\u043d\u0438\u0438 \u0435\u0433\u043e \u043d\u043e\u0432\u043e\u0433\u043e \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u043e\u0442\u043b\u0438\u0447\u0430\u0435\u0442\u0441\u044f \u043e\u0442 \u0440\u0430\u0431\u043e\u0442\u044b \u0432\u0435\u0440\u0441\u0438\u0438 \u0441 \u043e\u0434\u043d\u0438\u043c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u043c \u0432 iOS 16 \u0438 \u0440\u0430\u043d\u0435\u0435.<\/p>\n<p>iOS 17 \u0440\u0430\u0441\u0448\u0438\u0440\u044f\u0435\u0442 \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u0438 \u0438 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u0435\u0442 \u0435\u0449\u0451 \u0434\u0432\u0435 \u043e\u043f\u0446\u0438\u0438: \u043e\u0434\u043d\u0430 \u0438\u0437 \u043d\u0438\u0445 \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u0438\u0432\u0430\u0435\u0442 \u0434\u0432\u0430 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 \u0432 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u0438, \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0449\u0438\u0445 \u0441\u0442\u0430\u0440\u043e\u0435 \u0438 \u043d\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0430 \u0432\u0442\u043e\u0440\u0430\u044f \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c, \u0434\u043e\u043b\u0436\u0435\u043d \u043b\u0438 \u0438\u0441\u043f\u043e\u043b\u043d\u044f\u0442\u044c\u0441\u044f \u043a\u043e\u0434 \u0432\u0430\u0448\u0435\u0439 \u0444\u0443\u043d\u043a\u0446\u0438\u0438 \u043f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u043c \u043f\u043e\u043a\u0430\u0437\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<p>\u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043f\u0440\u0438\u043d\u0442 \u0432\u044b\u0432\u043e\u0434\u0438\u0442 \u043a\u0430\u043a \u0441\u0442\u0430\u0440\u043e\u0435, \u0442\u0430\u043a \u0438 \u043d\u043e\u0432\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435 \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var name = \"\"      var body: some View {         TextField(\"Enter your name\", text: $name)             .onChange(of: name) { oldValue, newValue in                 print(\"Changing from \\(oldValue) to \\(newValue)\")             }     } } <\/code><\/pre>\n<p>\u0412 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0432\u044b\u0432\u043e\u0434\u0438\u0442\u0441\u044f \u0443\u0432\u0435\u0434\u043e\u043c\u043b\u0435\u043d\u0438\u0435 \u043f\u0440\u0438 \u0441\u043c\u0435\u043d\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u044f, \u0430 \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u043d\u044b\u0439 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 <code>initial: true<\/code> \u0442\u0430\u043a\u0436\u0435 \u0438\u043d\u0438\u0446\u0438\u0438\u0440\u0443\u0435\u0442 \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u0435 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u044f \u043f\u0440\u0438 \u043f\u0435\u0440\u0432\u043e\u043c \u043f\u043e\u043a\u0430\u0437\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var name = \"\"      var body: some View {         TextField(\"Enter your name\", text: $name)             .onChange(of: name, initial: true) {                 print(\"Name is now \\(name)\")             }     } } <\/code><\/pre>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u0430 <code>initial: true<\/code> \u2013 \u044d\u0442\u043e \u0443\u0434\u043e\u0431\u043d\u044b\u0439 \u0441\u043f\u043e\u0441\u043e\u0431 \u043e\u0431\u044a\u0435\u0434\u0438\u043d\u0438\u0442\u044c \u0444\u0443\u043d\u043a\u0446\u0438\u043e\u043d\u0430\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0432 \u043e\u0434\u043d\u043e\u043c \u043c\u0435\u0441\u0442\u0435 \u2013 \u0432\u043c\u0435\u0441\u0442\u043e \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0445 \u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0439 \u0432 <code>onAppear()<\/code> \u0438 <code>onChange()<\/code>, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0432\u0441\u0451 \u0437\u0430 \u043e\u0434\u0438\u043d \u043f\u0440\u043e\u0445\u043e\u0434.<\/p>\n<p>\u0412 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0441\u0438\u0442\u0443\u0430\u0446\u0438\u044f\u0445 \u0431\u043e\u043b\u0435\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u0438\u0432\u043d\u043e \u0431\u0443\u0434\u0435\u0442 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0441\u043e\u0431\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0435 \u0440\u0430\u0441\u0448\u0438\u0440\u0435\u043d\u0438\u0435 \u0434\u043b\u044f <code>Binding<\/code>, \u0432\u043c\u0435\u0441\u0442\u043e \u0442\u043e\u0433\u043e \u0447\u0442\u043e\u0431\u044b \u0432\u044b\u0437\u044b\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>onChange()<\/code> \u0438\u0437 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430. \u042d\u0442\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u0438\u0442 \u043b\u0443\u0447\u0448\u0435 \u043e\u0440\u0433\u0430\u043d\u0438\u0437\u043e\u0432\u0430\u0442\u044c \u043a\u043e\u0434, &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u044f&#187; \u043d\u0430\u0431\u043b\u044e\u0434\u0430\u0442\u0435\u043b\u044f \u043a \u043e\u0431\u044a\u0435\u043a\u0442\u0443 \u0435\u0433\u043e \u043d\u0430\u0431\u043b\u044e\u0434\u0435\u043d\u0438\u044f, \u0438 \u0438\u0437\u0431\u0435\u0433\u0430\u044f \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e\u0441\u0442\u0438 \u043c\u043d\u043e\u0436\u0435\u0441\u0442\u0432\u0435\u043d\u043d\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430 <code>onChange()<\/code> \u0432 \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0445 \u043c\u0435\u0441\u0442\u0430\u0445 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<p>\u0412\u043e\u0442 \u043a\u0430\u043a \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u0432\u044b\u0433\u043b\u044f\u0434\u0435\u0442\u044c:<\/p>\n<pre><code class=\"swift\">extension Binding {     func onChange(_ handler: @escaping (Value) -> Void) -> Binding&lt;Value> {         Binding(             get: { self.wrappedValue },             set: { newValue in                 self.wrappedValue = newValue                 handler(newValue)             }         )     } }  struct ContentView: View {     @State private var name = \"\"      var body: some View {         TextField(\"Enter your name:\", text: $name.onChange(nameChanged))             .textFieldStyle(.roundedBorder)     }      func nameChanged(to value: String) {         print(\"Name changed to \\(name)!\")     } } <\/code><\/pre>\n<p>\u041e\u0434\u043d\u0430\u043a\u043e, \u043f\u0435\u0440\u0435\u0434 \u0442\u0435\u043c \u043a\u0430\u043a \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c \u044d\u0442\u043e, \u043e\u0431\u044f\u0437\u0430\u0442\u0435\u043b\u044c\u043d\u043e \u043f\u0440\u043e\u0432\u0435\u0434\u0438\u0442\u0435 \u0430\u043d\u0430\u043b\u0438\u0437 \u0432\u0430\u0448\u0435\u0433\u043e \u043a\u043e\u0434\u0430 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c Instruments \u2013 \u0432\u043d\u0435\u0434\u0440\u0435\u043d\u0438\u0435 <code>onChange()<\/code> \u043d\u0435\u043f\u043e\u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0435\u043d\u043d\u043e \u0432 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442 \u0431\u043e\u043b\u0435\u0435 \u0432\u044b\u0441\u043e\u043a\u0443\u044e \u043f\u0440\u043e\u0438\u0437\u0432\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c, \u0447\u0435\u043c \u0435\u0433\u043e \u043f\u0440\u0438\u0441\u043e\u0435\u0434\u0438\u043d\u0435\u043d\u0438\u0435 \u043a binding.<\/p>\n<h4>\u041d\u043e\u0432\u044b\u0439 API \u0434\u043b\u044f \u0440\u0430\u0431\u043e\u0442\u044b \u0441\u043e spring \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f\u043c\u0438<\/h4>\n<p>SwiftUI \u043f\u0440\u0435\u0434\u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0435 \u0441\u0440\u0435\u0434\u0441\u0442\u0432\u0430 \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0442\u0438\u043f\u0430 spring, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0437\u0430\u0441\u0442\u0430\u0432\u043b\u044f\u044e\u0442 \u043f\u0440\u0443\u0436\u0438\u043d\u0438\u0442\u044c \u043e\u0431\u044a\u0435\u043a\u0442 \u043f\u0440\u0438 \u043e\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0435.<\/p>\n<p>\u0415\u0441\u043b\u0438 \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u0442\u044c <code>.spring()<\/code> \u0431\u0435\u0437 \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u0445 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u0431\u0443\u0434\u0435\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u043e \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0432 \u0434\u0430\u043d\u043d\u043e\u043c \u0441\u043b\u0443\u0447\u0430\u0435 \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f spring \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f, \u043f\u0440\u0438 \u043a\u043e\u0442\u043e\u0440\u043e\u0439 \u043a\u043d\u043e\u043f\u043a\u0430 \u043f\u043e\u0432\u043e\u0440\u0430\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043d\u0430 45 \u0433\u0440\u0430\u0434\u0443\u0441\u043e\u0432 \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u043d\u0430\u0436\u0430\u0442\u0438\u0438 \u043d\u0430 \u043d\u0435\u0435:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var angle: Double = 0      var body: some View {         Button(\"Press here\") {             angle += 45         }         .padding()         .rotationEffect(.degrees(angle))         .animation(.spring(), value: angle)     } } <\/code><\/pre>\n<p>\u0414\u043b\u044f \u0431\u043e\u043b\u0435\u0435 \u043a\u043e\u043c\u043f\u043b\u0435\u043a\u0441\u043d\u043e\u0439 \u043d\u0430\u0441\u0442\u0440\u043e\u0439\u043a\u0438 spring \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u043c\u043e\u0433\u0443\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0440\u0430\u0437\u043b\u0438\u0447\u043d\u044b\u0435 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b:<\/p>\n<ol>\n<li>\n<p>\u0414\u043b\u044f \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0441\u0442\u0438 \u0441 iOS 16 \u0438 \u0431\u043e\u043b\u0435\u0435 \u0441\u0442\u0430\u0440\u044b\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c\u0438, \u0442\u0440\u0435\u0431\u0443\u0435\u0442\u0441\u044f \u0437\u0430\u0434\u0430\u0442\u044c \u0442\u0430\u043a\u0438\u0435 \u0445\u0430\u0440\u0430\u043a\u0442\u0435\u0440\u0438\u0441\u0442\u0438\u043a\u0438, \u043a\u0430\u043a \u043c\u0430\u0441\u0441\u0430 \u043e\u0431\u044a\u0435\u043a\u0442\u0430, \u0436\u0435\u0441\u0442\u043a\u043e\u0441\u0442\u044c \u043f\u0440\u0443\u0436\u0438\u043d\u044b, \u0442\u0435\u043c\u043f \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u044f \u0438 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0435 \u0443\u0441\u043a\u043e\u0440\u0435\u043d\u0438\u0435.<\/p>\n<\/li>\n<li>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0430\u0448\u0435 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u043e\u0440\u0438\u0435\u043d\u0442\u0438\u0440\u043e\u0432\u0430\u043d\u043e \u0442\u043e\u043b\u044c\u043a\u043e \u043d\u0430 iOS 17 \u0438 \u0431\u043e\u043b\u0435\u0435 \u043d\u043e\u0432\u044b\u0435 \u0432\u0435\u0440\u0441\u0438\u0438, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u0430 \u0442\u0430\u043a\u0436\u0435 \u043f\u043e \u0436\u0435\u043b\u0430\u043d\u0438\u044e \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u044c \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u044b \u043e\u0442\u0441\u043a\u043e\u043a\u0430 \u0438 \u0441\u043c\u0435\u0448\u0438\u0432\u0430\u043d\u0438\u044f.<\/p>\n<\/li>\n<\/ol>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0435 \u043a\u043d\u043e\u043f\u043a\u0438, \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c\u043e\u0439 \u0441 iOS 16, \u0441 \u0443\u043c\u0435\u0440\u0435\u043d\u043d\u043e\u0439 \u0441\u0442\u0435\u043f\u0435\u043d\u044c\u044e \u0437\u0430\u0442\u0443\u0445\u0430\u043d\u0438\u044f \u043f\u0440\u0443\u0436\u0438\u043d\u044b, \u0447\u0442\u043e \u043e\u0437\u043d\u0430\u0447\u0430\u0435\u0442, \u0447\u0442\u043e \u043e\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u043d\u0435\u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0440\u0435\u043c\u044f \u043a\u043e\u043b\u0435\u0431\u0430\u0442\u044c\u0441\u044f \u0434\u043e \u0434\u043e\u0441\u0442\u0438\u0436\u0435\u043d\u0438\u044f \u043a\u043e\u043d\u0435\u0447\u043d\u043e\u0433\u043e \u0443\u0433\u043b\u0430:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var angle: Double = 0      var body: some View {         Button(\"Press here\") {             angle += 45         }         .padding()         .rotationEffect(.degrees(angle))         .animation(.interpolatingSpring(mass: 1, stiffness: 1, damping: 0.5, initialVelocity: 10), value: angle)     } } <\/code><\/pre>\n<p><strong>\u0417\u0430\u043c\u0435\u0442\u043a\u0430:<\/strong> \u043c\u044b \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u043c \u0438\u043d\u0442\u0435\u0440\u043f\u043e\u043b\u0438\u0440\u0443\u044e\u0449\u0443\u044e \u043f\u0440\u0443\u0436\u0438\u043d\u0443, \u0447\u0442\u043e \u0432\u0435\u0434\u0435\u0442 \u043a \u0443\u0441\u0438\u043b\u0435\u043d\u0438\u044e \u044d\u0444\u0444\u0435\u043a\u0442\u0430 \u043f\u0440\u0443\u0436\u0438\u043d\u044b \u043f\u0440\u0438 \u043c\u043d\u043e\u0433\u043e\u043a\u0440\u0430\u0442\u043d\u043e\u043c \u0437\u0430\u043f\u0443\u0441\u043a\u0435 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438, \u043f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044d\u0444\u0444\u0435\u043a\u0442\u044b \u043f\u0440\u0443\u0436\u0438\u043d \u0441\u043a\u043b\u0430\u0434\u044b\u0432\u0430\u044e\u0442\u0441\u044f.<\/p>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0438\u0439 \u043a\u043e\u0434 \u0434\u043e\u0441\u0442\u0438\u0433\u0430\u0435\u0442 \u0441\u0445\u043e\u0436\u0435\u0433\u043e \u0440\u0435\u0437\u0443\u043b\u044c\u0442\u0430\u0442\u0430, \u043d\u043e \u043e\u043d \u0441\u043e\u0432\u043c\u0435\u0441\u0442\u0438\u043c \u0442\u043e\u043b\u044c\u043a\u043e \u0441 iOS 17 \u0438 \u0431\u043e\u043b\u0435\u0435 \u043d\u043e\u0432\u044b\u043c\u0438 \u0432\u0435\u0440\u0441\u0438\u044f\u043c\u0438:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     @State private var scale = 1.0      var body: some View {         Button(\"Press here\") {             scale += 1         }         .scaleEffect(scale)         .animation(.spring(duration: 1, bounce: 0.75), value: scale)     } } <\/code><\/pre>\n<p>\u0423\u0447\u0438\u0442\u044b\u0432\u0430\u044f, \u043d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u043f\u0440\u043e\u0449\u0435 \u043d\u043e\u0432\u044b\u0439 API \u043f\u043e \u0441\u0440\u0430\u0432\u043d\u0435\u043d\u0438\u044e \u0441\u043e \u0441\u0442\u0430\u0440\u044b\u043c \u044d\u043a\u0432\u0438\u0432\u0430\u043b\u0435\u043d\u0442\u043e\u043c, \u044f \u0431\u044b \u043f\u043e\u0441\u043e\u0432\u0435\u0442\u043e\u0432\u0430\u043b \u043f\u0435\u0440\u0435\u0439\u0442\u0438 \u043d\u0430 \u043d\u0435\u0433\u043e, \u043a\u0430\u043a \u043c\u043e\u0436\u043d\u043e \u0441\u043a\u043e\u0440\u0435\u0435.<\/p>\n<h4>\u041f\u0440\u043e\u0447\u0438\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u044f<\/h4>\n<ul>\n<li>\n<p>\u041c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>foregroundColor()<\/code> \u0442\u0435\u043f\u0435\u0440\u044c \u0441\u0447\u0438\u0442\u0430\u0435\u0442\u0441\u044f \u0443\u0441\u0442\u0430\u0440\u0435\u0432\u0448\u0438\u043c \u0438 \u0435\u0433\u043e \u0437\u0430\u043c\u0435\u043d\u0438\u043b \u043d\u043e\u0432\u044b\u0439 &#8212; <code>foregroundStyle()<\/code><\/p>\n<\/li>\n<li>\n<p>\u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0446\u0432\u0435\u0442\u043e\u0432 \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u0433\u0440\u0430\u0434\u0438\u0435\u043d\u0442\u0430 \u0431\u0443\u0434\u0435\u0442 \u043f\u0440\u043e\u0438\u0441\u0445\u043e\u0434\u0438\u0442\u044c \u0441 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0435\u0439<\/p>\n<\/li>\n<li>\n<p>Spring \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u044f \u0442\u0435\u043f\u0435\u0440\u044c \u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0434\u0435\u0444\u043e\u043b\u0442\u043d\u043e\u0439 \u0432 SwiftUI \u0438 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u0442 \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u0431\u043e\u043b\u044c\u0448\u0435 \u0432\u0441\u0442\u0440\u043e\u0435\u043d\u043d\u044b\u0445 \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a <code>.bouncy<\/code> \u0438 <code>.snappy<\/code>, \u0430 \u0441\u0430\u043c\u0438 \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0438 \u0442\u0435\u043f\u0435\u0440\u044c \u0441\u043e\u0437\u0434\u0430\u044e\u0442\u0441\u044f \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e API<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u044f\u0432\u0438\u043b\u0430\u0441\u044c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0441\u043a\u0440\u0443\u0433\u043b\u044f\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u0435 \u0443\u0433\u043b\u044b \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430, \u0430 \u043d\u0435 \u0432\u0441\u0435 \u0441\u0440\u0430\u0437\u0443<\/p>\n<\/li>\n<li>\n<p>\u0423\u043f\u0440\u043e\u0449\u0435\u043d \u0441\u0438\u043d\u0442\u0430\u043a\u0441\u0438\u0441 \u0434\u043b\u044f \u0437\u0430\u043b\u0438\u0432\u043a\u0438 \u0438 \u043e\u0431\u0440\u0435\u0437\u043a\u0438 \u0444\u0438\u0433\u0443\u0440: <code>.rect<\/code>, <code>.capsule<\/code> \u0438 \u0442.\u0434.<\/p>\n<\/li>\n<li>\n<p>\u041f\u0440\u0438 \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u0438 \u0442\u0430\u0431\u043b\u0438\u0447\u043d\u044b\u0445 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0432\u043c\u0435\u0441\u0442\u043e <code>ForEach(users, content: TableRow.init)<\/code> \u043c\u043e\u0436\u043d\u043e \u043f\u0438\u0441\u0430\u0442\u044c \u043f\u0440\u043e\u0441\u0442\u043e <code>ForEach(users)<\/code><\/p>\n<\/li>\n<\/ul>\n<p>\u0421\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u0435 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u0431\u043e\u043b\u044c\u0448\u0435 \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a Xcode, \u043d\u0435\u0436\u0435\u043b\u0438 \u043a SwiftUI, \u043d\u043e \u0432\u0441\u0435 \u0436\u0435 \u0442\u0435\u043f\u0435\u0440\u044c \u0432\u0441\u0435 \u0446\u0432\u0435\u0442\u0430 \u0438 \u0438\u0437\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u044f, \u043d\u0430\u0445\u043e\u0434\u044f\u0449\u0438\u0435\u0441\u044f \u0432 \u043a\u0430\u0442\u0430\u043b\u043e\u0433\u0435 assets, \u0442\u0435\u043f\u0435\u0440\u044c \u0438\u043c\u0435\u044e\u0442 \u0441\u0442\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438\u0435 \u0438\u043c\u0435\u043d\u0430, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0432 \u043a\u043e\u0434\u0435 \u0431\u0435\u0437 \u0441\u0442\u0440\u043e\u043a\u043e\u0432\u044b\u0445 \u043b\u0438\u0442\u0435\u0440\u0430\u043b\u043e\u0432. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u043c\u044b \u043c\u043e\u0436\u0435\u043c \u043d\u0430\u043f\u0438\u0441\u0430\u0442\u044c <code>Image(.dog)<\/code> \u0432\u043c\u0435\u0441\u0442\u043e `Image(&#171;dog&#187;).<\/p>\n<p>\u0422\u0430\u043a\u0436\u0435 \u043f\u043e\u044f\u0432\u0438\u043b\u0438\u0441\u044c \u043d\u043e\u0432\u044b\u0435 API \u0434\u043b\u044f \u0432\u044b\u043f\u043e\u043b\u043d\u0435\u043d\u0438\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439 \u0441 \u043a\u043b\u044e\u0447\u0435\u0432\u044b\u043c\u0438 \u043a\u0430\u0434\u0440\u0430\u043c\u0438, \u043d\u043e\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0434\u043b\u044f \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043a\u0430\u0440\u0442\u0430\u043c\u0438 \u0438 \u043c\u043d\u043e\u0433\u043e\u0435 \u0434\u0440\u0443\u0433\u043e\u0435.<\/p>\n<p>\u0421\u043f\u0430\u0441\u0438\u0431\u043e \u0437\u0430 \u0432\u043d\u0438\u043c\u0430\u043d\u0438\u0435!<\/p>\n<\/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\/748478\/\"> https:\/\/habr.com\/ru\/articles\/748478\/<\/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>SwiftUI \u043f\u0440\u043e\u0434\u043e\u043b\u0436\u0430\u0435\u0442 \u0431\u044b\u0441\u0442\u0440\u043e \u0440\u0430\u0437\u0432\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u0438 \u0432 \u044d\u0442\u043e\u043c \u0433\u043e\u0434\u0443 \u043c\u044b \u0432\u0438\u0434\u0438\u043c \u043e\u0433\u0440\u043e\u043c\u043d\u043e\u0435 \u043a\u043e\u043b\u0438\u0447\u0435\u0441\u0442\u0432\u043e \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0439 \u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0435, \u0438\u043d\u0442\u0435\u0440\u0435\u0441\u043d\u044b\u0435 \u043d\u043e\u0432\u044b\u0435 \u044d\u0444\u0444\u0435\u043a\u0442\u044b SF Symbols, \u043f\u0440\u043e\u0434\u0432\u0438\u043d\u0443\u0442\u0443\u044e \u043f\u043e\u0434\u0434\u0435\u0440\u0436\u043a\u0443 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal \u0438 \u043c\u043d\u043e\u0433\u043e\u0435 \u0434\u0440\u0443\u0433\u043e\u0435.<\/p>\n<p>\u041d\u0435\u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u044f \u0432 \u044d\u0442\u043e\u043c \u0440\u0435\u043b\u0438\u0437\u0435 \u0438\u0437 \u0447\u0438\u0441\u043b\u0430 \u0442\u0435\u0445, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0430\u0432\u0442\u043e\u0440 \u043f\u0440\u0435\u0434\u043b\u0430\u0433\u0430\u043b \u043b\u0438\u0447\u043d\u043e. \u0421\u0440\u0435\u0434\u0438 \u043d\u0438\u0445 &#8212; \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0448\u0435\u0439\u0434\u0435\u0440\u043e\u0432 Metal, \u0443\u043b\u0443\u0447\u0448\u0435\u043d\u0438\u0435 \u0440\u0430\u0431\u043e\u0442\u044b\u00a0<code>Color<\/code>\u00a0\u0441\u00a0<code>Codable<\/code>, \u0434\u043e\u0431\u0430\u0432\u043b\u0435\u043d\u0438\u0435 \u0437\u0430\u043c\u044b\u043a\u0430\u043d\u0438\u044f \u043f\u043e \u0437\u0430\u0432\u0435\u0440\u0448\u0435\u043d\u0438\u0438 \u0434\u043b\u044f \u0430\u043d\u0438\u043c\u0430\u0446\u0438\u0439, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0434\u0430\u0435\u0442 \u043d\u0430\u043c \u0432\u043e\u0437\u043c\u043e\u0436\u043d\u043e\u0441\u0442\u044c \u0430\u043d\u0438\u043c\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0433\u0440\u0430\u0434\u0438\u0435\u043d\u0442\u044b. \u0422\u0435\u043f\u0435\u0440\u044c \u043c\u044b \u0435\u0449\u0451 \u043c\u043e\u0436\u0435\u043c \u0441\u043a\u0440\u0443\u0433\u043b\u044f\u0442\u044c \u0443\u0433\u043b\u044b \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 \u043f\u043e \u0441\u0432\u043e\u0435\u043c\u0443 \u0443\u0441\u043c\u043e\u0442\u0440\u0435\u043d\u0438\u044e. \u0422\u043e\u043b\u044c\u043a\u043e \u0431\u043b\u0430\u0433\u043e\u0434\u0430\u0440\u044f \u043f\u0435\u0440\u0432\u043e\u0439 \u0431\u0435\u0442\u0430-\u0432\u0435\u0440\u0441\u0438\u0438 \u0430\u0432\u0442\u043e\u0440 \u0437\u0430\u043a\u0440\u044b\u043b \u043a\u0430\u043a \u043c\u0438\u043d\u0438\u043c\u0443\u043c \u0434\u044e\u0436\u0438\u043d\u0443 \u0441\u0432\u043e\u0438\u0445 \u043f\u0440\u0435\u0434\u043b\u043e\u0436\u0435\u043d\u0438\u0439!<\/p>\n<h3>\u041d\u0430\u0431\u043e\u0440 \u043e\u0431\u043d\u043e\u0432\u043b\u0435\u043d\u0438\u0439 \u0434\u043b\u044f ScrollView<\/h3>\n<h4>\u041f\u0440\u0438\u0432\u044f\u0437\u043a\u0430 ScrollView \u043a \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c \u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c<\/h4>\n<p>\u0412 SwiftUI \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u043f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u0434\u0432\u0438\u0433\u0430\u0435\u0442\u0441\u044f \u043f\u043b\u0430\u0432\u043d\u043e, \u043d\u043e \u0441 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435\u043c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432\u00a0<code>scrollTargetLayout()<\/code>\u00a0\u0438\u00a0<code>scrollTargetBehavior()<\/code>\u00a0\u043c\u044b \u043c\u043e\u0436\u0435\u043c \u0441\u0434\u0435\u043b\u0430\u0442\u044c \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043e\u043d \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u043b\u0441\u044f&#187; \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c \u0438\u043b\u0438 \u0446\u0435\u043b\u044b\u043c \u0441\u0442\u0440\u0430\u043d\u0438\u0446\u0430\u043c.<\/p>\n<p>\u041f\u043e\u043c\u0435\u0441\u0442\u0438\u043c \u0432 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430 10 \u0441\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432 \u0432 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u044b\u0439 ScrollView, \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0431\u0443\u0434\u0435\u0442 \u0446\u0435\u043b\u0435\u0432\u044b\u043c \u043f\u0440\u0438 \u0441\u043a\u0440\u043e\u043b\u043b\u0438\u043d\u0433\u0435. \u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443\u00a0<code>.scrollTargetBehavior()<\/code>\u00a0\u0443\u0441\u0442\u0430\u043d\u043e\u0432\u043b\u0435\u043d \u043a\u0430\u043a\u00a0<code>.viewAligned<\/code>, SwiftUI \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0431\u0443\u0434\u0435\u0442 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f&#187; \u043a \u043a\u0430\u0436\u0434\u043e\u043c\u0443 \u0438\u0437 \u0441\u043a\u0440\u0443\u0433\u043b\u0435\u043d\u043d\u044b\u0445 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u043e\u0432:<\/p>\n<pre><code class=\"swift\">struct ContentView: View {     var body: some View {         ScrollView(.horizontal) {             LazyHStack {                 ForEach(0..&lt;10) { index in                     RoundedRectangle(cornerRadius: 25)                         .fill(Color(hue: Double(index) \/ 10, saturation: 1, brightness: 1).gradient)                         .frame(width: 300, height: 100)                 }             }             .scrollTargetLayout()         }         .scrollTargetBehavior(.viewAligned)         .safeAreaPadding(.horizontal, 40)     } }<\/code><\/pre>\n<figure class=\"full-width\"><\/figure>\n<p>\u041f\u0440\u0438 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0438 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u00a0<code>scrollTargetLayout()<\/code>, \u0432\u0441\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432\u043d\u0443\u0442\u0440\u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430 \u0441\u0442\u0430\u043d\u043e\u0432\u044f\u0442\u0441\u044f \u0446\u0435\u043b\u044f\u043c\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u043a \u043a\u043e\u0442\u043e\u0440\u044b\u043c ScrollView \u043c\u043e\u0436\u0435\u0442 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u0442\u044c\u0441\u044f&#187;. \u0415\u0441\u043b\u0438 \u043d\u0435\u043e\u0431\u0445\u043e\u0434\u0438\u043c\u043e, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 &#171;\u043f\u0440\u0438\u0432\u044f\u0437\u044b\u0432\u0430\u043b\u0430\u0441\u044c&#187; \u0442\u043e\u043b\u044c\u043a\u043e \u043a \u043e\u043f\u0440\u0435\u0434\u0435\u043b\u0435\u043d\u043d\u044b\u043c \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c, \u0442\u043e \u0432\u043c\u0435\u0441\u0442\u043e\u00a0<code>scrollTargetLayout()<\/code>\u00a0\u043d\u0443\u0436\u043d\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u00a0<code>scrollTarget()<\/code>, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0434\u043b\u044f \u043e\u0442\u0434\u0435\u043b\u044c\u043d\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<p>\u0415\u0441\u0442\u044c \u0438 \u0430\u043b\u044c\u0442\u0435\u0440\u043d\u0430\u0442\u0438\u0432\u043d\u044b\u0439 \u0440\u0435\u0436\u0438\u043c \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u2014\u00a0<code>.paging<\/code>. \u042d\u0442\u043e\u0442 \u0440\u0435\u0436\u0438\u043c \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 ScrollView \u043f\u0435\u0440\u0435\u043c\u0435\u0449\u0430\u0442\u044c\u0441\u044f \u0440\u043e\u0432\u043d\u043e \u043d\u0430 \u0448\u0438\u0440\u0438\u043d\u0443 \u0438\u043b\u0438 \u0432\u044b\u0441\u043e\u0442\u0443 \u044d\u043a\u0440\u0430\u043d\u0430, \u0432 \u0437\u0430\u0432\u0438\u0441\u0438\u043c\u043e\u0441\u0442\u0438 \u043e\u0442 \u043d\u0430\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .font(.largeTitle)             .frame(maxWidth: .infinity)             .frame(height: 200)             .background(.blue)             .foregroundStyle(.white)             .clipShape(.rect(cornerRadius: 20))     } } .scrollTargetBehavior(.paging)<\/code><\/pre>\n<p>\u0417\u0434\u0435\u0441\u044c \u0441\u043e\u0437\u0434\u0430\u0435\u0442\u0441\u044f ScrollView, \u0441\u043e\u0434\u0435\u0440\u0436\u0430\u0449\u0438\u0439 50 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0442\u0438\u043f\u0430\u00a0<code>Text<\/code>, \u043a\u0430\u0436\u0434\u044b\u0439 \u0438\u0437 \u043a\u043e\u0442\u043e\u0440\u044b\u0445 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0435\u0442 \u043f\u043e\u043b\u043d\u0443\u044e \u0448\u0438\u0440\u0438\u043d\u0443 \u044d\u043a\u0440\u0430\u043d\u0430. \u0421 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u00a0<code>.scrollTargetBehavior(.paging)<\/code>\u00a0\u043e\u0431\u0435\u0441\u043f\u0435\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u0440\u043e\u0432\u043d\u043e \u043d\u0430 \u043e\u0434\u0438\u043d \u044d\u043a\u0440\u0430\u043d \u043f\u0440\u0438 \u043a\u0430\u0436\u0434\u043e\u043c \u0434\u0432\u0438\u0436\u0435\u043d\u0438\u0438:<\/p>\n<figure class=\"full-width\"><\/figure>\n<h4>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u043c\u0438 ScrollView<\/h4>\n<p>\u041a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u0432 SwiftUI \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043e\u0431\u0440\u0435\u0437\u0430\u0435\u0442 \u0441\u0432\u043e\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435, \u0447\u0442\u043e\u0431\u044b \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0432\u0441\u0435\u0433\u0434\u0430 \u043e\u0441\u0442\u0430\u0432\u0430\u043b\u0438\u0441\u044c \u043f\u043e\u043b\u043d\u043e\u0441\u0442\u044c\u044e \u0432\u043d\u0443\u0442\u0440\u0438 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0430. \u041e\u0434\u043d\u0430\u043a\u043e, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u00a0<code>scrollClipDisabled()<\/code>, \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u043e\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u0435 \u043c\u043e\u0436\u043d\u043e \u0438\u0437\u043c\u0435\u043d\u0438\u0442\u044c, \u043e\u0442\u043a\u043b\u044e\u0447\u0438\u0432 \u043e\u0431\u0440\u0435\u0437\u043a\u0443 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430.<\/p>\n<p><strong>\u0412\u0430\u0436\u043d\u043e<\/strong>: \u0418\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0435 \u043f\u043e\u0432\u0435\u0434\u0435\u043d\u0438\u044f \u043d\u0435 \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u043e\u0431\u0440\u0430\u0431\u043e\u0442\u043a\u0443 \u043a\u0430\u0441\u0430\u043d\u0438\u0439 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f, \u0442.\u0435. \u043e\u0431\u043b\u0430\u0441\u0442\u044c \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u043e\u0441\u0442\u0430\u0435\u0442\u0441\u044f \u0432 \u043f\u0440\u0435\u0434\u0435\u043b\u0430\u0445\u00a0<code>ScrollView<\/code>. \u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e, \u043a\u043e\u0433\u0434\u0430 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0430\u0445\u043e\u0434\u044f\u0442\u0441\u044f \u0432\u043d\u0443\u0442\u0440\u0438\u00a0<code>ScrollView<\/code>, \u0432\u0441\u0435 \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u043f\u043e \u044d\u0442\u0438\u043c \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c \u043e\u0431\u0440\u0430\u0431\u0430\u0442\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u043a\u0430\u043a \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043d\u0438\u043c\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432\u044b\u0445\u043e\u0434\u044f\u0442 \u0437\u0430 \u0433\u0440\u0430\u043d\u0438\u0446\u044b\u00a0<code>ScrollView<\/code>\u00a0\u0438\u0437-\u0437\u0430 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u044f\u00a0<code>scrollClipDisabled()<\/code>, \u043b\u044e\u0431\u044b\u0435 \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u043f\u043e &#171;\u0432\u044b\u043f\u0430\u0432\u0448\u0438\u043c&#187; \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c \u043d\u0435 \u0431\u0443\u0434\u0443\u0442 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u043d\u0438\u043c\u0438. \u0412\u043c\u0435\u0441\u0442\u043e \u044d\u0442\u043e\u0433\u043e, \u044d\u0442\u0438 \u043a\u0430\u0441\u0430\u043d\u0438\u044f \u0431\u0443\u0434\u0443\u0442 \u0440\u0435\u0433\u0438\u0441\u0442\u0440\u0438\u0440\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u043a\u0430\u043a \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0435 \u0441 \u0442\u0435\u043c, \u0447\u0442\u043e \u043d\u0430\u0445\u043e\u0434\u0438\u0442\u0441\u044f \u043f\u043e\u0434 \u044d\u0442\u0438\u043c\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u0430\u043c\u0438.<\/p>\n<p>\u041f\u043e\u044d\u0442\u043e\u043c\u0443, \u0445\u043e\u0442\u044f\u00a0<code>scrollClipDisabled()<\/code>\u00a0\u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u043f\u043e\u043b\u0435\u0437\u043d\u044b\u043c \u0434\u043b\u044f \u0441\u043e\u0437\u0434\u0430\u043d\u0438\u044f \u0432\u0438\u0437\u0443\u0430\u043b\u044c\u043d\u044b\u0445 \u044d\u0444\u0444\u0435\u043a\u0442\u043e\u0432, \u0442\u0430\u043a\u0438\u0445 \u043a\u0430\u043a \u0442\u0435\u043d\u0438, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u044b\u0445\u043e\u0434\u044f\u0442 \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0435\u0433\u043e \u0441\u0442\u043e\u0438\u0442 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u0441 \u043e\u0441\u0442\u043e\u0440\u043e\u0436\u043d\u043e\u0441\u0442\u044c\u044e, \u0447\u0442\u043e\u0431\u044b \u043d\u0435 \u0441\u043e\u0437\u0434\u0430\u0432\u0430\u0442\u044c \u043f\u0440\u043e\u0431\u043b\u0435\u043c \u0441 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u043e\u043c \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f. \u0412 \u0447\u0430\u0441\u0442\u043d\u043e\u0441\u0442\u0438, \u0435\u0441\u043b\u0438 \u043a\u0440\u0438\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u0432\u0430\u0436\u043d\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0443\u043f\u0440\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043e\u043a\u0430\u0437\u044b\u0432\u0430\u044e\u0442\u0441\u044f \u0432\u043d\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0438 \u0441\u0442\u0430\u043d\u043e\u0432\u044f\u0442\u0441\u044f \u043d\u0435\u0440\u0430\u0431\u043e\u0442\u043e\u0441\u043f\u043e\u0441\u043e\u0431\u043d\u044b\u043c\u0438, \u044d\u0442\u043e \u043c\u043e\u0436\u0435\u0442 \u043f\u0440\u0438\u0432\u0435\u0441\u0442\u0438 \u043a \u043f\u0440\u043e\u0431\u043b\u0435\u043c\u0430\u043c \u0441 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u043c \u043e\u043f\u044b\u0442\u043e\u043c.<\/p>\n<p>\u0414\u0430\u0432\u0430\u0439\u0442\u0435 \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c c\u00a0<code>VStack<\/code>, \u0432 \u043a\u043e\u0442\u043e\u0440\u043e\u043c \u0441\u0432\u0435\u0440\u0445\u0443 \u0438 \u0441\u043d\u0438\u0437\u0443 \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u044b \u0441\u0442\u0430\u0442\u0438\u0447\u043d\u044b\u0435 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0430 \u043c\u0435\u0436\u0434\u0443 \u043d\u0438\u043c\u0438 &#8212; \u043e\u0431\u043b\u0430\u0441\u0442\u044c \u0441 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u043e\u0439. \u041f\u0440\u0438 \u043d\u0430\u0447\u0430\u043b\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u044d\u0442\u043e\u0439 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0443\u0434\u0443\u0442 \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0442\u044c\u0441\u044f \u043f\u0440\u044f\u043c\u043e \u043f\u043e\u0434 \u0432\u0435\u0440\u0445\u043d\u0438\u043c \u0442\u0435\u043a\u0441\u0442\u043e\u043c, \u043d\u043e \u0432 \u043f\u0440\u043e\u0446\u0435\u0441\u0441\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043e\u043d\u0438 \u0441\u043c\u043e\u0433\u0443\u0442 \u0432\u044b\u0445\u043e\u0434\u0438\u0442\u044c \u0437\u0430 \u0435\u0433\u043e \u0433\u0440\u0430\u043d\u0438\u0446\u044b:<\/p>\n<pre><code class=\"swift\">VStack {     Text(\"Fixed at the top\")         .frame(maxWidth: .infinity)         .frame(height: 100)         .background(.green)         .foregroundStyle(.white)      ScrollView {         ForEach(0..&lt;5) { _ in             Text(\"Scrolling\")                 .frame(maxWidth: .infinity)                 .frame(height: 200)                 .background(.blue)                 .foregroundStyle(.white)         }     }     .scrollClipDisabled()      Text(\"Fixed at the bottom\")         .frame(maxWidth: .infinity)         .frame(height: 100)         .background(.green)         .foregroundStyle(.white) }<\/code><\/pre>\n<figure class=\"full-width\"><\/figure>\n<p>\u041f\u0440\u0438 \u0440\u0430\u0431\u043e\u0442\u0435 \u0441 \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u043c <code>scrollClipDisabled()<\/code> \u0432\u0430\u0436\u043d\u043e \u043f\u043e\u043c\u043d\u0438\u0442\u044c \u043e \u0434\u0432\u0443\u0445 \u0432\u0435\u0449\u0430\u0445:<\/p>\n<ol>\n<li>\n<p>\u0412\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0437\u0430\u0434\u0430\u0442\u044c \u0441\u0432\u043e\u044e \u0444\u043e\u0440\u043c\u0443 \u043e\u0431\u0440\u0435\u0437\u043a\u0438, \u0447\u0442\u043e\u0431\u044b \u043a\u043e\u043d\u0442\u0440\u043e\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c, \u043d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0434\u0430\u043b\u0435\u043a\u043e \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0431\u0443\u0434\u0443\u0442 \u0432\u044b\u0445\u043e\u0434\u0438\u0442\u044c \u0437\u0430 \u0433\u0440\u0430\u043d\u0438\u0446\u044b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u043f\u043e\u0441\u043b\u0435 \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u044f \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 <code>padding()<\/code> \u0432\u044b \u0434\u043e\u0431\u0430\u0432\u0438\u0442\u0435 \u0444\u043e\u0440\u043c\u0443 \u043e\u0431\u0440\u0435\u0437\u043a\u0438 \u0432 \u0432\u0438\u0434\u0435 \u043f\u0440\u044f\u043c\u043e\u0443\u0433\u043e\u043b\u044c\u043d\u0438\u043a\u0430 <code>clipShape(.rect)<\/code>, \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043d\u0435 \u0431\u0443\u0434\u0443\u0442 &#171;\u0432\u044b\u043f\u0430\u0434\u0430\u0442\u044c&#187; \u0437\u0430 \u043f\u0440\u0435\u0434\u0435\u043b\u044b \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u0431\u0435\u0441\u043a\u043e\u043d\u0435\u0447\u043d\u043e.<\/p>\n<\/li>\n<li>\n<p>\u041f\u043e\u0441\u043a\u043e\u043b\u044c\u043a\u0443 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0442\u0435\u043f\u0435\u0440\u044c \u043c\u043e\u0433\u0443\u0442 \u043f\u0435\u0440\u0435\u043a\u0440\u044b\u0432\u0430\u0442\u044c \u043e\u043a\u0440\u0443\u0436\u0430\u044e\u0449\u0438\u0435 \u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b, \u0432\u0430\u043c \u043c\u043e\u0436\u0435\u0442 \u043f\u043e\u0442\u0440\u0435\u0431\u043e\u0432\u0430\u0442\u044c\u0441\u044f \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>zIndex()<\/code> \u0434\u043b\u044f \u043a\u043e\u0440\u0440\u0435\u043a\u0442\u0438\u0440\u043e\u0432\u043a\u0438 \u0438\u0445 \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e\u0433\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u044f. \u041d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u0443 \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u0441\u0442\u0430\u043d\u0434\u0430\u0440\u0442\u043d\u044b\u0439 Z-\u0438\u043d\u0434\u0435\u043a\u0441, \u0442\u043e \u043f\u0440\u0438\u043c\u0435\u043d\u0435\u043d\u0438\u0435 <code>zIndex(1)<\/code> \u043a ScrollView \u0437\u0430\u0441\u0442\u0430\u0432\u0438\u0442 \u0435\u0433\u043e \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u043e\u0442\u0440\u0438\u0441\u043e\u0432\u044b\u0432\u0430\u0442\u044c\u0441\u044f \u043f\u043e\u0432\u0435\u0440\u0445 \u0434\u0440\u0443\u0433\u0438\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432.<\/p>\n<\/li>\n<\/ol>\n<h4>\u041e\u0442\u043e\u0431\u0440\u0430\u0436\u0435\u043d\u0438\u0435 \u043a\u043e\u043d\u0442\u0435\u043d\u0442\u0430 \u0432 ScrollView \u0441 \u043a\u043e\u043d\u0446\u0430<\/h4>\n<p>\u0412 SwiftUI \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u0430\u0432\u0442\u043e\u043c\u0430\u0442\u0438\u0447\u0435\u0441\u043a\u0438 \u043d\u0430\u0447\u0438\u043d\u0430\u0435\u0442 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0443 \u0441\u0432\u0435\u0440\u0445\u0443. \u041e\u0434\u043d\u0430\u043a\u043e \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435 \u0441\u043e\u0437\u0434\u0430\u0442\u044c \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441, \u0430\u043d\u0430\u043b\u043e\u0433\u0438\u0447\u043d\u044b\u0439 \u043f\u0440\u0438\u043b\u043e\u0436\u0435\u043d\u0438\u044e &#171;\u0421\u043e\u043e\u0431\u0449\u0435\u043d\u0438\u044f&#187; \u043e\u0442 Apple, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c ScrollView \u0442\u0430\u043a, \u0447\u0442\u043e\u0431\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u043d\u0430\u0447\u0438\u043d\u0430\u043b\u0430\u0441\u044c \u0441\u043d\u0438\u0437\u0443. \u0414\u043b\u044f \u044d\u0442\u043e\u0433\u043e \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u0443\u0435\u0442\u0441\u044f \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollPosition()<\/code> \u0441 \u043d\u0430\u0447\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0440\u0438\u0432\u044f\u0437\u043a\u043e\u0439 \u043a \u043d\u0438\u0436\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438 (<code>.bottom<\/code>).<\/p>\n<p>\u041d\u0438\u0436\u0435 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d \u043f\u0440\u0438\u043c\u0435\u0440, \u0433\u0434\u0435 \u0432 ScrollView \u043f\u043e\u043a\u0430\u0437\u0430\u043d\u044b 50 \u0442\u0435\u043a\u0441\u0442\u043e\u0432\u044b\u0445 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u043e\u0432. \u0417\u0434\u0435\u0441\u044c \u0443\u043a\u0430\u0437\u0430\u043d\u043e, \u0447\u0442\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u0434\u043e\u043b\u0436\u043d\u0430 \u043d\u0430\u0447\u0438\u043d\u0430\u0442\u044c\u0441\u044f \u0441\u043d\u0438\u0437\u0443, \u0430 \u043d\u0435 \u0441\u0432\u0435\u0440\u0445\u0443:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)             .padding()             .background(.blue)             .clipShape(.rect(cornerRadius: 25))     } } .scrollPosition(initialAnchor: .bottom)<\/code><\/pre>\n<figure class=\"full-width\"><\/figure>\n<p>\u0415\u0441\u043b\u0438 \u0432\u0430\u0448 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c\u0441\u043a\u0438\u0439 \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441 \u043a\u0430\u043a\u0438\u043c-\u0442\u043e \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0438\u0437\u043c\u0435\u043d\u044f\u0435\u0442\u0441\u044f \u0431\u0435\u0437 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f &#8212; \u043d\u0430\u043f\u0440\u0438\u043c\u0435\u0440, \u0435\u0441\u043b\u0438 \u043f\u043e\u044f\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043a\u043b\u0430\u0432\u0438\u0430\u0442\u0443\u0440\u0430 \u0438\u043b\u0438 \u0432\u044b \u043c\u0435\u043d\u044f\u0435\u0442\u0435 \u0440\u0430\u0437\u043c\u0435\u0440 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0442\u043e \u043f\u043e\u0437\u0438\u0446\u0438\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043e\u0441\u0442\u0430\u043d\u0435\u0442\u0441\u044f \u043f\u0440\u0438\u043a\u0440\u0435\u043f\u043b\u0435\u043d\u043d\u043e\u0439 \u043a \u043d\u0438\u0436\u043d\u0435\u0439 \u0447\u0430\u0441\u0442\u0438. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044c \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e \u043c\u0435\u043d\u044f\u0435\u0442 \u043f\u043e\u0437\u0438\u0446\u0438\u044e \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u043e\u043d\u0430 \u0431\u0443\u0434\u0435\u0442 \u0441\u0432\u043e\u0431\u043e\u0434\u043d\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f, \u043a\u0430\u043a \u043e\u0431\u044b\u0447\u043d\u043e.<\/p>\n<p><strong>\u0421\u043e\u0432\u0435\u0442<\/strong>: \u043f\u0430\u0440\u0430\u043c\u0435\u0442\u0440 <code>initialAnchor<\/code> \u043f\u0440\u0438\u043d\u0438\u043c\u0430\u0435\u0442 \u043b\u044e\u0431\u0443\u044e \u0442\u043e\u0447\u043a\u0443 \u0442\u0438\u043f\u0430 <code>UnitPoint<\/code>, \u043f\u043e\u044d\u0442\u043e\u043c\u0443 \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u044c <code>.trailing<\/code> \u0434\u043b\u044f \u043d\u0430\u0447\u0430\u043b\u0430 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e\u0439 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0441 \u043f\u0440\u0430\u0432\u043e\u0433\u043e \u043a\u0440\u0430\u044f \u0438\u043b\u0438 \u043b\u044e\u0431\u043e\u0435 \u0442\u043e\u0447\u043d\u043e\u0435 \u0437\u043d\u0430\u0447\u0435\u043d\u0438\u0435, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u043e \u0434\u043b\u044f \u0432\u0430\u0448\u0435\u0433\u043e \u0438\u043d\u0442\u0435\u0440\u0444\u0435\u0439\u0441\u0430.<\/p>\n<h4>\u0423\u0441\u0442\u0430\u043d\u043e\u0432\u043a\u0430 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0438\u043b\u0438 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0432 ScrollView<\/h4>\n<p>\u041f\u043e \u0443\u043c\u043e\u043b\u0447\u0430\u043d\u0438\u044e \u043a\u043e\u043c\u043f\u043e\u043d\u0435\u043d\u0442 ScrollView \u0432 SwiftUI \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u0432\u043e\u0435\u043c\u0443 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u043c\u0443 \u0437\u0430\u043f\u043e\u043b\u043d\u044f\u0442\u044c \u0432\u0441\u0435 \u0434\u043e\u0441\u0442\u0443\u043f\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e, \u0430 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u044b \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u0430\u043a\u043a\u0443\u0440\u0430\u0442\u043d\u043e \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u044e\u0442\u0441\u044f \u043d\u0430 \u043a\u0440\u0430\u044e \u044d\u043a\u0440\u0430\u043d\u0430. \u041e\u0434\u043d\u0430\u043a\u043e, \u0441 \u043f\u043e\u043c\u043e\u0449\u044c\u044e \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440\u0430\u00a0<code>contentMargins()<\/code>\u00a0\u043c\u043e\u0436\u043d\u043e \u0443\u0441\u0442\u0430\u043d\u043e\u0432\u0438\u0442\u044c \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0438\u043b\u0438 \u043f\u043e\u043b\u043e\u0441 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 &#8212; \u043d\u0430\u0441\u043a\u043e\u043b\u044c\u043a\u043e \u0443\u0433\u043e\u0434\u043d\u043e \u0431\u043e\u043b\u044c\u0448\u0438\u0435 \u0438 \u043f\u043e \u043b\u044e\u0431\u044b\u043c \u043a\u0440\u0430\u044f\u043c.<\/p>\n<p>\u0412 \u043a\u0430\u0447\u0435\u0441\u0442\u0432\u0435 \u043f\u0440\u0438\u043c\u0435\u0440\u0430, \u0440\u0430\u0441\u0441\u043c\u043e\u0442\u0440\u0438\u043c \u043a\u043e\u0434, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u0432\u043d\u043e\u0441\u0438\u0442 \u043e\u0442\u0441\u0442\u0443\u043f \u0432 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 \u043d\u0430 50 \u043f\u043e\u0438\u043d\u0442\u043e\u0432 \u0441 \u043a\u0430\u0436\u0434\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u043d\u0435 \u043c\u0435\u043d\u044f\u044f \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)             .foregroundStyle(.white)             .background(.blue)     } } .contentMargins(50, for: .scrollContent)<\/code><\/pre>\n<figure class=\"full-width\"><\/figure>\n<p>\u0422\u0430\u043a\u0438\u043c \u0436\u0435 \u043e\u0431\u0440\u0430\u0437\u043e\u043c \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043e\u0442\u0440\u0435\u0433\u0443\u043b\u0438\u0440\u043e\u0432\u0430\u0442\u044c \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u0443 \u043e\u0442\u0441\u0442\u0443\u043f\u0430 \u0434\u043b\u044f \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u043e\u0432 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 ScrollView, \u043b\u0438\u0431\u043e \u0441\u0430\u043c\u043e\u0441\u0442\u043e\u044f\u0442\u0435\u043b\u044c\u043d\u043e, \u043b\u0438\u0431\u043e \u0432\u043c\u0435\u0441\u0442\u0435 \u0441 \u0440\u0435\u0433\u0443\u043b\u0438\u0440\u043e\u0432\u043a\u043e\u0439 \u0432\u0435\u043b\u0438\u0447\u0438\u043d\u044b \u043e\u0442\u0441\u0442\u0443\u043f\u0430 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e.<\/p>\n<p>\u041a\u0430\u043a \u0438 \u0440\u0430\u043d\u0435\u0435, \u0432\u044b \u043c\u043e\u0436\u0435\u0442\u0435 \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0432\u0441\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u0441\u0440\u0430\u0437\u0443 \u0438\u043b\u0438 \u0432\u044b\u0431\u0440\u0430\u0442\u044c \u0442\u043e\u043b\u044c\u043a\u043e \u0442\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0435 \u0432\u0430\u043c \u043d\u0443\u0436\u043d\u044b. \u0422\u0430\u043a, \u0432 \u0441\u043b\u0435\u0434\u0443\u044e\u0449\u0435\u043c \u043f\u0440\u0438\u043c\u0435\u0440\u0435 \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u043e\u0442\u0441\u0442\u0443\u043f \u0432 100 \u043f\u043e\u0438\u043d\u0442\u043e\u0432 \u0441\u0432\u0435\u0440\u0445\u0443 \u0434\u043b\u044f \u0438\u043d\u0434\u0438\u043a\u0430\u0442\u043e\u0440\u0430 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a \u043e\u0441\u0442\u0430\u043b\u044c\u043d\u044b\u0435 \u0441\u0442\u043e\u0440\u043e\u043d\u044b \u043e\u0441\u0442\u0430\u044e\u0442\u0441\u044f \u0431\u0435\u0437 \u0438\u0437\u043c\u0435\u043d\u0435\u043d\u0438\u0439:<\/p>\n<pre><code class=\"swift\">ScrollView {     ForEach(0..&lt;50) { index in         Text(\"Item \\(index)\")             .frame(maxWidth: .infinity)             .background(.blue)             .foregroundStyle(.white)     } } .contentMargins(.top, 100, for: .scrollIndicators) <\/code><\/pre>\n<p>\u0418\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e (content margins) \u0432\u043c\u0435\u0441\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u043e\u0433\u043e padding (\u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0438\u0439 \u043e\u0442\u0441\u0442\u0443\u043f) \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0432\u0430\u0448\u0435\u043c\u0443 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u043c\u0443 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f \u043e\u0442 \u043a\u0440\u0430\u044f \u0434\u043e \u043a\u0440\u0430\u044f \u043f\u0440\u0438 \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u0438 \u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u0442\u0435\u043b\u044f \u0441 \u043d\u0438\u043c, \u043f\u0440\u0438 \u044d\u0442\u043e\u043c \u0434\u043e\u0431\u0430\u0432\u043b\u044f\u044f \u043d\u0435\u043c\u043d\u043e\u0433\u043e \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0433\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0430 \u0434\u043b\u044f \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438 &#8212; \u044d\u0442\u043e \u0433\u043e\u0440\u0430\u0437\u0434\u043e \u0431\u043e\u043b\u0435\u0435 \u0443\u0434\u0430\u0447\u043d\u0430\u044f \u043e\u043f\u0446\u0438\u044f, \u0447\u0435\u043c \u043f\u0440\u043e\u0441\u0442\u043e\u0439 padding.<\/p>\n<p>\u0412 \u043a\u043e\u043d\u0442\u0435\u043a\u0441\u0442\u0435 SwiftUI, padding \u043e\u0442\u043d\u043e\u0441\u0438\u0442\u0441\u044f \u043a \u0432\u043d\u0443\u0442\u0440\u0435\u043d\u043d\u0435\u043c\u0443 \u043e\u0442\u0441\u0442\u0443\u043f\u0443 \u0432\u043e\u043a\u0440\u0443\u0433 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f, \u0447\u0442\u043e \u0432\u043b\u0438\u044f\u0435\u0442 \u043d\u0430 \u0435\u0433\u043e \u0440\u0430\u0437\u043c\u0435\u0440 \u0438 \u043f\u043e\u043b\u043e\u0436\u0435\u043d\u0438\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u0435\u0433\u043e \u0440\u043e\u0434\u0438\u0442\u0435\u043b\u044c\u0441\u043a\u043e\u0433\u043e \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f. \u0421 \u0434\u0440\u0443\u0433\u043e\u0439 \u0441\u0442\u043e\u0440\u043e\u043d\u044b, \u043e\u0442\u0441\u0442\u0443\u043f\u044b \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u0438\u043b\u0438 content margins \u043e\u0442\u043d\u043e\u0441\u044f\u0442\u0441\u044f \u043a \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u0443, \u043a\u043e\u0442\u043e\u0440\u043e\u0435 \u043e\u0441\u0442\u0430\u0432\u043b\u044f\u0435\u0442\u0441\u044f \u0432\u043e\u043a\u0440\u0443\u0433 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043e\u0431\u043b\u0430\u0441\u0442\u0438 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0438. \u042d\u0442\u043e \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u043f\u043e\u0437\u0432\u043e\u043b\u044f\u0435\u0442 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u043c\u0443 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0442\u044c\u0441\u044f &#171;\u043e\u0442 \u043a\u0440\u0430\u044f \u0434\u043e \u043a\u0440\u0430\u044f&#187;, \u0434\u0430\u0432\u0430\u044f \u0434\u043e\u043f\u043e\u043b\u043d\u0438\u0442\u0435\u043b\u044c\u043d\u043e\u0435 \u043f\u0440\u043e\u0441\u0442\u0440\u0430\u043d\u0441\u0442\u0432\u043e \u0434\u043b\u044f \u0432\u0437\u0430\u0438\u043c\u043e\u0434\u0435\u0439\u0441\u0442\u0432\u0438\u044f \u0441 \u043f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u043e\u0439.<\/p>\n<p>\u0422\u0430\u043a\u0438\u043c \u043e\u0431\u0440\u0430\u0437\u043e\u043c, \u0438\u0441\u043f\u043e\u043b\u044c\u0437\u043e\u0432\u0430\u043d\u0438\u0435 \u043e\u0442\u0441\u0442\u0443\u043f\u043e\u0432 \u0434\u043b\u044f \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0433\u043e \u043c\u043e\u0436\u0435\u0442 \u0431\u044b\u0442\u044c \u0431\u043e\u043b\u0435\u0435 \u043f\u0440\u0435\u0434\u043f\u043e\u0447\u0442\u0438\u0442\u0435\u043b\u044c\u043d\u044b\u043c, \u0435\u0441\u043b\u0438 \u0432\u044b \u0445\u043e\u0442\u0438\u0442\u0435, \u0447\u0442\u043e\u0431\u044b \u0432\u0430\u0448\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u043b\u043e\u0441\u044c \u0437\u0430 \u043a\u0440\u0430\u044f \u044d\u043a\u0440\u0430\u043d\u0430, \u0432 \u0442\u043e \u0432\u0440\u0435\u043c\u044f \u043a\u0430\u043a \u043f\u0440\u043e\u0441\u0442\u043e\u0439 padding \u043e\u0433\u0440\u0430\u043d\u0438\u0447\u0438\u0442 \u0432\u0430\u0448\u0435 \u0441\u043e\u0434\u0435\u0440\u0436\u0438\u043c\u043e\u0435 \u0432\u043d\u0443\u0442\u0440\u0438 \u0437\u0430\u0434\u0430\u043d\u043d\u044b\u0445 \u0433\u0440\u0430\u043d\u0438\u0446.<\/p>\n<h4>\u041f\u0440\u043e\u043a\u0440\u0443\u0442\u043a\u0430 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u0439 \u0441 \u043a\u0430\u0441\u0442\u043e\u043c\u043d\u044b\u043c \u043f\u0435\u0440\u0435\u0445\u043e\u0434\u043e\u043c<\/h4>\n<p>\u0412 SwiftUI <code>ScrollView<\/code> \u0440\u0430\u0441\u043f\u043e\u043b\u0430\u0433\u0430\u0435\u0442 \u0432\u0441\u0435 \u0441\u0432\u043e\u0438 \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u0435 \u044d\u043b\u0435\u043c\u0435\u043d\u0442\u044b \u0432 \u043a\u043e\u043d\u0442\u0435\u0439\u043d\u0435\u0440\u0435, \u043a\u043e\u0442\u043e\u0440\u044b\u0439 \u043f\u043b\u0430\u0432\u043d\u043e \u043f\u0440\u043e\u043a\u0440\u0443\u0447\u0438\u0432\u0430\u0435\u0442\u0441\u044f \u0432\u0435\u0440\u0442\u0438\u043a\u0430\u043b\u044c\u043d\u043e \u0438\u043b\u0438 \u0433\u043e\u0440\u0438\u0437\u043e\u043d\u0442\u0430\u043b\u044c\u043d\u043e. \u041e\u0434\u043d\u0430\u043a\u043e, \u0435\u0441\u043b\u0438 \u043c\u044b \u043f\u0440\u0438\u043c\u0435\u043d\u0438\u043c \u043a \u0434\u043e\u0447\u0435\u0440\u043d\u0438\u043c \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f\u043c \u043c\u043e\u0434\u0438\u0444\u0438\u043a\u0430\u0442\u043e\u0440 <code>scrollTransition()<\/code>, \u0442\u043e \u0441\u043c\u043e\u0436\u0435\u043c \u043d\u0430\u0441\u0442\u0440\u043e\u0438\u0442\u044c \u0441\u043f\u043e\u0441\u043e\u0431, \u043a\u043e\u0442\u043e\u0440\u044b\u043c \u044d\u0442\u0438 \u043f\u0440\u0435\u0434\u0441\u0442\u0430\u0432\u043b\u0435\u043d\u0438\u044f \u043f\u043e\u044f\u0432\u043b\u044f\u044e\u0442\u0441\u044f \u043d\u0430 \u044d\u043a\u0440\u0430\u043d\u0435 \u0438 \u0438\u0441\u0447\u0435\u0437\u0430\u044e\u0442 \u0441 \u043d\u0435\u0433\u043e.<\/p>\n<p>\u042d\u0442\u043e\u0442<\/p>\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-350354","post","type-post","status-publish","format-standard","hentry"],"_links":{"self":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/350354","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=350354"}],"version-history":[{"count":0,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=\/wp\/v2\/posts\/350354\/revisions"}],"wp:attachment":[{"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=350354"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcategories&post=350354"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/savepearlharbor.com\/index.php?rest_route=%2Fwp%2Fv2%2Ftags&post=350354"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}