在第一部分没有问题，但在第二部分我的动画有问题。在第一部分和第二部分使用相同的视图。
在第二部分中，文本左右移动。但我不想那样。我希望文本像第一部分一样保持稳定。
剖面视图：
(option == 1) = 图片在左边，文字在右边。（选项 == 2）= 右侧的图像，左侧的文本。
struct SectionView: View {
var title: String
var imageView: AnyView
var description: String
var option: Int
var body: some View {
Group {
if option == 1 {
HStack {
ZStack {
Rectangle()
.frame(width: 125, height: 120)
.foregroundColor(Color(UIColor.secondarySystemBackground))
.cornerRadius(40, corners: [.topRight, .bottomRight])
imageView
}
Spacer()
VStack {
Text(title)
.font(.system(size: 14, weight: .bold, design: .rounded))
Text(description)
.multilineTextAlignment(.center)
.font(.system(size: 12, weight: .medium, design: .rounded))
.padding(.trailing, 5)
}
.frame(height: 120)
.foregroundColor(Color(UIColor.label))
}
} else if option == 2 {
HStack {
VStack {
Text(title)
.font(.system(size: 14, weight: .bold, design: .rounded))
Text(description)
.multilineTextAlignment(.center)
.font(.system(size: 12, weight: .medium, design: .rounded))
.padding(.leading, 5)
}
.frame(height: 120)
.foregroundColor(Color(UIColor.label))
Spacer()
ZStack {
Rectangle()
.frame(width: 125, height: 120)
.foregroundColor(Color(UIColor.secondarySystemBackground))
.cornerRadius(40, corners: [.topLeft, .bottomLeft])
imageView
}
}
}
}
}
}
主视图模型：
我在这里添加部分。
如您所见，我在添加的两个 CategorySection 中使用了相同的视图。在第一部分中，动画正常显示，但在第二部分显示动画时，文本左右移动。这是什么原因？
class MainViewModel: ObservableObject {
@Published var section: [CategorySection] = []
init() {
getSections()
}
func getSections() {
section = [
CategorySection(title: "Trafik Levhaları", imageView: AnyView(PoliceSignsSectionIconView()), description: "Trafik levhaları trafiğe çıkan her sürücünün mutlaka dikkat etmesi gereken uyarı işaretleridir. Trafik kurallarını ve gerekliliklerini uygulama açısından önemli bir yeri olan trafik işaretleri mutlaka izlenmeli. Bu bölümde trafik levha işaretlerinin anlamlarını öğrenebilirsiniz.", option: 1, page: TrafficSignsView()),
CategorySection(title: "Polis İşaretleri", imageView: AnyView(PoliceSignsSectionIconView()), description: "Trafik polisleri gerektiği durumlarda yolda trafiğin kontrolünü sağlar. Çoğu yerde karşımıza çıkabilecek bu durumda trafik polisi işaretlerinin anlamını bilmemiz gerekmektedir. Bu bölümde polis işaretlerinin anlamlarını öğrenebilirsiniz.", option: 2, page: PoliceSignsView()),
....
]
}
}
类别截面模型：
struct CategorySection {
let id = UUID()
let title: String
let imageView: AnyView
let description: String
let option: Int
let page: Any
}
使用剖面视图：
我在这里使用我在 MainViewModel 中添加的部分。
struct MainView: View {
@ObservedObject var mainViewModel: MainViewModel = MainViewModel()
@EnvironmentObject var publishObjects: PublishObjects
var body: some View {
NavigationView {
ScrollView(showsIndicators: false) {
VStack(spacing: 30) {
ForEach(mainViewModel.section, id: \.id) { section in
NavigationLink(
destination: AnyView(_fromValue: section.page)?.navigationBarTitleDisplayMode(.inline),
label: {
SectionView(title: section.title, imageView: section.imageView, description: section.description, option: section.option)
})
}
}
}
.navigationBarTitle("Ehliyet Sınavım")
.onAppear {
}
}
.accentColor(Color(UIColor.label))
}
}
PoliceSignsSectionIconView（此处为动画）：
我在这个页面上应用了我的动画。
struct PoliceSignsSectionIconView: View {
@State var isDrawing: Bool = true
let pathBounds = UIBezierPath.calculateBounds(paths: [.policePath1, .policePath2, .policePath3, .policePath4, .policePath5, .policePath6, .policePath7, .policePath8, .policePath9, .policePath10])
var body: some View {
Text("Test Icon")
.frame(width: 75, height: 70)
.opacity(isDrawing ? 1 : 0)
.onAppear {
self.isDrawing.toggle()
}
.animation(.easeInOut(duration: 2).repeatForever(autoreverses: true))
}
}