I\'ve got a basic view with a button using SwiftUI and I\'m trying to present a new screen/view when the button is tapped. How do I do this? Am I suppose to create a delegat
The OP has been answered multiple times here but I just wanted to also demonstrate the cool aspects of SwiftUI by showing if you have view A with data that view B will also be using, you can pass data by creating a @State in view A and declaring the same variable with @Binding declaration in view B
struct ViewA : View {
@State var myItems: [Items]
var body: some View {
NavigationView {
VStack {
NavigationButton(destination: ViewB(items: $myItems)) {
Text("Go To ViewB")
}
}
}
}
}
struct ViewB : View {
@Binding var myItems: [Items]
var body: some View {
NavigationView {
List{
ForEach(myItems.identified(by: \.self)) {
Text($0.itemName)
}
}.navigationBarTitle(Text("My Items"))
}
}
}
The key is to use a NavigationView and a NavigationLink:
import SwiftUI
struct ContentView : View {
var body: some View {
NavigationView {
VStack {
Text("Hello World")
NavigationLink(destination: DetailView()) {
Text("Do Something")
}
}
}
}
}
SwiftUI 2.0 Updated Code
var body: some View {
NavigationView {
navigationTitle("Me")
Text("Hello, world!")
.padding()
NavigationLink(
destination: DetailView(),
label: {
Text("Navigate")
})
}
}
I made a ViewModifier
for this. It also means that there is no navigation bar. You can call it like so:
.navigate(to: MainPageView(), when: $willMoveToNextScreen)
This can be attached to anything, so I typically attach it to the end of the body, for example:
@State private var willMoveToNextScreen = false
var body: some View {
VStack {
/* ... */
}
.navigate(to: MainPageView(), when: $willMoveToNextScreen)
}
Code (remember to import SwiftUI
):
extension View {
/// Navigate to a new view.
/// - Parameters:
/// - view: View to navigate to.
/// - binding: Only navigates when this condition is `true`.
func navigate<NewView: View>(to view: NewView, when binding: Binding<Bool>) -> some View {
NavigationView {
ZStack {
self
.navigationBarTitle("")
.navigationBarHidden(true)
NavigationLink(
destination: view
.navigationBarTitle("")
.navigationBarHidden(true),
isActive: binding
) {
EmptyView()
}
}
}
}
}
We can use Text inside Navigation and make it like Button http://g.recordit.co/CkIkjvikfu.gif
struct HomeContent: View {
var body: some View {
NavigationView{
VStack {
NavigationLink(
destination: LoginContentView()) {
Text("Login")
.font(.title)
.foregroundColor(Color.white)
.multilineTextAlignment(.center)
.frame(width: 300.0, height: 50.0)
.background(Color(UIColor.appLightBlue))
}
}
}
}
}
I think Jake's answer is the basic way to NextView.
And I think the way bellow is a simple, formal, and dynamic way to try, if you really need to hit a BUTTON. According to Paul Hudson's Video, from 10'00" to 12'00".
(should go to 12'00" to 15'00", if you want to go to different views by tapping different buttons.) (should go to 15'00" to 16'00", if you want to go to second view and go back automatically.) And more
And here is the code example.
import SwiftUI
struct ContentView: View {
@State var areYouGoingToSecondView: Bool // Step 2
var body: some View {
NavigationView{ // Step 1
VStack {
// Step 3
NavigationLink(destination: YourSecondView(), isActive: $areYouGoingToSecondView) { EmptyView() }
Text("Hello World")
Button(action: {
self.areYouGoingToSecondView = true // Step 4
}) {
Text("Do Something (Go To Second View)")
.font(.largeTitle)
.fontWeight(.ultraLight)
}
}
}
}
}