swiftUI 画廊中间画变大自动对应位置
时间: 2023-09-03 20:16:42 浏览: 34
要实现在SwiftUI画廊中心放大的效果,并且自动对应位置,你可以使用SwiftUI的GeometryReader来获取视图的位置和大小,并根据位置和大小来缩放视图。同时,你可以使用SwiftUI的ScrollViewReader来获取ScrollView的位置和大小,并根据位置和大小来确定要滚动到哪个位置。下面是一个示例代码:
```
struct GalleryView: View {
let images = ["image1", "image2", "image3", "image4", "image5", "image6"]
@State private var selectedImage: String?
@State private var selectedImageIndex: Int?
var body: some View {
ScrollViewReader { scrollView in
ScrollView {
LazyHGrid(rows: [GridItem(.flexible())]) {
ForEach(images.indices, id: \.self) { index in
GeometryReader { geometry in
Image(images[index])
.resizable()
.scaledToFit()
.cornerRadius(10)
.scaleEffect(selectedImageIndex == index ? 1.2 : 1)
.onTapGesture {
withAnimation {
selectedImage = images[index]
selectedImageIndex = index
scrollView.scrollTo(index, anchor: .center)
}
}
.position(x: geometry.frame(in: .global).midX, y: geometry.frame(in: .global).midY)
}
.frame(width: 200, height: 200)
}
}
}
.onAppear {
scrollView.scrollTo(0, anchor: .center)
}
}
}
}
```
在这个代码中,我们使用了GeometryReader来获取每个图片的位置和大小,然后使用scaleEffect来缩放图片。当用户点击图片时,我们使用withAnimation来设置selectedImage和selectedImageIndex的值,从而触发缩放效果和滚动效果。我们还使用了position来将每个图片放置在正确的位置。最后,我们使用ScrollViewReader来获取ScrollView的位置和大小,以便在初始时将第一个图片滚动到中心位置。