In iOS 16, SwiftUI comes with a brand new view referred to as ShareLink. When customers faucet on the share hyperlink, it presents a share sheet for customers to share content material to different purposes or copy the information for later use.
The ShareLink view is designed to share any varieties of knowledge. On this tutorial, we are going to present you the right way to use ShareLink to let customers share textual content, URL, and pictures.
Primary Utilization of ShareLink
Let’s start with an instance. To create a share hyperlink for sharing a URL, you’ll be able to write the code like this:
|
struct ContentView: View { Â Â Â Â personal let url = URL(string: “https://www.appcoda.com”)! Â Â Â Â Â var physique: some View { Â Â Â Â Â Â Â Â VStack { Â Â Â Â Â Â Â Â Â Â Â Â ShareLink(merchandise: url) Â Â Â Â Â Â Â Â } Â Â Â Â } } |
SwiftUI robotically renders a Share button with a small icon.
When tapped, iOS brings up a share sheet for customers to carry out additional actions akin to copy and including the hyperlink to Reminders.
To share textual content, as a substitute of URL, you’ll be able to merely go the a string to the merchandise parameter.
|
ShareLink(merchandise: “Try this new characteristic on iOS 16”) |
Customizing the Look of Share Hyperlink
To customise the looks of the hyperlink, you’ll be able to present the view content material within the closure like this:
|
ShareLink(merchandise: url) { Â Â Â Â Picture(systemName: “sq..and.arrow.up”) } |
On this case, SwiftUI solely shows the share icon for the hyperlink.
Alternatively, you’ll be able to current a label with a system picture or customized picture:
|
ShareLink(merchandise: url) { Â Â Â Â Label(“Faucet me to share”, systemImage:Â Â “sq..and.arrow.up”) } |
When initializing the ShareLink occasion, you’ll be able to embrace two further parameters to offer further details about the shared merchandise:
|
ShareLink(merchandise: url, topic: Textual content(“Try this hyperlink”), message: Textual content(“If you wish to be taught Swift, check out this web site.”)) { Â Â Â Â Picture(systemName: “sq..and.arrow.up”) } |
The topic parameter enables you to embrace a title concerning the URL or any merchandise to share. The message parameter permits you to specify the outline of the merchandise. Relying on the actions the person shares to, iOS will current the topic or message or each. Say, in case you add the URL to Reminders, the Reminders app shows the preset message.
Sharing Photos
Aside from URLs, you’ll be able to share photographs utilizing ShareLink. Here’s a pattern code snippet:
|
struct ContentView: View {     personal let picture = Picture(“bigben”)      var physique: some View {         VStack(alignment: .main, spacing: 10) {             picture                 .resizable()                 .scaledToFit()              ShareLink(merchandise: picture, preview: SharePreview(“Large Ben”, picture: picture))          }         .padding(.horizontal)     } } |
For the merchandise parameter, you specify the picture to share. And, you present a preview of the picture by passing an occasion of SharePreview. Within the preview, you specify the title of the picture and the thumbnail. Once you faucet the Share button, iOS brings up a share sheet with the picture preview.
Conforming to Transferable
Aside from URLs, the merchandise parameter accepts any objects that conforms to the Transferable protocol. In iOS, the next varieties are the usual Transferable varieties:
- String
- Information
- URL
- Attributed String
- Picture
Transferable is a protocol that describes how a sort interacts with transport APIs akin to drag and drop or copy and paste.
So what you probably have a customized object, how are you going to make it transferable? Let’s say, you create the next Photograph construction:
|
struct Photograph: Identifiable {     var id = UUID()     var picture: Picture     var caption: String     var description: String } |
To let ShareLink share this object, it’s a must to undertake the Transferable protocol for Photograph and implement the transferRepresentation property:
|
extension Photograph: Transferable { Â Â Â Â static var transferRepresentation: some TransferRepresentation { Â Â Â Â Â Â Â Â ProxyRepresentation(exporting: .picture) Â Â Â Â } } |
There are a selection of Switch Representations together with ProxyRepresentation, CodableRepresentation, DataRepresentation, and FileRepresentation. Within the code above, we use the ProxyRepresentation which is a switch illustration that makes use of one other kind’s switch illustration as its personal. Right here, we use the Picture‘s built-in Transferable conformance.
Since Photograph now conforms to Transferable, you’ll be able to go the Photograph occasion to ShareLink:
|
ShareLink(merchandise: picture, preview: SharePreview(picture.caption, picture: picture.picture)) |
When customers faucet the Share button, the app brings up the share sheet for sharing the picture.
What’s Subsequent
This tutorial reveals you the right way to use ShareLink for sharing textual content, URL, and pictures. The truth is, this new view permits you to share any varieties of knowledge so long as the sort conforms to the Transferable protocol.
For customized varieties, you undertake the protocol and supply a switch illustration by utilizing one of many built-in TransferRepresentation varieties. We briefly focus on the ProxyRepresentation kind. If it is advisable to share a file between purposes, you should use the FileRepresentation kind. In later tutorials, we are going to focus on extra on that.
