I have a SwiftUI Form with a custom chart view (not Swift Charts). A long press toggles to a different type of chart. These charts use the .transition(.slide) modifier. In iOS 15 these transitioned as expected on a long press, but in iOS 16 they do not.
Persisted state property (an enum):
#AppStorage("chartType") var chartType: ChartType = .chartA
The Form part of the body property:
Form {
// Other sections
Section {
switch chartType {
case .chartA:
ChartViewA()
.transition(.slide)
case .chartB:
ChartViewB()
.transition(.slide)
}
.onLongPressGesture {
if chartType == .chartA {
withAnimation {
summaryChartType = .chartB
}
} else {
withAnimation {
summaryChartType = .chartA
}
}
}
Unfortunately adding animation modifiers like .animation(.spring(), value: chartType) makes no difference.
I would be grateful for advice on why this might have worked in iOS 15 but not in iOS 16, and what I could do to restore animation here.
In iOS 16, there appears to be a problem with #AppStorage vars and animation. Here is one possible workaround. Use #State var for animation, and save it to an #AppStorage variable with .onChange():
enum ChartType: String {
case chartA, chartB
}
struct ChartViewA: View {
var body: some View {
Color.red
}
}
struct ChartViewB: View {
var body: some View {
Color.blue
}
}
struct ContentView: View {
#AppStorage("chartType") var chartTypeAS: ChartType = .chartA
#State private var chartType: ChartType = .chartA
init() {
// load initial value from persistent storage
_chartType = State(initialValue: chartTypeAS)
}
var body: some View {
Form {
// Other sections
Section {
VStack {
switch chartType {
case .chartA:
ChartViewA()
.transition(.slide)
case .chartB:
ChartViewB()
.transition(.slide)
}
}
.onLongPressGesture {
if chartType == .chartA {
withAnimation {
chartType = .chartB
}
} else {
withAnimation {
chartType = .chartA
}
}
}
}
.onChange(of: chartType) { value in
// persist chart type
chartTypeAS = value
}
}
}
}
Tested in Xcode 14.0 with iPhone 14 simulator running iOS 16.
Alternatively, you could perform the saving to/restoring from UserDefaults manually.
Related
I'm trying to implement a Coordinator for managing a flow. The state is stored inside the CoordinatorStore. There are 2 #Published properties for managing the flow. The screen property controls which View is currently shown and path controls the navigation stack of the stack view. Details of the implementation can be found below.
With the current implementation and after the following actions: showA -> showB -> showInitial -> Go to Stack
I would expect that StoreA and StoreB would be deallocated from memory since path, which holds StoreA and StoreB via enum associated values, gets emptied.
But that doesn't happen, and if I repeat the actions again there would be 2 StoreA and 2 StoreB in memory and so on. Am I missing something?
I will also attach a screenshot of the memory debugger snapshot after doing the initial set of actions.
enum Path: Hashable {
case a(StoreA)
case b(StoreB)
}
enum Screen {
case initial
case stack
}
final class CoordinatorStore: ObservableObject {
#Published var path: [Path] = []
#Published var screen: Screen = .stack
func showA() {
let store = StoreA()
path.append(.a(store))
}
func showB() {
let store = StoreB()
path.append(.b(store))
}
func showInitial() {
path = []
screen = .initial
}
func showStack() {
screen = .stack
}
}
struct Coordinator: View {
#ObservedObject var store: CoordinatorStore
var body: some View {
switch store.screen {
case .initial: initial
case .stack: stack
}
}
var stack: some View {
NavigationStack(path: $store.path) {
VStack {
Text("Root")
}
.toolbar {
Button(action: self.store.showA) {
Text("Push A")
}
}
.navigationDestination(for: Path.self) { path in
switch path {
case .a(let store):
ViewA(store: store)
.toolbar {
Button(action: self.store.showB) {
Text("Push B")
}
}
case .b(let store):
ViewB(store: store)
.toolbar {
Button(action: self.store.showInitial) {
Text("Show Initial")
}
}
}
}
}
}
var initial: some View {
VStack {
Text("Initial")
Button(action: store.showStack) {
Text("Go to Stack")
}
}
}
}
struct ViewA: View {
#ObservedObject var store: StoreA
var body: some View {
Text("View A")
}
}
final class StoreA: NSObject, ObservableObject {
deinit {
print("Deinit: \(String(describing: self))")
}
}
struct ViewB: View {
#ObservedObject var store: StoreB
var body: some View {
Text("View B")
}
}
final class StoreB: NSObject, ObservableObject {
deinit {
print("Deinit: \(String(describing: self))")
}
}
I believe this is related but not identical to:
Found a strange behaviour of #State when combined to the new Navigation Stack - Is it a bug or am I doing it wrong?
The Navigation api seems to be prioritizing efficiency (inits are expensive) and that SOMETHING must always be on screen. It doesn't seem to de-initialize views that have been disappeared until it has a replacement initialized and appeared.
That can lead to a memory leak (I believe) if you try to manage Navigation framework views with something outside of the Navigation framework, but it appears as long as the Navigation framework stays in charge things will be de-inted eventually, but not until the new view is init-ed.
NEWER VERSION
This version uses one coordinator, but preserves the separate enums and views for the initial vs main app pathways.
import Foundation
import SwiftUI
enum AppSceneTvTe:Hashable {
case setup
case app
}
enum PathTvTeOptions: Hashable {
case optionA(OptionAVM)
case optionB(OptionBVM)
}
struct SplashTVTEView: View {
#StateObject var oneCoordinator = CoordinatorTvTe()
var body: some View {
NavigationStack(path: $oneCoordinator.path) {
splash
.navigationDestination(for: AppSceneTvTe.self) { scene in
switch scene {
case .app:
SplashTvTeAppRootView().environmentObject(oneCoordinator)
default:
splash
}
}
}
}
var splash: some View {
VStack {
Text("Splash Page")
Button(action:navigateToApp) {
Text("Go App Root")
}
}.navigationBarBackButtonHidden(true)
}
func navigateToApp() {
oneCoordinator.showStack()
}
}
final class CoordinatorTvTe: ObservableObject {
#Published var path = NavigationPath()
func showA() {
path.append(PathTvTeOptions.optionA(OptionAVM()))
}
func showB() {
path.append(PathTvTeOptions.optionB(OptionBVM()))
}
func showInitial() {
unwindAll()
//path = NavigationPath()
}
func showStack() {
path = NavigationPath()
path.append(AppSceneTvTe.app)
}
func unwindAll() {
while !path.isEmpty {
path.removeLast()
}
}
}
struct SplashTvTeAppRootView: View {
#EnvironmentObject var navigation: CoordinatorTvTe
var body: some View {
VStack {
Text("Real Root")
}
.navigationBarBackButtonHidden(true)
.toolbar {
Button(action: self.navigation.showA) {
Text("Push A")
}
}
.navigationDestination(for: PathTvTeOptions.self) { path in
switch path {
case .optionA(let vm):
OptionAView(vm: vm)
.toolbar {
Button(action: self.navigation.showB) {
Text("Push B")
}
}
case .optionB(let vm):
OptionBView(vm: vm)
.toolbar {
Button(action: self.navigation.showInitial) {
Text("Show Initial")
}
}
}
}
}
}
OLDER VERSION
Currently the way out of this is to keep it all in the Navigation Stack so no separate Scene vs. Path.
This code uses a boolean to control the Initial screen, but it could be one of the path options - which is the commented out code.
EDITED TO ADD: Tuns out the boolean solution gets weird when you try to make the initial state true. The Stack keeps winning, so I've taken it out.
enum Path: Hashable {
case initial
case a(StoreA)
case b(StoreB)
}
final class CoordinatorStore: ObservableObject {
#Published var path: [Path] = [.initial]
func showA() {
let store = StoreA()
path.append(.a(store))
}
func showB() {
let store = StoreB()
path.append(.b(store))
}
func showInitial() {
path = []
path.append(.inital)
}
func showStack() {
path = []
}
}
struct Coordinator: View {
#ObservedObject var store: CoordinatorStore
var body: some View {
NavigationStack(path: $store.path) {
VStack {
Text("Real Root")
}
.toolbar {
Button(action: self.store.showA) {
Text("Push A")
}
}
.navigationDestination(for: Path.self) { path in
switch path {
case .a(let store):
ViewA(store: store)
.toolbar {
Button(action: self.store.showB) {
Text("Push B")
}
}
case .b(let store):
ViewB(store: store)
.toolbar {
Button(action: self.store.showInitial) {
Text("Show Initial")
}
}
case .initial:
initial
}
}
}
}
var initial: some View {
VStack {
Text("Initial")
Button(action: store.showStack) {
Text("Go to Stack")
}
}.navigationBarBackButtonHidden(true)
}
}
The following code works perfectly fine on iOS, but not on iPadOS. When I tap on one of the items in the list, the corresponding detail view is shown, but it will not change if I tap on another item. When I change the model in the LanguageDetail view to #ObservedObject, it works. To be clear, this is only an example to illustrate the problem. In my actual project, I'm not able to make this change though. The code below demonstrates this problem.
struct ContentView: View {
let languages: [String] = ["Objective-C", "Java", "Python", "Swift", "Rust"]
#State var selectedLanguage: String?
var body: some View {
NavigationView {
List(languages, id: \.self) { language in
Button(action: {selectedLanguage = language}) {
Text(language)
.bold()
.padding()
}
}
.background {
NavigationLink(isActive: $selectedLanguage.isPresent()) {
if let lang = selectedLanguage {
LanguageDetail(model: LanguageDetailModel(languageName: lang))
} else {
EmptyView()
}
} label: {
EmptyView()
}
}
}
}
}
struct LanguageDetail: View {
#StateObject var model: LanguageDetailModel
var body: some View {
VStack {
Text(model.languageName)
.font(.headline)
Text("to rule them all...")
}
}
}
class LanguageDetailModel: ObservableObject {
#Published var languageName: String
init(languageName: String) {
self.languageName = languageName
}
}
This extension is needed:
/// This extension is from the [SwiftUI Navigation Project on Github](https://github.com/pointfreeco/swiftui-navigation)
extension Binding {
/// Creates a binding by projecting the current optional value to a boolean describing if it's
/// non-`nil`.
///
/// Writing `false` to the binding will `nil` out the base value. Writing `true` does nothing.
///
/// - Returns: A binding to a boolean. Returns `true` if non-`nil`, otherwise `false`.
public func isPresent<Wrapped>() -> Binding<Bool>
where Value == Wrapped? {
.init(
get: { self.wrappedValue != nil },
set: { isPresent, transaction in
if !isPresent {
self.transaction(transaction).wrappedValue = nil
}
}
)
}
}
import SwiftUI
enum Language: Int, Identifiable, CaseIterable {
case objc
case java
case python
case swift
case rust
var id: Self { self }
var localizedDescription: LocalizedStringKey {
switch self {
case .objc: return "Objective-C"
case .java: return "Java"
case .python: return "Python"
case .swift: return "Swift"
case .rust: return "Rust"
}
}
}
struct LanguagesTest: View {
#State private var selection: Language?
var body: some View {
NavigationSplitView {
List(Language.allCases, selection: $selection) { language in
NavigationLink(value: language) {
Text(language.localizedDescription)
}
}
} detail: {
if let language = selection {
LanguageDetail(language: language)
}
else {
Text("Select Language")
}
}
}
}
struct LanguageDetail: View {
let language: Language
var body: some View {
VStack {
Text(language.localizedDescription)
.font(.headline)
Text("to rule them all...")
}
}
}
I have a sheet view that is presented when a user clicks a button as shown in the parent view below:
struct ViewWithSheet: View {
#State var showingSheetView: Bool = false
#EnvironmetObject var store: DataStore()
var body: some View {
NavigationView() {
ZStack {
Button(action: { self.showingSheetView = true }) {
Text("Show sheet view")
}
}
.navigationBarHidden(true)
.navigationBarTitle("")
.sheet(isPresented: $showingSheetView) {
SheetView(showingSheetView: self.$showingSheetView).environmentObject(self.dataStore)
}
}
}
}
In the sheet view, when a user clicks another button, an action is performed by the store that has a completion handler. The completion handler returns an object value, and if that value exists, should dismiss the SheetView.
struct SheetView: View {
#Binding var showingSheetView: Bool
#EnvironmentObject var store: DataStore()
//#Environment(\.presentationMode) private var presentationMode
func create() {
store.createObject() { object, error in
if let _ = object {
self.showingSheetView = false
// self.presentationMode.wrappedValue.dismiss()
}
}
}
var body: some View {
VStack {
VStack {
HStack {
Button(action: { self.showingSheetView = false }) {
Text("Cancel")
}
Spacer()
Spacer()
Button(action: { self.create() }) {
Text("Add")
}
}
.padding()
}
}
}
}
However, in the create() function, once the store returns values and showingSheetView is set to false, the sheet view doesn't dismiss as expected. I've tried using presentationMode to dismiss the sheet as well, but this also doesn't appear to work.
I found my issue, the sheet wasn't dismissing due to a conditional in my overall App wrapping View, I had an if statement that would show a loading view on app startup, however, in my DataStore I was setting it's fetching variable on every function call it performs. When that value changed, the view stack behind my sheet view would re-render the LoadingView and then my TabView once the fetching variable changed again. This was making the sheet view un-dismissable. Here's an example of what my AppView looked like:
struct AppView: View {
#State private var fetchMessage: String = ""
#EnvironmentObject var store: DataStore()
func initializeApp() {
self.fetchMessage = "Getting App Data"
store.getData() { object, error in
if let error = error {
self.fetchMessage = error.localizedDescription
}
self.fetchMessage = ""
}
}
var body: some View {
Group {
ZStack {
//this is where my issue was occurring
if(!store.fetching) {
TabView {
Tab1().tabItem {
Image(systemName: "tab-1")
Text("Tab1")
}
Tab2().tabItem {
Image(systemName: "tab-2")
Text("Tab2")
}
//Tab 3 contained my ViewWithSheet() and SheetView()
Tab3().tabItem {
Image(systemName: "tab-3")
Text("Tab3")
}
}
} else {
LoadingView(loadingMessage: $fetchMessage)
}
}
}.onAppear(perform: initializeApp)
}
}
To solve my issue, I added another variable to my DataStore called initializing, which I use to render the loading screen or the actual application views on first .onAppear event in my app. Below is an example of what my updated AppView looks like:
struct AppView: View {
#State private var fetchMessage: String = ""
#EnvironmentObject var store: DataStore()
func initializeApp() {
self.fetchMessage = "Getting App Data"
store.getData() { object, error in
if let error = error {
self.fetchMessage = error.localizedDescription
}
self.fetchMessage = ""
//set the value to false once I'm done getting my app's initial data.
self.store.initializing = false
}
}
var body: some View {
Group {
ZStack {
//now using initializing instead
if(!store.initializing) {
TabView {
Tab1().tabItem {
Image(systemName: "tab-1")
Text("Tab1")
}
Tab2().tabItem {
Image(systemName: "tab-2")
Text("Tab2")
}
//Tab 3 contained my ViewWithSheet() and SheetView()
Tab3().tabItem {
Image(systemName: "tab-3")
Text("Tab3")
}
}
} else {
LoadingView(loadingMessage: $fetchMessage)
}
}
}.onAppear(perform: initializeApp)
}
}
Try to do this on main queue explicitly
func create() {
store.createObject() { object, error in
if let _ = object {
DispatchQueue.main.async {
self.showingSheetView = false
}
}
// think also about feedback on else case as well !!
}
}
Want to see something hacky that worked for me? Disclaimer: Might not work for you and I don't necessarily recommend it. But maybe it'll help someone in a pinch.
If you add a NavigationLink AND keep your fullScreenCover, then the fullscreen cover will be able to dismiss itself like you expect.
Why does this happen when you add the NavigationLink to your View? I don't know. My guess is it creates an extra reference somewhere.
Add this to your body, and keep your sheet as it is:
NavigationLink(destination: YOURVIEW().environmentObjects(), isActive: $showingSheetView) {}
I've used this popover to show a form in my application, in this popover there is a Form with 2 sections, one with a PickerView and one with aButton; for some reason the popover is not detecting the size of the form like it does for every other view like Text and so on, I've tried setting the size manually but this is not the solution for my problem because I want it to automatically get the size
This is the problem on iPadOS
Also it looks very bad on iOS too##
Code
import SwiftUI
struct FilterView: View {
struct Category {
var name: String
var filterCategory: FilterCategory
}
#State private var category: FilterCategory = .event
let categories = [Category(name: "Eventi", filterCategory: .event), Category(name: "Compiti", filterCategory: .homework), Category(name: "Voti", filterCategory: .grade)]
var body: some View {
// NavigationView {
Form {
Section(footer: Text("Seleziona la categoria che vuoi filtrare")) {
Picker("Categoria", selection: $category) {
ForEach(categories, id: \.filterCategory) { category in
Text(category.name).tag(category.filterCategory)
}
}
}
Section {
Button("Button") {
print(category)
}
}
}
// .navigationTitle("Filtra")
// }
}
}
Popover Code
Button(action: {
self.showFilterView.toggle()
}, label: {
Image(systemName: "slider.horizontal.3")
.imageScale(.large)
})
.popover(isPresented: $showFilterView, arrowEdge: .top) {
FilterView()
}
I'm using Xcode 12 beta and iOS/iPadOS 14 on the simulators
I'm using a ForEach to parse a list of models and create a view for each of them, Each view contains a Button and a Text, the Button toggles a visibility state which should hide the text and change the Button's title (Invisible/Visible).
struct ContentView: View {
var colors: [MyColor] = [MyColor(val: "Blue"), MyColor(val: "Yellow"), MyColor(val: "Red")]
var body: some View {
ForEach(colors, id: \.uuid) { color in
ButtonColorView(color: color.val)
}
}
}
struct ButtonColorView: View {
var color: String
#State var visible = true
var body: some View {
if visible {
return AnyView( HStack {
Button("Invisible") {
self.visible.toggle()
}
Text(color)
})
} else {
return AnyView(
Button("Visible") {
self.visible.toggle()
}
)
}
}
}
class MyColor: Identifiable {
let uuid = UUID()
let val: String
init(val: String) {
self.val = val
}
}
Unfortunately it's not working, the views inside the ForEach do not change when the Button is pressed. I replaced the Foreach with ButtonColorView(color: colors[0].val) and it seems to work, so I'd say the problem is at ForEach.
I also tried breakpoints in ButtonColorView and it seems the view is called when the Button is triggered returning the right view, anyways the view does not update on screen.
So, am I using the ForEach in a wrong way ?
This problem occurs in a more complex app, but I tried to extract it in this small example. To summarize it: I need ButtonColorView to return different Views depending of its state (visibility in this case)
PS: I'm using Xcode 11 Beta 6
You are using ForEach correctly. I think it's the if statement within ButtonColorView's body that's causing problems. Try this:
struct ButtonColorView: View {
var color: String
#State var visible = true
var body: some View {
HStack {
Button(visible ? "Invisible" : "Visible") {
self.visible.toggle()
}
if visible {
Text(color)
}
}
}
}
You can also try something like this:
struct ButtonColorView: View {
var color: String
#State var visible = true
var body: some View {
HStack {
if visible {
HStack {
Button("Invisible") {
self.visible.toggle()
}
Text(color)
}
} else {
Button("Visible") {
self.visible.toggle()
}
}
}
}
}