feat: 新增图片预览功能与现代图片选择组件

- 在EditFeedView中集成ImagePreviewPager,支持全屏图片预览。
- 更新ModernImageSelectionGrid,添加图片点击事件以触发预览。
- 移除冗余的PhotosUI导入,优化代码结构。
This commit is contained in:
edwinQQQ
2025-07-22 18:20:21 +08:00
parent 2a02553015
commit fd6e44c6f9
2 changed files with 42 additions and 5 deletions

View File

@@ -1,5 +1,7 @@
import SwiftUI
import ComposableArchitecture
import PhotosUI
//import ImagePreviewPager
struct EditFeedView: View {
let onDismiss: () -> Void
@@ -209,7 +211,6 @@ struct EditFeedView: View {
//}
// MARK: -
import PhotosUI
struct ModernImageSelectionGrid: View {
let images: [UIImage]
let selectedItems: [PhotosPickerItem]
@@ -217,21 +218,26 @@ struct ModernImageSelectionGrid: View {
let onItemsChanged: ([PhotosPickerItem]) -> Void
let onRemoveImage: (Int) -> Void
private let columns = Array(repeating: GridItem(.flexible(), spacing: 8), count: 3)
@State private var showPreview = false
@State private var previewIndex = 0
var body: some View {
// gridItemSizebody
let totalSpacing: CGFloat = 8 * 2
let totalWidth = UIScreen.main.bounds.width - 24 * 2 - totalSpacing
let gridItemSize: CGFloat = totalWidth / 3
WithPerceptionTracking {
LazyVGrid(columns: columns, spacing: 8) {
ForEach(Array(images.enumerated()), id: \ .offset) { index, image in
ForEach(Array(images.enumerated()), id: \.offset) { index, image in
ZStack(alignment: .topTrailing) {
Image(uiImage: image)
.resizable()
.aspectRatio(1, contentMode: .fill)
.aspectRatio(contentMode: .fill) // aspectFill
.frame(width: gridItemSize, height: gridItemSize)
.clipped()
.cornerRadius(12)
.onTapGesture {
previewIndex = index
showPreview = true
}
Button(action: {
onRemoveImage(index)
}) {
@@ -265,7 +271,9 @@ struct ModernImageSelectionGrid: View {
}
}
}
.fullScreenCover(isPresented: $showPreview) {
ImagePreviewPager(images: images, currentIndex: $previewIndex, onClose: { showPreview = false })
}
}
}
// gridItemSizebody
}

View File

@@ -0,0 +1,29 @@
import SwiftUI
struct ImagePreviewPager: View {
let images: [UIImage]
@Binding var currentIndex: Int
let onClose: () -> Void
var body: some View {
ZStack(alignment: .topTrailing) {
Color.black.ignoresSafeArea()
TabView(selection: $currentIndex) {
ForEach(images.indices, id: \Int.self) { idx in
Image(uiImage: images[idx])
.resizable()
.aspectRatio(contentMode: .fit)
.frame(maxWidth: .infinity, maxHeight: .infinity)
.background(Color.black)
.tag(idx)
}
}
.tabViewStyle(PageTabViewStyle(indexDisplayMode: .always))
Button(action: { onClose() }) {
Image(systemName: "xmark.circle.fill")
.font(.system(size: 32))
.foregroundColor(.white)
.padding(24)
}
}
}
}