Centring large views inside a ScrollView to avoid split views

by bhagyash ingale   Last Updated August 14, 2019 18:26 PM

I'm scrolling large views(screen width) horizontally inside a scrollview. I would like the views to automatically center and not be in a scenario where the two views are both partially visible.

I'm already using GeometryReader's data to perform 3D rotation animation for the views. I've tried to add the UIScreen's position to the card.position( ) with a ternary operator.

struct WorkoutCard: View {

var numberOfWorkouts : [Int] = [0, 1, 2, 3]

var deviceCentre = (CGPoint(x: CGFloat(UIScreen.main.bounds.midX), y: CGFloat(UIScreen.main.bounds.midY)))

var body: some View {
        ZStack {

    ScrollView (.horizontal, showsIndicators: false) {

        HStack {


   ForEach(self.numberOfWorkouts.reversed(), id: \.self) { index in

                    GeometryReader { geometry in

                        Card(index).position(geometry.frame(in: .global).maxY == 0 ? self.deviceCentre : self.position() as! CGPoint )
                            .rotation3DEffect(Angle(degrees: Double(geometry.frame(in: .global).minX) / 4 ) ,
                                                     axis: (x: 0, y: 10 , z: 0))

                        }.frame( width: 414, height : 896)

            }
}

    }
          }.edgesIgnoringSafeArea(.all)
}
 }

I want the card view to center itself when not scrolling to avoid 2 card views showing.



Related Questions


Difference between SceneDelegate and AppDelegate

Updated June 07, 2019 16:26 PM

Failed to build active scheme on Xcode Previews

Updated June 15, 2019 16:26 PM

SwiftUI Image component shrinks when resized

Updated June 23, 2019 19:26 PM