{"id":7996,"date":"2020-03-15T19:24:19","date_gmt":"2020-03-15T19:24:19","guid":{"rendered":"http:\/\/putridparrot.com\/blog\/?p=7996"},"modified":"2020-03-17T15:43:13","modified_gmt":"2020-03-17T15:43:13","slug":"swift-ui-circle-image","status":"publish","type":"post","link":"https:\/\/putridparrot.com\/blog\/swift-ui-circle-image\/","title":{"rendered":"Swift UI Circle Image"},"content":{"rendered":"<p>Here&#8217;s a simple circle image using SwiftUI. This is pretty much taken from the <a href=\"https:\/\/developer.apple.com\/tutorials\/swiftui\" rel=\"noopener noreferrer\" target=\"_blank\">SwiftUI Tutorial<\/a> with a few additions.<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nstruct CircleImage: View {\r\n    var image: Image\r\n    var borderColor: Color = .white\r\n    var shadowRadius: CGFloat = 10\r\n\r\n    var body: some View {\r\n        image\r\n            .clipShape(Circle())\r\n            .overlay(Circle().stroke(borderColor, lineWidth: 4))\r\n            .shadow(radius: shadowRadius)\r\n    }\r\n}\r\n<\/pre>\n<p>In this case we pass and image to the CircleImage, clipping it into a circle shape. Then we display a line (in white by default) around it with a shadow (with radius 10 by default).<\/p>\n<p>We simply clip the supplied image, i.e.<\/p>\n<pre class=\"brush: java; title: ; notranslate\" title=\"\">\r\nCircleImage(image: Image(&quot;imageFrom.Assets.xcassets&quot;), \r\n   borderColor: .red, \r\n   shadowRadius: 5)\r\n<\/pre>\n<p>The image should be stored within the Assets.xcassets editor.<\/p>\n","protected":false},"excerpt":{"rendered":"<p>Here&#8217;s a simple circle image using SwiftUI. This is pretty much taken from the SwiftUI Tutorial with a few additions. struct CircleImage: View { var image: Image var borderColor: Color = .white var shadowRadius: CGFloat = 10 var body: some View { image .clipShape(Circle()) .overlay(Circle().stroke(borderColor, lineWidth: 4)) .shadow(radius: shadowRadius) } } In this case we [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"_jetpack_memberships_contains_paid_content":false,"footnotes":""},"categories":[286,287],"tags":[],"class_list":["post-7996","post","type-post","status-publish","format-standard","hentry","category-swift","category-swiftui"],"jetpack_sharing_enabled":true,"jetpack_featured_media_url":"","_links":{"self":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts\/7996","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/comments?post=7996"}],"version-history":[{"count":3,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts\/7996\/revisions"}],"predecessor-version":[{"id":8001,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/posts\/7996\/revisions\/8001"}],"wp:attachment":[{"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/media?parent=7996"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/categories?post=7996"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/putridparrot.com\/blog\/wp-json\/wp\/v2\/tags?post=7996"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}