【发布时间】:2020-12-04 17:29:19
【问题描述】:
我创建了自定义TabBar。
一切正常,直到我将选项卡的一个视图嵌入到 NavigationView 中,结果 - View 从左上角到右上角的外观动画(带有文本和黄色的屏幕):
tabBar是怎么做的:基本上View的body是使用GeometryReaderVStack/Zstack创建的:
var body: some View {
GeometryReader { geometry in
let height = geometry.size.height
let width = geometry.size.width
let bottomSafeAreaInset = geometry.safeAreaInsets.bottom
let topSafeAreaInset = geometry.safeAreaInsets.top
let verticalSafeAreaInset = bottomSafeAreaInset + topSafeAreaInset
VStack(spacing: 0) {
// content
mainContentBody
.frame(width: width, height: height - heightOfTabBar)
.zIndex(0)
// some calculation ...
// tabBar
Spacer(minLength: 0)
BottomBar(barButtonItems: buttons)
.frame(width: width, height: tabBarHeightWithOffset)
.background(Color.gray)
.offset(y: isMenuShown ? tabBarHeightWithOffset : 0)
.edgesIgnoringSafeArea(.all)
.opacity(isMenuShown ? 0 : 1)
.tabContainerAnimation() // simple wrapper for animation with duration
//... other view in ZStack
// button
ZStack {
overlayButton
}
.offset(y: -initialButtonOffset + additionalOffsetForButton)
.tabContainerAnimation(delay: 0.25)
}
}
}
tab1 上的视图代码:
struct Tab1View: View {
var body: some View {
NavigationView {
VStack {
Text("sdsd")
Color.orange
}
}
}
}
如果我删除NavigationView,这个效果也会被删除。所以我的问题是 - 为什么我会有这个意想不到的动画?做错了什么?
【问题讨论】:
-
你需要将动画限制在相应的状态,但我不能说在哪里,因为提供的代码是不可测试的。你会准备最小的可重现问题示例吗?
-
@Asperi 这里是完整代码gist.github.com/khorbushko/e8877081a39115f9e06ac4c32258340e(这里太长了,不能发)
标签: ios swift animation swiftui