A Link is a control in SwiftUI which enables you to navigate to a URL by opening Safari and loading desired website. It looks just like a standard button. In order to properly use a Link, you need to define it with a text label and a destination URL. Links can be styled by changing the font and color of the text label. This tutorial will show you how to achieve all of that.
In its simplest form, a Link can be created like this:
Link("SwiftUI Tutorials", destination: URL(string: "https://www.simpleswiftguide.com")!)The result should look like this:
Customize Link
A SwiftUI Link using text as a label can be customized with a custom font and color. Here is an example customizing both with large title font and red color for the text:
Link("SwiftUI Tutorials", destination: URL(string: "https://www.simpleswiftguide.com")!)
.font(.largeTitle)
.foregroundColor(.red)The result looks like this:
You can also set a desired size of the font like this:
Link("SwiftUI Tutorials", destination: URL(string: "https://www.simpleswiftguide.com")!)
.font(.system(size: 44.0))Create SwiftUI Link using custom view
A link can also be created using a custom view closure for more flexibility and control over its appearance.
For example, a link can be created using just an SF Symbol:
Link(destination: URL(string: "https://www.simpleswiftguide.com")!) {
Image(systemName: "paperplane")
.font(.largeTitle)
}A Link can also be made of a VStack with an image and text stacked up:
Link(destination: URL(string: "https://www.simpleswiftguide.com")!) {
VStack {
Image(systemName: "paperplane")
.font(.largeTitle)
Text("Let's go!")
}
}The result should look like this:
Take a look at Apple’s official SwiftUI Link documentation.
Related tutorials:
- SwiftUI Label tutorial – how to create and use Label in SwiftUI
- SwiftUI Form tutorial – how to create and use Form in SwiftUI
- How to create a Button in SwiftUI