Swiftui component encyclopedia creating animated 3D card scrolling effects using Scrollview and geometryreader

Card view

Start with the card , We will create a structure view with colors and numbers . These cards will RoundedRectangles Has a fill color and a Text View , The numbers are stacked in one ZStack.

I have a background attribute ,RoundedRectangle It uses white as the view . This is because I am for CardView The opacity attribute value is 0.3 Give color to the object . If you use an opacity value of 1.0 The color of the , No background color is required .

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()
        }
    }
}

Content view

Include the ContentView Color array CardView. Choose your color or create another type of array and fill it with what you will include in the card ：

 var colors = [Color.re