我刚开始编程，以前做的很少，现在再次try 学习如何使用Swift/SwiftUI编码.
虽然我确实有一个简单的应用程序 idea ，我不指望它能赚到钱，但它会满足我的一个特殊需求，希望它能满足其他处于我这个位置的人的需求.
对于我的应用程序的用户界面，我想根据用户想要做什么来显示不同的视图，我的 idea 是以圆形设计呈现这些视图，并根据需要将圆圈翻过来.
我看了几个不同的"翻转动画"教程，它们似乎都只关注两个视图，并在它们之间切换(即像Flutter 克牌一样)，但我需要的是有任意数量的视图，并在任意给定的两个视图之间切换.
我以为我的最后一次try 就成功了，但结果出乎意料(对我来说)，我正在努力理解为什么.这可能是我的错，因为我使用了其中一个教程中的函数，该函数只能在两个视图之间切换.以下是我的代码(我知道它确实很乱).我知道我会做很多错事，也会有更好的方式go 做，所以请不要对我太苛刻:)
struct tealView : View {
@Binding var degree : Double
var body: some View {
ZStack{
Group {
Circle()
.frame(width: 350, height: 350)
.foregroundColor(Color(.systemTeal))
Text("Teal View!")
}
}.rotation3DEffect(Angle(degrees: degree), axis: (x: 0, y: 1, z: 0), anchor: .center, anchorZ: 0, perspective: 0.2)
}
}
struct redView : View {
@Binding var degree : Double
var body: some View {
ZStack {
Group {
Circle()
.frame(width: 350, height: 350)
.foregroundColor(Color(.systemRed))
Text("Red View!")
}
}.rotation3DEffect(Angle(degrees: degree), axis: (x: 0, y: 1, z: 0), anchor: .center, anchorZ: 0, perspective: 0.2)
}
}
struct blueView : View {
@Binding var degree : Double
var body: some View {
ZStack {
Group {
Circle()
.frame(width: 350, height: 350)
.foregroundColor(Color(.systemBlue))
Text("Blue View!")
}
}.rotation3DEffect(Angle(degrees: degree), axis: (x: 0, y: 1, z: 0), anchor: .center, anchorZ: 0, perspective: 0.2)
}
}
struct yellowView : View {
@Binding var degree : Double
var body: some View {
ZStack {
Group {
Circle()
.frame(width: 350, height: 350)
.foregroundColor(Color(.systemYellow))
Text("Yellow View!")
}
}.rotation3DEffect(Angle(degrees: degree), axis: (x: 0, y: 1, z: 0), anchor: .center, anchorZ: 0, perspective: 0.2)
}
}
struct ContentView: View {
@State var backDegree = 0.0
@State var frontDegree = -90.0
@State var isFlipped = false
@State private var tealFront = true
@State private var redFront = false
@State private var blueFront = false
@State private var yellowFront = false
@State private var tealWasFront = false
@State private var redWasFront = true
@State private var blueWasFront = false
@State private var yellowWasFront = false
let durationAndDelay : CGFloat = 0.45
func flipcard () {
isFlipped = !isFlipped
if isFlipped {
withAnimation(.easeInOut(duration: durationAndDelay)) {
backDegree = 90
}
withAnimation(.easeInOut(duration: durationAndDelay).delay(durationAndDelay)){
frontDegree = 0
}
} else {
withAnimation(.easeInOut(duration: durationAndDelay)) {
frontDegree = -90
}
withAnimation(.easeInOut(duration: durationAndDelay).delay(durationAndDelay)){
backDegree = 0
}
}
}
var body: some View {
VStack {
ZStack {
if tealFront {
tealView(degree: $frontDegree)
if yellowWasFront {
yellowView(degree: $backDegree)
} else if redWasFront {
redView(degree: $backDegree)
} else {
blueView(degree: $backDegree)
}
} else if redFront {
redView(degree: $frontDegree)
if yellowWasFront {
yellowView(degree: $backDegree)
} else if tealWasFront {
tealView(degree: $backDegree)
} else {
blueView(degree: $backDegree)
}
} else if blueFront {
blueView(degree: $frontDegree)
if yellowWasFront {
yellowView(degree: $backDegree)
} else if redWasFront {
redView(degree: $backDegree)
} else {
tealView(degree: $backDegree)
}
} else {
yellowView(degree: $frontDegree)
if tealWasFront {
tealView(degree: $backDegree)
} else if redWasFront {
redView(degree: $backDegree)
} else {
blueView(degree: $backDegree)
}
}
}
.padding(20)
HStack {
Group {
Button {
if !tealFront { tealFront = true }
if redFront {
redFront = false
redWasFront = true
blueWasFront = false
yellowWasFront = false
tealWasFront = false
}
if blueFront { blueFront = false
blueWasFront = true
redWasFront = false
yellowWasFront = false
tealWasFront = false
}
if yellowFront { yellowFront = false
yellowWasFront = true
blueWasFront = false
redWasFront = false
tealWasFront = false
}
flipcard()
} label: {
ZStack {
Circle()
.foregroundColor(Color(.systemTeal))
Text("Teal")
.foregroundColor(Color.black)
}
}
}
Group {
Button {
if !redFront { redFront = true }
if tealFront {
tealFront = false
tealWasFront = true
blueWasFront = false
yellowWasFront = false
redWasFront = false
}
if blueFront { blueFront = false
blueWasFront = true
yellowWasFront = false
tealWasFront = false
redWasFront = false
}
if yellowFront { yellowFront = false
yellowWasFront = true
blueWasFront = false
tealWasFront = false
redWasFront = false
}
flipcard()
} label: {
ZStack {
Circle()
.foregroundColor(Color(.systemRed))
Text("Red")
.foregroundColor(Color.black)
}
}
}
Group {
Button {
if !blueFront { blueFront = true }
if redFront {
redFront = false
redWasFront = true
tealWasFront = false
yellowWasFront = false
blueWasFront = false
}
if tealFront { tealFront = false
tealWasFront = true
redWasFront = false
yellowWasFront = false
blueWasFront = false
}
if yellowFront { yellowFront = false
yellowWasFront = true
tealWasFront = false
redWasFront = false
blueWasFront = false
}
flipcard()
} label: {
ZStack {
Circle()
.foregroundColor(Color(.systemBlue))
Text("Blue")
.foregroundColor(Color.black)
}
}
}
Group {
Button {
if !yellowFront { yellowFront = true }
if redFront {
redFront = false
redWasFront = true
blueWasFront = false
tealWasFront = false
yellowWasFront = false
}
if blueFront { blueFront = false
blueWasFront = true
redWasFront = false
tealWasFront = false
yellowWasFront = false
}
if tealFront { tealFront = false
tealWasFront = true
blueWasFront = false
redWasFront = false
yellowWasFront = false
}
flipcard()
} label: {
ZStack {
Circle()
.foregroundColor(Color(.systemYellow))
Text("Yellow")
.foregroundColor(Color.black)
}
}
}
}
}
}
}
struct ContentView_Previews: PreviewProvider {
static var previews: some View {
ContentView()
}
}