I have simple Picker object in my SwiftUI hierarchy:
Picker(selection: $pickerSelection, label: Text("Select your item")) {
ForEach(0 ..< items.count) {
Text("\(self.items[$0].valueCode)")
.tag($0)
}
}
I'm using a scrollable Picker in WatchOS app and it works just fine. I'm even getting a Digital Crown rotation capability for free.
What I want to do is to detect when the scrolling started and especially ended (to get last selected value and execute and action with it)
I figure I need to implement sort of Delegate method to read the changes happening to the Picker but I'm not sure how, nor I'm able to find any in the documentation for WKInterfacePicker or just Picker
Any suggestions on how to detect the beginning and end of the scrolling event?
If its about the last value you can use Combine and subscribe to pickerSelection.
class ViewModel: ObservableObject {
private var disposables = Set<AnyCancellable>()
#Published var pickerSelection = 0
init() {
let cc = $pickerSelection
.sink(receiveValue: { value in
print(value)
})
cc.store(in: &disposables)
}
}
struct ContentView: View {
#ObservedObject var mm = ViewModel()
var items = [1,2,3,4,5,6,7,8,9,10]
var body: some View {
VStack {
Text("Hello, World!")
Picker(selection: self.$mm.pickerSelection, label: Text("Item:")) {
ForEach(0 ..< items.count) {
Text("Item \($0)")
.tag($0)
}
}
}
}
}
Related
I'm seeing onChange(of: Bool) action tried to update multiple times per frame warnings when clicking on NavigationLinks in the sidebar for a SwiftUI macOS App.
Here's what I currently have:
import SwiftUI
#main
struct BazbarApp: App {
#StateObject private var modelData = ModelData()
var body: some Scene {
WindowGroup {
ContentView()
.environmentObject(modelData)
}
}
}
class ModelData: ObservableObject {
#Published var myLinks = [URL(string: "https://google.com")!, URL(string: "https://apple.com")!, URL(string: "https://amazon.com")!]
}
struct ContentView: View {
#EnvironmentObject var modelData: ModelData
#State private var selected: URL?
var body: some View {
NavigationView {
List(selection: $selected) {
Section(header: Text("Bookmarks")) {
ForEach(modelData.myLinks, id: \.self) { url in
NavigationLink(destination: DetailView(selected: $selected) ) {
Text(url.absoluteString)
}
.tag(url)
}
}
}
.onDeleteCommand {
if let selected = selected {
modelData.myLinks.remove(at: modelData.myLinks.firstIndex(of: selected)!)
}
selected = nil
}
Text("Choose a link")
}
}
}
struct DetailView: View {
#Binding var selected: URL?
var body: some View {
if let selected = selected {
Text("Currently selected: \(selected)")
}
else {
Text("Choose a link")
}
}
}
When I alternate clicking on the second and third links in the sidebar, I eventually start seeing the aforementioned warnings in my console.
Here's a gif of what I'm referring to:
Interestingly, the warning does not appear when alternating clicks between the first and second link.
Does anyone know how to fix this?
I'm using macOS 12.2.1 & Xcode 13.2.1.
Thanks in advance
I think the issue is that both the List(selection:) and the NavigationLink are trying to update the state variable selected at once. A List(selection:) and a NavigationLink can both handle the task of navigation. The solution is to abandon one of them. You can use either to handle navigation.
Since List look good, I suggest sticking with that. The NavigationLink can then be removed. The second view under NavigationView is displayed on the right, so why not use DetailView(selected:) there. You already made the selected parameter a binding variable, so the view will update if that var changes.
struct ContentView: View {
#EnvironmentObject var modelData: ModelData
#State private var selected: URL?
var body: some View {
NavigationView {
List(selection: $selected) {
Section(header: Text("Bookmarks")) {
ForEach(modelData.myLinks, id: \.self) { url in
Text(url.absoluteString)
.tag(url)
}
}
}
.onDeleteCommand {
if let selected = selected {
modelData.myLinks.remove(at: modelData.myLinks.firstIndex(of: selected)!)
}
selected = nil
}
DetailView(selected: $selected)
}
}
}
I can recreate this problem with the simplest example I can think of so my guess is it's an internal bug in NavigationView.
struct ContentView: View {
var body: some View {
NavigationView {
List {
NavigationLink("A", destination: Text("A"))
NavigationLink("B", destination: Text("B"))
NavigationLink("C", destination: Text("C"))
}
}
}
}
I use an ObservableObject to keep the state of whether a user is subscribed to my app or not, and based on the subscription status, show different views. This worked fine prior to Xcode 13 and WatchOS 8, but now this is causing a runtime error of runtime: SwiftUI: Accessing State's value outside of being installed on a View. This will result in a constant Binding of the initial value and will not update. And, the binding does not update per the error. This occurs on both Xcode 13.1 and 13.2b2
This code below reproduces the error:
struct MultiPageView: View {
#ObservedObject var subscribed = SubscribedModel.shared
var body: some View {
if subscribed.value {
TabView {
ViewOne()
ViewTwo()
ViewThree()
ToggleView()
}
.tabViewStyle(PageTabViewStyle())
} else {
TabView {
ViewOne()
ToggleView()
}
.tabViewStyle(PageTabViewStyle())
}
}
}
struct ToggleView: View {
#ObservedObject var subscribed = SubscribedModel()
var body: some View {
Toggle(isOn: $subscribed.value) {
Text("Subscribed")
}
}
}
class SubscribedModel: ObservableObject {
public static let shared = SubscribedModel.shared
#Published var value: Bool = false
}
I am only listing ViewOne for brevity, but ViewTwo and ViewThree are the same with different text:
struct ViewOne: View {
var body: some View {
Text("View One")
.padding()
}
}
If you navigate to the ToggleView(), and switch the toggle, the error pops immediately. Any suggestions to fix this?
Update per #LoremIpsum comment:
struct MultiPageView: View {
#StateObject var subscribed = SubscribedModel()
var body: some View {
if subscribed.value {
TabView {
ViewOne()
ViewTwo()
ViewThree()
ToggleView(subscribed: $subscribed.value)
}
.tabViewStyle(PageTabViewStyle())
} else {
TabView {
ViewOne()
ToggleView(subscribed: $subscribed.value)
}
.tabViewStyle(PageTabViewStyle())
}
}
}
struct ToggleView: View {
#Binding var subscribed: Bool
var body: some View {
Toggle(isOn: $subscribed) {
Text("Subscribed")
}
}
}
It is now switching between the TabViews, but the error still remains, and is showing up immediately. Deleted DerivedData and cleaned build folder. Any thoughts?
I will add that this same basic code is running fine on iOS 15. It is just WatchOS that is popping the error.
I was having the same issue for a long time, and this is still happening on Xcode 13.2.1.
Seems to be an issue with TabView on watchOS, because if you replace the TabView for another View the error is gone.
The solution is to use the initialiser for TabView with a selection value: init(selection:content:)
1 Define a property for selection
#State private var selection = 0
2 Update TabView
From
TabView {
// content
}
To
TabView(selection: $selection) {
// content
}
Updating your code would look like this:
struct MultiPageView: View {
#StateObject var subscribed = SubscribedModel()
#State private var selection = 0
var body: some View {
if subscribed.value {
TabView(selection: $selection) {
ViewOne()
ViewTwo()
ViewThree()
ToggleView(subscribed: $subscribed.value)
}
.tabViewStyle(PageTabViewStyle())
} else {
TabView(selection: $selection) {
ViewOne()
ToggleView(subscribed: $subscribed.value)
}
.tabViewStyle(PageTabViewStyle())
}
}
}
Basically just defining a #State property for TabView.selection, and using it on both your TabViews (using separated properties would also work).
I'm using the new timer style (Text.DateStyle) that was introduced at WWDC 2020 in SwiftUI to display a countdown timer. This works initially. However, as soon as the date that is provided by my view model changes (e.g. click reset), the view doesn't update. The timer does indeed get the new date but it isn't displayed. You can check this by rotating the device / simulator or press+hold the reset button to see the updated timer work just fine. So it must be something related to the view lifecycle.
The code:
import SwiftUI
import Combine
class ViewModel: ObservableObject {
#Published var date: Date = Date().addingTimeInterval(1000)
func reload() {
date = Date().addingTimeInterval(1000)
}
}
struct ContentView: View {
#StateObject var viewModel = ViewModel()
var body: some View {
VStack {
Text(viewModel.date, style: .timer)
.padding()
Button("Reset") {
NotificationCenter.default.post(name: NSNotification.Name("TEST"), object: nil)
}
Spacer()
}
.frame(width: 500.0)
.onReceive(NotificationCenter.default.publisher(for: NSNotification.Name("TEST")), perform: { _ in
viewModel.reload()
})
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
Is this a know problem (and if so, is there a workaround?) or am I doing something wrong here?
Thanks for your help!
Seem like a bug with the button press effect. You can use Text and adding a tap gesture and make it a button then it will work fine.
struct ContentViewTimer: View {
#StateObject var viewModel = ViewModel()
var body: some View {
VStack {
Text(viewModel.date, style: .timer)
.padding()
Text("Reset") //<-- Here
.onTapGesture {
NotificationCenter.default.post(name: NSNotification.Name("TEST"), object: nil)
}
Spacer()
}
.frame(width: 500.0)
.onReceive(NotificationCenter.default.publisher(for: NSNotification.Name("TEST")), perform: { _ in
viewModel.reload()
})
}
}
Just add a .id(UUID()) modifier to your VStack and it will work as expected. Making view identifiable makes it reset its state when proxy value (date in your case) changes.
I have a simple View showing a list of 3 items. When the user taps on an item, it navigates to the next view. This works fine. However, I would like to also perform an action (set a variable in a View Model) when a list item is tapped.
Is this possible? Here's the code:
import SwiftUI
struct SportSelectionView: View {
#EnvironmentObject var workoutSession: WorkoutManager
let sports = ["Swim", "Bike", "Run"]
var body: some View {
List(sports, id: \.self) { sport in
NavigationLink(destination: ContentView().environmentObject(workoutSession)) {
Text(sport)
}
}.onAppear() {
// Request HealthKit store authorization.
self.workoutSession.requestAuthorization()
}
}
}
struct DisciplineSelectionView_Previews: PreviewProvider {
static var previews: some View {
SportSelectionView().environmentObject(WorkoutManager())
}
}
The easiest way I've found to get around this issue is to add an .onAppear call to the destination view of the NavigationLink. Technically, the action will happen when the ContentView() appears and not when the NavigationLink is clicked.. but the difference will be milliseconds and probably irrelevant.
NavigationLink(destination:
ContentView()
.environmentObject(workoutSession)
.onAppear {
// add action here
}
)
Here's a solution that is a little different than the onAppear approach. By creating your own Binding for isActive in the NavigationLink, you can introduce a side effect when it's set. I've implemented it here all within the view, but I would probably do this in an ObservableObject if I were really putting it into practice:
struct ContentView: View {
#State var _navLinkActive = false
var navLinkBinding : Binding<Bool> {
Binding<Bool> { () -> Bool in
return _navLinkActive
} set: { (newValue) in
if newValue {
print("Side effect")
}
_navLinkActive = newValue
}
}
var body: some View {
NavigationView {
NavigationLink(
destination: Text("Dest"),
isActive: navLinkBinding,
label: {
Text("Navigate")
})
}
.navigationViewStyle(StackNavigationViewStyle())
}
}
I've tried switching between a segmented and wheel picker, but neither register a selection when clicked.
NavigationView {
Form {
Picker(selection: self.$settings.senatorChoice, label: Text("Choose a senator")) {
ForEach(0 ..< self.customSenators.count) {
Text(self.customSenators[$0])
}
}.pickerStyle(WheelPickerStyle())
.labelsHidden()
.padding()
}
}
Double check that settings.senatorChoice is an Int. The type of your range in ForEach must match the type of your Picker's binding. (See here for more info).
In addition, you probably want to use ForEach(self.customSenators.indices, id: \.self). This prevents possible crashes and out-of-date UI if elements get added to or removed from customSenators. (See here for more info.)
Add a tag to each picker item so they are unique e.g.
Text(self.customSenators[$0]).tag($0)
The following test code registers the selection when clicked.
struct Settings {
var senatorChoice: Int = 0
}
struct ContentView: View {
#State private var settings = Settings()
#State private var customSenators = ["One","Two","Three"]
var body: some View {
NavigationView {
Form {
Picker(selection: self.$settings.senatorChoice, label: Text("Choose a senator")) {
ForEach(0 ..< customSenators.count) {
Text(self.customSenators[$0])
}
}.pickerStyle(SegmentedPickerStyle())
.labelsHidden()
.padding()
Text("value: \(customSenators[settings.senatorChoice])")
}
}
}
}