I am looking to be able to use a NavigationButton to navigate to a new view within .navigationBarItems. This is how I expect it should work:
NavigationView {
Text("Hello world")
.navigationBarTitle(Text("Title"))
.navigationBarItems(trailing:
NavigationButton(destination: TestView()) {
Text("Next")
}
)
}
However, the "Next" button doesn't do anything! I am aware of PresentationButton which provides a popover view like so:
NavigationView {
Text("Hello world")
.navigationBarTitle(Text("Title"))
.navigationBarItems(trailing:
PresentationButton(destination: TestView()) {
Text("Next")
}
)
}
But this isn't what I'm looking for.
As I told you in comments, It was a bug. But it get fixed and it's working now exactly as you expected since Beta 5, But remember, NavigationButton has changed to NavigationLink. So it would be like:
struct ContentView: View {
var body: some View{
NavigationView {
Text("Hello world")
.navigationBarTitle(Text("Title"))
.navigationBarItems(trailing:
NavigationLink(destination: TestView()) {
Text("Next")
}
)
}
}
}
If you're having a list & you need to navigate through the screens then you should use NavigationLink instead of NavigationButton cause it's changed recently. For example:-
NavigationView{
List(landmarkData) { landmark in
NavigationLink(destination: LandmarkDetail()){
LandmarkRow(landmark: landmark)
}
}
}
Related
I'm a beginner at swiftui. I need to add an exit button to .navigationBarItems. How can I add this button in the parent NavigationView to show this button on all children's views?
// a simple example on my question
struct FirstView: View {
var body: some View {
NavigationView {
ZStack{
TabView{
SubExampleViewOne()
.tabItem {
Image(systemName: "house.fill")
Text("Home")
}
SubExampleViewTwo()
.tabItem {
Image(systemName: "bookmark.circle.fill")
Text("Bookmark")
}
}
}
//here I have added a toolbar and it is perfectly visible in tabitem
//this is what I am trying to achieve, the visibility of the button on all pages
.toolbar {
ToolbarItem(placement: .navigationBarTrailing) {
ButtonExitView()
}
}
}
}
}
something strange - if I add NavigationLink in this way, Image and Text("Home") are visible twice
and the ToolbarItem is no longer on the new page
struct SubExampleViewOne: View {
var body: some View {
Text("This is hime page!")
.padding()
NavigationLink(destination: SubExampleViewThree()){
Text("Navigation link")
}
}
}
struct SubExampleViewTwo: View {
var body: some View {
Text("Hello, world!")
.padding()
}
}
struct SubExampleViewThree: View {
var body: some View {
Text("This is Navigation link")
.padding()
}
}
struct ButtonExitView: View {
var body: some View {
Button(action: {}, label: {Image(systemName: "arrowshape.turn.up.right.circle")})
}
}
after learning about TabView, I thought that there should be a similar solution for the top of the page
You have to add the button to each child view separately.
And you should use .toolbar and .toolBarItem because .navigationBarItems is deprecated.
Im trying to use SwiftUI List & NavigationLink with custom font/colors/view
Nothing is working I tried setting the .foregroundColor and using other View customized yet i cant change the color of the text, i only want to have a black text color nothing fancy
struct SettingsView: View {
var body: some View {
List{
Section(header: Text("North America")){
NavigationLink(destination: CASettingsView() ) {
SettingItemView(value: "USA")
}.foregroundColor(.red)
NavigationLink(
destination: Text("Destination"),
label: {
Text("Click Here!")
.foregroundColor(.black)
}
)
}
}
.listStyle(.plain)
}
}
struct SettingsView_Previews: PreviewProvider {
static var previews: some View {
CASettingsView()
}
}
Your NavigationLinks are greyed out because they aren’t embedded in a NavigationView. Wrap your whole list in NavigationView { }
In my case it works.
NavigationView {
NavigationLink(destination: Empty()) {
Button("Smth", action: {})
}.foregroundColor(.black)
}
You just need to use foregroundColor to NavigationLink instead of Text()
I wrote a simple Swift UI app that creates a NavigationLink on the navigation toolbar and creates a status bar at the bottom of the display. When clicking on the gear link on the navigation bar, it takes you to the child view, but when you return to the parent view, the status bar gets hidden. If you click on the NavigationLink in the middle of the screen and return to the parent view, the status bar gets displayed again.
This looks like a bug in Swift UI and does anyone know how to fix?
import SwiftUI
struct ContentView: View {
var body: some View {
NavigationView {
NavigationLink(destination: Text("Child view")) {
Text("Hello, World!")
}
.toolbar {
ToolbarItem(placement: .navigationBarTrailing, content: {
NavigationLink(destination: Text("Settings view"),
label: { Image(systemName: "gearshape.fill")
})
})
ToolbarItem(placement: .status, content: {
Text("Checking for messages...")
})
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
The issue is that Swift UI doesn't handle NavigationLink properly inside a toolbar.
The workaround is to place a Button into a toolbar and use a hidden NavigationLink in the code.
This is a link to the answer that resolved my issue.
SwiftUI - Make toolbar's NavigationLink use detail view
Here is the code that implements my original code with the workaround.
struct ContentView: View {
#State var settingsLinkSelected = false
var body: some View {
NavigationView {
NavigationLink(destination: Text("Second view")) {
Text("Hello, World!")
}
.toolbar {
ToolbarItem(placement: .navigationBarTrailing,
content: { Button(action: { settingsLinkSelected = true },
label: { Image(systemName: "gearshape.fill") }) })
ToolbarItem(placement: .status,
content: { Text("Checking for messages...") })
}
.background(
NavigationLink(
destination: Text("Settings View"),
isActive: $settingsLinkSelected
) {
EmptyView()
}.hidden()
)
}
}
}
I'm trying to do the simplest of things. I just want to summon a new SwiftUI view programmatically - not with a button, but with code. I've read a couple of dozens posts and Apple docs on this - but almost all that I've found relates to code that has been renamed or deprecated. The closest I have found is:
NavigationLink(destination: NewView(), isActive: $something) {
EmptyView()
}
But this does not work for me in Xcode Beta 7. Here's the trivial app:
struct ContentView: View {
#State private var show = false
var body: some View {
VStack {
Text("This is the ContentView")
Toggle(isOn: $show) {
Text("Toggle var show")
}
.padding()
Button(action: {
self.show = !self.show
}, label: {
Text(self.show ? "Off" : "On")
})
Text(String(show))
//this does not work - the ContentView is still shown
NavigationLink(destination: SecondView(), isActive: $show)
{
EmptyView()
}
//this does not work - it adds SecondView to ContentView
//I want a new view here, not an addition
//to the ContentView()
// if show {
// //I want a new view here, not an addition to the ContentView()
// SecondView()
// }
}
}
}
And the brutally simple destination:
struct SecondView: View {
var body: some View {
Text("this is the second view!")
}
}
I must be missing something extremely simple. Any guidance would be appreciated.
iOS 13.1, Catalina 19A546d, Xcode 11M392r
A couple of things. First, NavigationLink must be imbedded in a NavigationView to work. Second, the link doesn't need a view as you showed it. This should show the second view. I will leave to you to update the other elements.
var body: some View {
NavigationView{
VStack {
Text("This is the ContentView")
Toggle(isOn: $show) {
Text("Toggle var show")
}
.padding()
Button(action: {
self.show = !self.show
}, label: {
Text(self.show ? "Off" : "On")
})
Text(String(show))
//this does not work - the ContentView is still shown
NavigationLink(destination: SecondView()){
Text("Click to View")}
Spacer()
// {
// EmptyView()
// }
//this does not work - it adds SecondView to ContentView
//I want a new view here, not an addition
//to the ContentView()
// if show {
// //I want a new view here, not an addition to the ContentView()
// SecondView()
// }
}
}
}
I'm trying to build a TabbedView with the following simple code:
TabbedView {
Text("Hello world")
.tabItemLabel(Text("Hello"))
Text("Foo bar")
.tabItemLabel(Text("Foo"))
}
When running, both tabs are visible and enabled but the second tab's ("Foo") content is blank.
Try adding tags:
TabbedView {
Text("Hello world")
.tabItem { Text("Hello") }
.tag(0)
Text("Foo bar")
.tabItem { Text("Foo") }
.tag(1)
}
I was able to fix this by adding a selection state variable and passing that in for the selection:
struct ContentView : View {
#State private var selection = 1
var body: some View {
TabbedView(selection: $selection) {
Text("Tab 1!").tabItemLabel(
Text("Tab 1")).tag(1)
Text("Tab 2!").tabItemLabel(Text("Tab 2")).tag(2)
}
}
}
Now, tapping "Tab 2" will show "Tab 2!" on the screen, as opposed to a blank screen.
This was using Xcode 11.0 beta 2 (11M337n), macOS Catalina 10.15 Beta (19A487l).
In the newest version you should use TabView:
TabView {
AnyView()
.tabItem {
Text("Label 1")
}
AnyView()
.tabItem {
Text("Label 2")
}
}
In Xcode GM, TabbedView was renamed to TabView. So here's the right way to create a tab bar in SwiftUI now:
TabView {
Text("Hello world")
.tabItem { Text("Hello") }
.tag(0)
Text("Foo bar")
.tabItem { Text("Foo") }
.tag(1)
}
Try this way, but you can't use an icon from SF Symbols, use the icons from //icons8.com or from another platform. or watch this tutorial https://www.youtube.com/watch?v=3PfCU5h5z94
struct ContentView : View {
var body : some View {
TabbedView {
Living_R()
.tabItemLabel(VStack {
Image("home")
Text("Home")
}).tag(0)
ContentView()
.tabItemLabel(VStack {
Image("search")
Text("Search")
}).tag(1)
Text("Info")
.tabItemLabel(VStack {
Image("page")
Text("Doc")
}).tag(2)
}
}
}