scrolling automatically to a particular item with scrollview reader

This commit is contained in:
talksik
2021-12-16 16:44:53 -08:00
parent 595e49983a
commit 23e1368af4
@@ -66,6 +66,7 @@ struct InnerCircleView: View {
private static let spacingBetweenColumns: CGFloat = 16 private static let spacingBetweenColumns: CGFloat = 16
private static let spacingBetweenRows: CGFloat = 16 private static let spacingBetweenRows: CGFloat = 16
private static let totalColumns: Int = 10 private static let totalColumns: Int = 10
private var numberOfItems: Int = 59
let frameSize: CGPoint = CGPoint(x: UIScreen.main.bounds.size.width*0.5,y: UIScreen.main.bounds.size.height*0.5) let frameSize: CGPoint = CGPoint(x: UIScreen.main.bounds.size.width*0.5,y: UIScreen.main.bounds.size.height*0.5)
@@ -87,6 +88,7 @@ struct InnerCircleView: View {
// .frame(maxWidth: .infinity) // .frame(maxWidth: .infinity)
// .blur(radius: 8) // .blur(radius: 8)
ScrollViewReader {scrollReaderValue in
ScrollView([.horizontal, .vertical], showsIndicators: false) { ScrollView([.horizontal, .vertical], showsIndicators: false) {
LazyVGrid( LazyVGrid(
columns: gridItems, columns: gridItems,
@@ -104,14 +106,14 @@ struct InnerCircleView: View {
.background(Color.white.opacity(0.5)) .background(Color.white.opacity(0.5))
.cornerRadius(100) .cornerRadius(100)
.shadow(color: Color.black.opacity(0.2), radius: 10, x: 0, y: 20) .shadow(color: Color.black.opacity(0.2), radius: 10, x: 0, y: 20)
.scaleEffect( // .scaleEffect(
scale( // scale(
x: isEvenRow(value) ? gridProxy.frame(in: .global).midX + gridProxy.size.width/2 : // x: isEvenRow(value) ? gridProxy.frame(in: .global).midX + gridProxy.size.width/2 :
gridProxy.frame(in: .global).midX, // gridProxy.frame(in: .global).midX,
y: gridProxy.frame(in: .global).midY, // y: gridProxy.frame(in: .global).midY,
value: value%43 // value: value%43
) // )
) // )
.offset( .offset(
x: honeycombOffSetX(value), x: honeycombOffSetX(value),
y: 0 y: 0
@@ -133,13 +135,18 @@ struct InnerCircleView: View {
} }
} }
.animation(Animation.spring(), value: selectedUserIndex) .animation(Animation.spring(), value: selectedUserIndex)
} // geometry reader
} .id(value) // id for scrollviewreader
.frame(height: Self.size) .frame(height: Self.size)
} }
} // lazyvgrid } // lazyvgrid
.padding(.trailing, Self.size / 2 + Self.spacingBetweenColumns / 2) .padding(.trailing, Self.size / 2 + Self.spacingBetweenColumns / 2)
}// scrollview }// scrollview
.onAppear {
scrollReaderValue.scrollTo(self.numberOfItems / 2)
}
} // scrollview reader
// navigation/footer // navigation/footer