SwiftUI 组件大全之使用 ScrollView 和 GeometryReader 创建动画 3D卡片 滚动效果

卡片视图

从卡片开始，我们将创建一个带有颜色和数字的结构视图。这些卡片将RoundedRectangles具有填充颜色和一个Text视图，其中数字堆叠在一个ZStack.

我有一个背景属性，RoundedRectangle它采用白色作为视图。这是因为我为CardView不透明度属性值为 0.3 的对象赋予颜色。如果您使用不透明度值为 1.0 的颜色，则不需要背景颜色。

struct CardView: View {
    let num : Int
    let color : Color
    var body: some View {
        ZStack {
            RoundedRectangle(cornerRadius: 20)
                .fill(self.color)
                .shadow(color: self.color.opacity(1), radius: 10)
                .background(Color.white)
                .frame(width: 230, height: 250)
            Text("\(self.num)")
                .font(.system(size: 35))
                .bold()
        }
    }
}

内容视图

包含我们发送到的ContentView颜色数组CardView。选择您的颜色或创建另一种类型的数组并使用您将在卡片中包含的内容填充它：

 var colors = [Color.re