Greetings,
I've made a View
(HistoricalView) that displays other views based on the selection of a Picker
with an Animation
. That Animation
works fine on that View
.
Here is how it looks like:
However, when I use the main View
(ContentView), which contains a custom TabView
of sorts, the Animation
does not work anymore.
Here is how it looks like:
Here is the code for it, with all the views if you need it.
ContentView
import SwiftUI
struct ContentView: View {
@ObservedObject var router = ViewRouterTabBarView()
let tabItemsPadding: CGFloat = 2
var body: some View {
ZStack(alignment: .bottom) {
VStack {
Spacer()
router.view
Spacer()
HStack {
TabItem(viewModel: .home, router: router)
.padding(tabItemsPadding)
TabItem(viewModel: .history, router: router)
.padding(tabItemsPadding)
}
// .frame(height: UIScreen.main.bounds.height / 10)
.frame(height: 75)
.frame(maxWidth: .infinity)
.padding(.horizontal, 20)
.padding(.bottom, 10)
}
} // end ZStack
.ignoresSafeArea()
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}
struct TabItem: View {
let viewModel: TabBarViewModel
@ObservedObject var router: ViewRouterTabBarView
var body: some View {
Button(action: {
withAnimation() {
router.currentItem = viewModel
}
}) {
VStack {
Image(systemName: viewModel.imageName)
.resizable()
.aspectRatio(contentMode: .fill)
.frame(width: router.currentItem == viewModel.self ? 30 : 20, height: router.currentItem == viewModel.self ? 30 : 20)
.frame(maxWidth: .infinity)
.symbolRenderingMode(.palette)
.foregroundStyle(router.currentItem == viewModel.self ? .orange: .gray, router.currentItem == viewModel.self ? .blue : .gray)
Text(viewModel.tabLabel)
.lineLimit(1)
.minimumScaleFactor(0.5)
.font(router.currentItem == viewModel.self ? .footnote : .caption2)
}
.foregroundColor(router.currentItem == viewModel.self ? .orange : .gray)
}
.padding(.top, -10)
.offset(y: router.currentItem == viewModel.self ? -20 : 0)
}
}
class ViewRouterTabBarView: ObservableObject {
@Published var currentItem: TabBarViewModel = .home
var view: some View { return currentItem.view }
}
enum TabBarViewModel: Int, CaseIterable {
case home
case history
var imageName: String {
switch self {
case .home: return "homekit" //"house.fill"
case .history: return "calendar.badge.clock"
}
}
var tabLabel: String {
switch self {
case .home: return "Home"
case .history: return "History"
}
}
@ViewBuilder
var view: some View {
switch self {
case .home:
NavigationView { HomeView() }
case .history:
NavigationView { HistoricalView() }
}
}
}
HomeView
import SwiftUI
struct HomeView: View {
var body: some View {
Text("This is HomeView")
}
}
struct HomeView_Previews: PreviewProvider {
static var previews: some View {
HomeView()
}
}
HistoricalView
import SwiftUI
enum HistoryViewModel: String, CaseIterable {
case records = "Measures"
case weights = "Weights"
}
struct HistoricalView: View {
@State private var segmentationSelection : HistoryViewModel = .records
@State var showingMeasures = true
@State var showingWeights = false
var body: some View {
VStack {
Picker("", selection: $segmentationSelection) {
ForEach(HistoryViewModel.allCases, id: \.self) { historyView in
Text(historyView.rawValue)
}
}
.pickerStyle(.segmented)
.padding(.horizontal, 100)
.onChange(of: segmentationSelection) { newValue in
showingWeights.toggle()
showingMeasures.toggle()
}
.frame(height:45)
Spacer()
if segmentationSelection == .records {
HistoricalRecordsView()
.transition(.move(edge: .leading))
.animation(.easeInOut(duration: 0.25), value: showingMeasures)
} else {
HistoricalWeightsView()
.transition(.move(edge: .trailing))
.animation(.easeInOut(duration: 0.25), value: showingWeights)
}
}
}
}
struct HistoricalView_Previews: PreviewProvider {
static var previews: some View {
HistoricalView()
}
}
HistoricalRecordsView
import SwiftUI
struct HistoricalRecordsView: View {
var body: some View {
VStack {
Spacer()
Text("This is HistoricalRecordsView")
Spacer()
}
}
}
struct HistoricalRecordsView_Previews: PreviewProvider {
static var previews: some View {
HistoricalRecordsView()
}
}
HistoricalWeightsView
import SwiftUI
struct HistoricalWeightsView: View {
var body: some View {
VStack {
Spacer()
Text("This is HistoricalWeightsView")
Spacer()
}
}
}
struct HistoricalWeightsView_Previews: PreviewProvider {
static var previews: some View {
HistoricalWeightsView()
}
}
Any idea what I need to update to make it work from ContentView as well?
Thank you :)