I'm following through some swiftUI tutorial and I couldn't figure out what this meant.
This was the very first step, and I haven't done anything other than adding the NavigationView. How do I resolve this?
That's just container, you need some content inside, If you are just trying something out try following:
var body: some View {
NavigationView {
Text("Testing")
}
}
You cannot have an empty NavigationView. Add something inside.
struct ContentView: View {
var body: some View {
NavigationView {
Text("Text here")
}
}
}
FIRST: Add new SwiftUI-View (Name: MapView.swift without code-changing )
SECOND: Add new SwiftUI-View (Name: SecondView.swift)
THEN Change ContentView and SecondView:
a) ContentView.swift
import SwiftUI
struct ContentView: View {
var body: some View {
VStack {
MapView() // on upper Screen will appear: "Hello World"
NavigationView {
NavigationLink(destination: SecondView()) {
VStack {
Text("click here")
.fontWeight(.heavy)
.font(.largeTitle)
.padding()
Text("go to screen II")
}
}
} //End of NavigationView
}// End of VStack
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
VStack {
ContentView()
}
}
}
b) SecondView.swift
import SwiftUI
struct SecondView: View {
var body: some View {
VStack {
Text("Screen II")
.fontWeight(.heavy)
.foregroundColor(.blue)
.font(.largeTitle)
.padding()
Text("you changed it")
Text("GRATULATION!")
}
}
}
struct SecondView_Previews: PreviewProvider {
static var previews: some View {
SecondView()
}
}
c) MapView.swift
import SwiftUI
struct MapView: View {
var body: some View {
Text(/*#START_MENU_TOKEN#*/"Hello, World!"/*#END_MENU_TOKEN#*/)
}
}
struct MapView_Previews: PreviewProvider {
static var previews: some View {
MapView()
}
}
Related
I have two pieces of test code to check that things worked out. Basically I wanted to navigate from one view to a specific tag on a TabView page. Everything worked out until I put an init in the destination file. Is there a way to do this so adding an init won't break things? Here are the test files:
import SwiftUI
struct ContentView: View {
#State var selectedView = ""
var body: some View {
NavigationView {
NavigationLink("go", destination: PageTwo(selectedView: "three"))
.foregroundColor(Color.black)
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
and
import SwiftUI
struct PageTwo: View {
#State var selectedView = ""
// Adding this breaks the link between the files -> init(){}
var body: some View {
TabView(selection: $selectedView) {
Button("Show Second View") {
selectedView = "two"
}
.padding()
.tabItem {
Label("First", systemImage: "1.circle")
}
.tag("one")
Button("Show First View") {
selectedView = "one"
}
.padding()
.tabItem {
Label("Second", systemImage: "2.circle")
}
.tag("two")
Button("Show First View") {
selectedView = "one"
}
.padding()
.tabItem {
Label("Third", systemImage: "3.circle")
}
.tag("three")
}
}
}
struct PageTwo_Previews: PreviewProvider {
static var previews: some View {
PageTwo()
}
}
Thanks for any help.
I am engaging in a small SwiftUI exercise to learn how to pass data between views using NavigationLink. I set up ContentView to send a message to the SecondView after tapping the ContentView NavigationLink. Tapping NavigationLink in the SecondView then sends the message to the ThirdView. However, I am noticing a strange UI occurrence by the time I get to ThirdView. See the screenshot below:
Any idea why this NavigationView issue is occurring? Is it related to having NavigationView in all 3 views?
Here is my code:
ContentView
struct ContentView: View {
var body: some View {
NavigationView {
NavigationLink(destination: SecondView(message: "Hello from ContentView")) {
Text("Go to Second View")
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
SecondView
struct SecondView: View {
var message: String
var body: some View {
Text("\(message)")
NavigationView {
NavigationLink(destination: ThirdView(message: self.message)) {
Text("Go to Third View")
}
}
}
}
struct SecondView_Previews: PreviewProvider {
static var previews: some View {
SecondView(message: String())
}
}
ThirdView
struct ThirdView: View {
var message: String
var body: some View {
NavigationView {
Text("\(message)")
}
}
}
struct ThirdView_Previews: PreviewProvider {
static var previews: some View {
ThirdView(message: String())
}
}
Feedback is appreciated. Thanks!
remove the second navigation view
struct SecondView: View {
var message: String
var body: some View {
VStack(spacing: 100 ) {
Text("\(message)")
NavigationLink(destination: ThirdView(message: self.message)) {
Text("Go to Third View")
}
}
}
}
struct ThirdView: View {
var message: String
var body: some View {
Text("\(message)")
}
}
In SwiftUI I want to implement the following view. But I have no idea how I can put the navigation bar in the white view inside. Because it is placed on top of the purple view by default.
import SwiftUI
struct ContentView: View {
var body: some View {
ZStack {
Color.purple
WhiteView() // the white view
.padding(.top, 30)
.padding()
}
.edgesIgnoringSafeArea(.all)
}
}
import SwiftUI
struct WhiteView: View {
var body: some View {
Color.white
.cornerRadius (12)
}
}
struct WhiteView_Previews: PreviewProvider {
static var previews: some View {
WhiteView()
}
}
Here is possible approach - use NavigationView over color view, so it takes frame of parent view but not full screen
Tested with Xcode 12.4 / iOS 14.4
struct WhiteView: View {
var body: some View {
Color.white
.overlay(NavigationView {
NavigationLink("Test", destination: Text("Details"))
})
.cornerRadius (12)
}
}
I took your code, stuck it in a NavigationView, added a .navigationTitle, .toolbar and ToolBarItem and this is the View I got:
Code:
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationView {
ZStack {
Color.purple
WhiteView() // the white view
.padding(.top, 30)
.padding()
}
.edgesIgnoringSafeArea(.all)
.navigationTitle("Your Friends")
.toolbar {
ToolbarItem {
Text("Right Button")
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct WhiteView: View {
var body: some View {
Color.white
.cornerRadius (12)
}
}
What, exactly is your question/problem? Everything is in the white area.
to make it short: I want to have the same view of the list like in the first image i shared. But when I add a navigation bar item the list looks strange to me. It this a bug of the new version of Swift/XCode or needs something to be changed?
Code:
import SwiftUI
import CoreData
struct ContentView: View {
var body: some View {
NavigationView {
List{
Text("test1")
Text("test2")
Text("test3")
}
.navigationTitle("Test")
// .navigationBarItems(leading:
// Text("Test")
// )
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
Try using .navigationViewStyle as below:
struct ContentView: View {
#State private var isFullScreen = false
var body: some View {
NavigationView {
List{
Text("One")
Text("Two")
}
.navigationTitle("Testt")
.navigationBarItems(leading: Text("Add"))
}
.navigationViewStyle(StackNavigationViewStyle())
}
}
Hey! Give This A Try!
var body: some View {
NavigationView {
List{
Text("One")
Text("Two")
}
.navigationTitle("Testt, displayMode: .inline)
.navigationBarItems(leading: Text("Add"))
}
}
}
Im trying to link a button action in SomeView1() to navigate to a someView2() without having the back button at the top of the screen. Instead, I want to add another button in SomeView2() that will navigate back to SomeView1(). is this possible in SwiftUI yet?
SomeView1()
struct SomeView1: View {
var body: some View {
NavigationView {
VStack {
//...view's content
NavigationLink(destination: SomeView2()) {
Text("go to SomeView2")
}
Spacer()
}
}
}
}
SomeView2()
struct SomeView2: View {
var body: some View {
NavigationView {
VStack {
//...view's content
NavigationLink(destination: SomeView1()) {
Text("go to SomeView1")
}
Spacer()
}
}
}
}
this is what it looks like:
The right way to get what you want here is to use the presentationMode environment variable:
import SwiftUI
struct View2: View {
#Environment(\.presentationMode) var presentationMode: Binding<PresentationMode>
var body: some View {
VStack {
Button(action: {
self.presentationMode.wrappedValue.dismiss()
}) {
Text("POP")
}
}
.navigationBarTitle("")
.navigationBarBackButtonHidden(true)
.navigationBarHidden(true)
}
}
struct ContentView: View {
var body: some View {
NavigationView {
NavigationLink(destination: View2()) {
Text("PUSH")
.navigationBarTitle("")
.navigationBarHidden(true)
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
You can do something like this in SomeView2():
NavigationView {
VStack {
//...view's content
NavigationLink(destination: SomeView1()) {
Text("go to SomeView1")
}
Spacer()
}
}.navigationBarBackButtonHidden(true)
I believe that you should use only one NavigationView for the whole navigation process. Now you have three NavigationViews inside each other, which produces three back buttons.
So in your case it would become something like this:
struct SomeView1InsideNavigationView: View { // This should be the first view you present
var body: some View {
NavigationView { // Use NavigationView only once
SomeView1()
}
}
}
struct SomeView1: View {
var body: some View {
VStack { // Do *not* use NavigationView here
//...view's content
NavigationLink(destination: SomeView2()) {
Text("go to SomeView2")
}
Spacer()
}
}
}
struct SomeView2: View {
var body: some View {
VStack { // Do *not* use NavigationView here
//...view's content
NavigationLink(destination: SomeView1()) {
Text("go to SomeView1")
}
Spacer()
}
}
}