feat: 新增图片预览功能与现代图片选择组件
- 在EditFeedView中集成ImagePreviewPager,支持全屏图片预览。 - 更新ModernImageSelectionGrid,添加图片点击事件以触发预览。 - 移除冗余的PhotosUI导入,优化代码结构。
This commit is contained in:
@@ -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 {
|
||||
// 将gridItemSize移入body内部变量
|
||||
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 })
|
||||
}
|
||||
}
|
||||
}
|
||||
// 移除gridItemSize属性,全部逻辑已移入body
|
||||
}
|
||||
|
29
yana/Views/ImagePreviewPager.swift
Normal file
29
yana/Views/ImagePreviewPager.swift
Normal 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)
|
||||
}
|
||||
}
|
||||
}
|
||||
}
|
Reference in New Issue
Block a user