862 lines
31 KiB
Swift
862 lines
31 KiB
Swift
import SwiftUI
|
||
import AVFoundation
|
||
|
||
extension Notification.Name {
|
||
static let didAddFirstMedia = Notification.Name("didAddFirstMedia")
|
||
}
|
||
/// 主上传视图
|
||
/// 提供媒体选择、预览和上传功能
|
||
@MainActor
|
||
struct MediaUploadView: View {
|
||
// MARK: - 属性
|
||
|
||
/// 上传管理器，负责处理上传逻辑
|
||
@StateObject private var uploadManager = MediaUploadManager()
|
||
/// 控制媒体选择器的显示/隐藏
|
||
@State private var showMediaPicker = false
|
||
/// 当前选中的媒体项
|
||
@State private var selectedMedia: MediaType? = nil
|
||
/// 当前选中的媒体索引集合
|
||
@State private var selectedIndices: Set<Int> = []
|
||
@State private var mediaPickerSelection: [MediaType] = [] // 添加这个状态变量
|
||
|
||
// MARK: - 视图主体
|
||
|
||
var body: some View {
|
||
VStack(spacing: 0) {
|
||
// 顶部导航栏
|
||
topNavigationBar
|
||
|
||
// 上传提示信息
|
||
uploadHintView
|
||
Spacer()
|
||
.frame(height: uploadManager.selectedMedia.isEmpty ? 80 : 40)
|
||
// 主上传区域
|
||
MainUploadArea(
|
||
uploadManager: uploadManager,
|
||
showMediaPicker: $showMediaPicker,
|
||
selectedMedia: $selectedMedia
|
||
)
|
||
.id("mainUploadArea\(uploadManager.selectedMedia.count)")
|
||
|
||
Spacer()
|
||
|
||
// 继续按钮
|
||
continueButton
|
||
.padding(.bottom, 24)
|
||
}
|
||
.background(Color.themeTextWhiteSecondary)
|
||
.navigationBarTitleDisplayMode(.inline)
|
||
.navigationBarBackButtonHidden(true)
|
||
.sheet(isPresented: $showMediaPicker) {
|
||
// 媒体选择器
|
||
mediaPickerView
|
||
}
|
||
}
|
||
|
||
// MARK: - 子视图
|
||
|
||
/// 顶部导航栏
|
||
private var topNavigationBar: some View {
|
||
HStack {
|
||
// 返回按钮
|
||
Button(action: { Router.shared.pop() }) {
|
||
Image(systemName: "chevron.left")
|
||
.font(.system(size: 17, weight: .semibold))
|
||
.foregroundColor(.themeTextMessageMain)
|
||
}
|
||
.padding(.leading, 16)
|
||
|
||
Spacer()
|
||
|
||
// 标题
|
||
Text("Complete Your Profile")
|
||
.font(Typography.font(for: .title2, family: .quicksandBold))
|
||
.foregroundColor(.themeTextMessageMain)
|
||
|
||
Spacer()
|
||
|
||
// 右侧占位视图（保持布局平衡）
|
||
Color.clear
|
||
.frame(width: 24, height: 24)
|
||
.padding(.trailing, 16)
|
||
}
|
||
.background(Color.themeTextWhiteSecondary)
|
||
.padding(.horizontal)
|
||
.zIndex(1) // 确保导航栏显示在最上层
|
||
}
|
||
|
||
/// 上传提示视图
|
||
private var uploadHintView: some View {
|
||
HStack {
|
||
Text("The upload process will take approximately 2 minutes. Thank you for your patience.")
|
||
.font(.caption)
|
||
.foregroundColor(.black)
|
||
.frame(maxWidth: .infinity, alignment: .leading)
|
||
.padding(3)
|
||
.background(
|
||
LinearGradient(
|
||
gradient: Gradient(colors: [
|
||
Color(red: 1.0, green: 0.97, blue: 0.87),
|
||
.white,
|
||
Color(red: 1.0, green: 0.97, blue: 0.84)
|
||
]),
|
||
startPoint: .topLeading,
|
||
endPoint: .bottomTrailing
|
||
)
|
||
.cornerRadius(8)
|
||
)
|
||
.padding(.horizontal)
|
||
}
|
||
.padding(.vertical, 8)
|
||
}
|
||
|
||
/// 继续按钮
|
||
private var continueButton: some View {
|
||
Button(action: {
|
||
// 处理继续操作
|
||
Router.shared.navigate(to: .blindBox(mediaType: .video))
|
||
}) {
|
||
Text("Continue")
|
||
.font(.headline)
|
||
.foregroundColor(uploadManager.selectedMedia.isEmpty ? Color.themeTextMessage : Color.themeTextMessageMain)
|
||
.frame(maxWidth: .infinity)
|
||
.frame(height: 56)
|
||
.background(uploadManager.selectedMedia.isEmpty ? Color.white : Color.themePrimary)
|
||
.cornerRadius(28)
|
||
.padding(.horizontal, 24)
|
||
}
|
||
.buttonStyle(PlainButtonStyle())
|
||
.disabled(uploadManager.selectedMedia.isEmpty)
|
||
}
|
||
|
||
/// 媒体选择器视图
|
||
private var mediaPickerView: some View {
|
||
MediaPicker(
|
||
selectedMedia: Binding(
|
||
get: { mediaPickerSelection },
|
||
set: { newSelections in
|
||
// 只处理尚未选择的媒体项
|
||
let newItems = newSelections.filter { newItem in
|
||
!uploadManager.selectedMedia.contains { $0.id == newItem.id }
|
||
}
|
||
|
||
if !newItems.isEmpty {
|
||
// 将新项添加到现有选择的开头
|
||
let newMedia = newItems + uploadManager.selectedMedia
|
||
uploadManager.clearAllMedia()
|
||
uploadManager.addMedia(newMedia)
|
||
|
||
// 如果没有选中的媒体，则选中第一个新增的
|
||
if selectedIndices.isEmpty {
|
||
selectedIndices = [0] // 选择第一个新增项的索引
|
||
selectedMedia = newItems.first
|
||
}
|
||
|
||
// 开始上传新添加的媒体
|
||
uploadManager.startUpload()
|
||
}
|
||
|
||
// 重置选择
|
||
mediaPickerSelection = []
|
||
}
|
||
),
|
||
imageSelectionLimit: max(0, 20 - uploadManager.selectedMedia.filter {
|
||
if case .image = $0 { return true }
|
||
return false
|
||
}.count),
|
||
videoSelectionLimit: max(0, 5 - uploadManager.selectedMedia.filter {
|
||
if case .video = $0 { return true }
|
||
return false
|
||
}.count),
|
||
selectionMode: .multiple,
|
||
onDismiss: handleMediaPickerDismiss,
|
||
onUploadProgress: { index, progress in
|
||
print("文件 \(index) 上传进度: \(progress * 100)%")
|
||
}
|
||
)
|
||
.onAppear {
|
||
// 重置选择状态当选择器出现时
|
||
mediaPickerSelection = []
|
||
}
|
||
}
|
||
|
||
// MARK: - 私有方法
|
||
|
||
/// 处理媒体选择器关闭事件
|
||
private func handleMediaPickerDismiss() {
|
||
showMediaPicker = false
|
||
print("媒体选择器关闭 - 开始处理")
|
||
|
||
// 如果有选中的媒体，开始上传
|
||
if !uploadManager.selectedMedia.isEmpty {
|
||
// 不需要在这里开始上传，因为handleMediaChange会处理
|
||
}
|
||
}
|
||
|
||
/// 处理媒体变化
|
||
/// - Parameters:
|
||
/// - newMedia: 新的媒体数组
|
||
/// - oldMedia: 旧的媒体数组
|
||
private func handleMediaChange(_ newMedia: [MediaType], oldMedia: [MediaType]) {
|
||
print("开始处理媒体变化，新数量: \(newMedia.count), 原数量: \(oldMedia.count)")
|
||
|
||
// 如果没有变化，直接返回
|
||
guard newMedia != oldMedia else {
|
||
print("媒体未发生变化，跳过处理")
|
||
return
|
||
}
|
||
|
||
// 在后台线程处理媒体变化
|
||
DispatchQueue.global(qos: .userInitiated).async { [self] in
|
||
// 找出新增的媒体（在newMedia中但不在oldMedia中的项）
|
||
let newItems = newMedia.filter { newItem in
|
||
!oldMedia.contains { $0.id == newItem.id }
|
||
}
|
||
|
||
print("检测到\(newItems.count)个新增媒体项")
|
||
|
||
// 如果有新增媒体
|
||
if !newItems.isEmpty {
|
||
print("准备添加\(newItems.count)个新项...")
|
||
|
||
// 在主线程更新UI
|
||
DispatchQueue.main.async { [self] in
|
||
// 创建新的数组，包含原有媒体和新媒体
|
||
var updatedMedia = uploadManager.selectedMedia
|
||
updatedMedia.append(contentsOf: newItems)
|
||
|
||
// 更新选中的媒体
|
||
uploadManager.clearAllMedia()
|
||
uploadManager.addMedia(updatedMedia)
|
||
|
||
// 如果当前没有选中的媒体，则选中第一个新增的媒体
|
||
if selectedIndices.isEmpty && !newItems.isEmpty {
|
||
selectedIndices = [oldMedia.count] // 选择第一个新增项的索引
|
||
selectedMedia = newItems.first
|
||
}
|
||
|
||
// 开始上传新添加的媒体
|
||
uploadManager.startUpload()
|
||
print("媒体添加完成，总数量: \(uploadManager.selectedMedia.count)")
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
/// 检查是否有正在上传的文件
|
||
/// - Returns: 是否正在上传
|
||
private func isUploading() -> Bool {
|
||
return uploadManager.uploadStatus.values.contains { status in
|
||
if case .uploading = status { return true }
|
||
return false
|
||
}
|
||
}
|
||
}
|
||
|
||
// MARK: - 主上传区域
|
||
|
||
/// 主上传区域视图
|
||
/// 显示上传提示、媒体预览和添加更多按钮
|
||
struct MainUploadArea: View {
|
||
// MARK: - 属性
|
||
|
||
/// 上传管理器
|
||
@ObservedObject var uploadManager: MediaUploadManager
|
||
/// 控制媒体选择器的显示/隐藏
|
||
@Binding var showMediaPicker: Bool
|
||
/// 当前选中的媒体
|
||
@Binding var selectedMedia: MediaType?
|
||
|
||
// MARK: - 视图主体
|
||
|
||
var body: some View {
|
||
VStack() {
|
||
Spacer()
|
||
.frame(height: 30)
|
||
// 标题
|
||
Text("Click to upload 20 images and 5 videos to generate your next blind box.")
|
||
.font(Typography.font(for: .title2, family: .quicksandBold))
|
||
.fontWeight(.bold)
|
||
.foregroundColor(.black)
|
||
.multilineTextAlignment(.center)
|
||
.padding(.horizontal)
|
||
Spacer()
|
||
.frame(height: 50)
|
||
// 主显示区域
|
||
if let mediaToDisplay = selectedMedia ?? uploadManager.selectedMedia.first {
|
||
MediaPreview(media: mediaToDisplay, uploadManager: uploadManager)
|
||
.id(mediaToDisplay.id)
|
||
.frame(width: 225, height: 225)
|
||
.overlay(
|
||
RoundedRectangle(cornerRadius: 16)
|
||
.stroke(Color.themePrimary, lineWidth: 5)
|
||
)
|
||
.cornerRadius(16)
|
||
.shadow(radius: 4)
|
||
.padding(.horizontal)
|
||
.transition(.opacity)
|
||
} else {
|
||
UploadPromptView(showMediaPicker: $showMediaPicker)
|
||
}
|
||
// 媒体预览区域
|
||
mediaPreviewSection
|
||
Spacer()
|
||
.frame(height: 10)
|
||
}
|
||
.onAppear {
|
||
print("MainUploadArea appeared")
|
||
print("Selected media count: \(uploadManager.selectedMedia.count)")
|
||
|
||
if selectedMedia == nil, let firstMedia = uploadManager.selectedMedia.first {
|
||
print("Selecting first media: \(firstMedia.id)")
|
||
selectedMedia = firstMedia
|
||
}
|
||
}
|
||
.onReceive(NotificationCenter.default.publisher(for: .didAddFirstMedia)) { notification in
|
||
if let media = notification.userInfo?["media"] as? MediaType, selectedMedia == nil {
|
||
selectedMedia = media
|
||
}
|
||
}
|
||
.background(Color.white)
|
||
.cornerRadius(18)
|
||
.animation(.default, value: selectedMedia?.id)
|
||
}
|
||
|
||
// MARK: - 子视图
|
||
|
||
/// 媒体预览区域
|
||
private var mediaPreviewSection: some View {
|
||
Group {
|
||
if !uploadManager.selectedMedia.isEmpty {
|
||
VStack(spacing: 4) {
|
||
// 横向滚动的缩略图列表
|
||
ScrollView(.horizontal, showsIndicators: false) {
|
||
LazyHStack(spacing: 10) {
|
||
ForEach(Array(uploadManager.selectedMedia.enumerated()), id: \.element.id) { index, media in
|
||
mediaItemView(for: media, at: index)
|
||
}
|
||
// 当没有选择媒体时显示添加更多按钮
|
||
if !uploadManager.selectedMedia.isEmpty {
|
||
addMoreButton
|
||
}
|
||
}
|
||
.padding(.horizontal)
|
||
}
|
||
.frame(height: 70)
|
||
}
|
||
.padding(.top, 10)
|
||
}
|
||
}
|
||
}
|
||
|
||
/// 单个媒体项视图
|
||
/// - Parameters:
|
||
/// - media: 媒体项
|
||
/// - index: 索引
|
||
/// - Returns: 媒体项视图
|
||
private func mediaItemView(for media: MediaType, at index: Int) -> some View {
|
||
ZStack(alignment: .topTrailing) {
|
||
VStack(spacing: 4) {
|
||
// 媒体预览
|
||
MediaPreview(media: media, uploadManager: uploadManager)
|
||
.frame(width: 58, height: 58)
|
||
.cornerRadius(8)
|
||
.shadow(radius: 1)
|
||
.overlay(
|
||
// 左上角序号
|
||
ZStack(alignment: .topLeading) {
|
||
// 左上角序号
|
||
ZStack(alignment: .topLeading) {
|
||
Path { path in
|
||
let radius: CGFloat = 4
|
||
let width: CGFloat = 14
|
||
let height: CGFloat = 10
|
||
|
||
// 从左上角开始（带圆角）
|
||
path.move(to: CGPoint(x: 0, y: radius))
|
||
path.addQuadCurve(to: CGPoint(x: radius, y: 0),
|
||
control: CGPoint(x: 0, y: 0))
|
||
|
||
// 上边缘（右上角保持直角）
|
||
path.addLine(to: CGPoint(x: width, y: 0))
|
||
|
||
// 右边缘（右下角保持直角）
|
||
path.addLine(to: CGPoint(x: width, y: height - radius))
|
||
|
||
// 右下角圆角
|
||
path.addQuadCurve(to: CGPoint(x: width - radius, y: height),
|
||
control: CGPoint(x: width, y: height))
|
||
|
||
// 下边缘（左下角保持直角）
|
||
path.addLine(to: CGPoint(x: 0, y: height))
|
||
|
||
// 闭合路径
|
||
path.closeSubpath()
|
||
}
|
||
.fill(Color(hex: "BEBEBE").opacity(0.6))
|
||
|
||
Text("\(index + 1)")
|
||
.font(.system(size: 8, weight: .bold))
|
||
.foregroundColor(.black)
|
||
.frame(width: 14, height: 10)
|
||
.offset(y: -1)
|
||
}
|
||
.frame(width: 14, height: 10, alignment: .topLeading)
|
||
.padding([.top, .leading], 2)
|
||
|
||
// 右下角视频时长
|
||
if case .video(let url, _) = media, let videoURL = url as? URL {
|
||
VStack {
|
||
Spacer()
|
||
HStack {
|
||
Spacer()
|
||
Text(getVideoDuration(url: videoURL))
|
||
.font(.system(size: 8, weight: .bold))
|
||
.foregroundColor(.black)
|
||
.padding(.horizontal, 4)
|
||
.frame(height: 10)
|
||
.background(Color(hex: "BEBEBE").opacity(0.6))
|
||
.cornerRadius(2)
|
||
}
|
||
.padding([.trailing, .bottom], 0)
|
||
}
|
||
} else {
|
||
VStack {
|
||
Spacer()
|
||
HStack {
|
||
Spacer()
|
||
Text("")
|
||
.font(.system(size: 8, weight: .bold))
|
||
.foregroundColor(.black)
|
||
.padding(.horizontal, 4)
|
||
.frame(height: 10)
|
||
.background(Color(hex: "BEBEBE").opacity(0.6))
|
||
.cornerRadius(2)
|
||
}
|
||
.padding([.trailing, .bottom], 0)
|
||
}
|
||
.opacity(0)
|
||
}
|
||
}
|
||
)
|
||
// 在 mediaItemView 函数中，更新 onTapGesture：
|
||
// .onTapGesture {
|
||
// print("Tapped media at index: \(index)") // 添加日志
|
||
// withAnimation {
|
||
// selectedIndices = [index]
|
||
// selectedMedia = media
|
||
// }
|
||
// }
|
||
// .contentShape(Rectangle()) // 确保整个区域都可点击
|
||
// 在 mediaItemView 中，更新 onTapGesture：
|
||
.onTapGesture {
|
||
print("点击了媒体项，索引: \(index)")
|
||
withAnimation {
|
||
selectedMedia = media // 直接更新选中的媒体
|
||
}
|
||
}
|
||
.contentShape(Rectangle()) // 确保整个区域都可点击
|
||
}
|
||
|
||
// 右上角关闭按钮
|
||
Button(action: {
|
||
// 使用公共API移除媒体
|
||
uploadManager.removeMedia(id: media.id)
|
||
|
||
// 重置选中的媒体
|
||
if selectedMedia == media {
|
||
selectedMedia = nil
|
||
}
|
||
}) {
|
||
Image(systemName: "xmark")
|
||
.font(.system(size: 10, weight: .bold))
|
||
.foregroundColor(.black)
|
||
.frame(width: 12, height: 12)
|
||
.background(
|
||
Circle()
|
||
.fill(Color(hex: "BEBEBE").opacity(0.6))
|
||
.frame(width: 12, height: 12)
|
||
)
|
||
}
|
||
.offset(x: 6, y: -6) // 调整位置，确保完全可见
|
||
}
|
||
.padding(.horizontal,4)
|
||
.contentShape(Rectangle())
|
||
}
|
||
|
||
/// 上传状态视图
|
||
/// - Parameter index: 媒体索引
|
||
/// - Returns: 状态视图
|
||
@ViewBuilder
|
||
private func uploadStatusView(for index: Int) -> some View {
|
||
if let status = uploadManager.uploadStatus["\(index)"] {
|
||
switch status {
|
||
case .uploading(let progress):
|
||
// 上传中，显示进度条
|
||
VStack(alignment: .center, spacing: 2) {
|
||
Text("\(Int(progress * 100))%")
|
||
.font(.caption2)
|
||
.foregroundColor(.gray)
|
||
ProgressView(value: progress, total: 1.0)
|
||
.progressViewStyle(LinearProgressViewStyle())
|
||
.frame(height: 3)
|
||
.padding(.horizontal, 4)
|
||
.padding(.bottom, 2)
|
||
}
|
||
.frame(width: 60)
|
||
|
||
case .completed:
|
||
// 上传完成，显示完成图标
|
||
Image(systemName: "checkmark.circle.fill")
|
||
.font(.caption)
|
||
.foregroundColor(.green)
|
||
|
||
case .failed:
|
||
// 上传失败，显示错误图标
|
||
Image(systemName: "exclamationmark.triangle.fill")
|
||
.font(.caption)
|
||
.foregroundColor(.red)
|
||
|
||
default:
|
||
EmptyView()
|
||
}
|
||
}
|
||
}
|
||
|
||
/// 添加更多按钮
|
||
private var addMoreButton: some View {
|
||
Button(action: { showMediaPicker = true }) {
|
||
Image(systemName: "plus")
|
||
.font(.system(size: 8, weight: .bold))
|
||
.foregroundColor(.black)
|
||
.frame(width: 58, height: 58)
|
||
.background(Color.white)
|
||
.cornerRadius(8)
|
||
.overlay(
|
||
RoundedRectangle(cornerRadius: 8)
|
||
.strokeBorder(style: StrokeStyle(
|
||
lineWidth: 2,
|
||
dash: [4, 4]
|
||
))
|
||
.foregroundColor(Color.themePrimary)
|
||
)
|
||
}
|
||
}
|
||
}
|
||
|
||
// MARK: - 上传提示视图
|
||
|
||
/// 上传提示视图
|
||
/// 显示上传区域的占位图和提示
|
||
struct UploadPromptView: View {
|
||
/// 控制媒体选择器的显示/隐藏
|
||
@Binding var showMediaPicker: Bool
|
||
|
||
var body: some View {
|
||
Button(action: { showMediaPicker = true }) {
|
||
// 上传图标
|
||
SVGImage(svgName: "IP")
|
||
.frame(width: 225, height: 225)
|
||
.contentShape(Rectangle())
|
||
.overlay(
|
||
ZStack {
|
||
RoundedRectangle(cornerRadius: 20)
|
||
.stroke(style: StrokeStyle(
|
||
lineWidth: 5,
|
||
lineCap: .round,
|
||
dash: [12, 8]
|
||
))
|
||
.foregroundColor(Color.themePrimary)
|
||
|
||
// Add plus icon in the center
|
||
Image(systemName: "plus")
|
||
.font(.system(size: 32, weight: .bold))
|
||
.foregroundColor(.black)
|
||
}
|
||
)
|
||
}
|
||
}
|
||
}
|
||
|
||
// MARK: - 媒体预览视图
|
||
|
||
/// 媒体预览视图
|
||
/// 显示图片或视频的预览图
|
||
struct MediaPreview: View {
|
||
// MARK: - 属性
|
||
|
||
/// 图片处理队列
|
||
private let imageProcessingQueue = DispatchQueue(
|
||
label: "com.yourapp.imageprocessing",
|
||
qos: .userInitiated,
|
||
attributes: .concurrent
|
||
)
|
||
|
||
/// 媒体类型
|
||
let media: MediaType
|
||
/// 上传管理器
|
||
@ObservedObject var uploadManager: MediaUploadManager
|
||
|
||
// MARK: - 状态
|
||
|
||
/// 加载的图片
|
||
@State private var image: UIImage?
|
||
|
||
/// 加载状态
|
||
enum LoadState {
|
||
/// 加载成功
|
||
case success(UIImage)
|
||
/// 加载失败
|
||
case failure(Error)
|
||
}
|
||
|
||
/// 当前加载状态
|
||
@State private var loadState: LoadState?
|
||
|
||
// MARK: - 图片缓存
|
||
|
||
/// 图片缓存
|
||
private struct ImageCache {
|
||
static let shared = NSCache<NSString, UIImage>()
|
||
private static var cacheKeys = Set<String>()
|
||
|
||
static func setImage(_ image: UIImage, forKey key: String) {
|
||
shared.setObject(image, forKey: key as NSString)
|
||
cacheKeys.insert(key)
|
||
}
|
||
|
||
static func getImage(forKey key: String) -> UIImage? {
|
||
return shared.object(forKey: key as NSString)
|
||
}
|
||
|
||
static func clearCache() {
|
||
cacheKeys.forEach { key in
|
||
shared.removeObject(forKey: key as NSString)
|
||
}
|
||
cacheKeys.removeAll()
|
||
}
|
||
}
|
||
|
||
// MARK: - 初始化
|
||
|
||
init(media: MediaType, uploadManager: MediaUploadManager) {
|
||
self.media = media
|
||
self.uploadManager = uploadManager
|
||
|
||
// 尝试从缓存加载图片
|
||
let cacheKey = "\(media.id)" as NSString
|
||
if let cachedImage = ImageCache.shared.object(forKey: cacheKey) {
|
||
self._image = State(initialValue: cachedImage)
|
||
self._loadState = State(initialValue: .success(cachedImage))
|
||
}
|
||
}
|
||
|
||
// MARK: - 计算属性
|
||
|
||
/// 上传进度
|
||
private var uploadProgress: Double {
|
||
guard let index = uploadManager.selectedMedia.firstIndex(where: { $0.id == media.id }) else {
|
||
return 0
|
||
}
|
||
|
||
if case .uploading(let progress) = uploadManager.uploadStatus["\(index)"] {
|
||
return progress
|
||
} else if case .completed = uploadManager.uploadStatus["\(index)"] {
|
||
return 1.0
|
||
}
|
||
return 0
|
||
}
|
||
|
||
/// 是否正在上传
|
||
private var isUploading: Bool {
|
||
guard let index = uploadManager.selectedMedia.firstIndex(where: { $0.id == media.id }) else {
|
||
return false
|
||
}
|
||
|
||
if case .uploading = uploadManager.uploadStatus["\(index)"] {
|
||
return true
|
||
}
|
||
return false
|
||
}
|
||
|
||
// MARK: - 视图主体
|
||
|
||
var body: some View {
|
||
ZStack {
|
||
// 1. 显示图片或视频缩略图
|
||
if let image = image {
|
||
ZStack(alignment: .bottomTrailing) {
|
||
loadedImageView(image)
|
||
}
|
||
|
||
// 上传进度条（仅当正在上传且进度小于100%时显示）
|
||
if isUploading && uploadProgress < 1.0 {
|
||
VStack {
|
||
Spacer()
|
||
ProgressView(value: uploadProgress, total: 1.0)
|
||
.progressViewStyle(LinearProgressViewStyle(tint: .white))
|
||
.frame(height: 2)
|
||
.padding(.horizontal, 4)
|
||
.padding(.bottom, 2)
|
||
}
|
||
}
|
||
} else {
|
||
// 2. 加载中的占位图
|
||
placeholderView
|
||
.onAppear {
|
||
loadImage()
|
||
}
|
||
}
|
||
|
||
// 3. 显示错误状态（如果有）
|
||
if case .failure(let error) = loadState, image == nil {
|
||
errorView(error: error)
|
||
}
|
||
}
|
||
.aspectRatio(1, contentMode: .fill)
|
||
.clipped()
|
||
.cornerRadius(8)
|
||
.overlay(
|
||
RoundedRectangle(cornerRadius: 8)
|
||
.stroke(Color.themePrimary.opacity(0.3), lineWidth: 1)
|
||
)
|
||
}
|
||
|
||
// 加载中的占位图
|
||
private var placeholderView: some View {
|
||
Color.gray.opacity(0.1)
|
||
}
|
||
|
||
// 加载完成的图片视图
|
||
private func loadedImageView(_ image: UIImage) -> some View {
|
||
Image(uiImage: image)
|
||
.resizable()
|
||
.scaledToFill()
|
||
.transition(.opacity.animation(.easeInOut(duration: 0.2)))
|
||
}
|
||
|
||
/// 错误视图
|
||
private func errorView(error: Error) -> some View {
|
||
VStack(spacing: 8) {
|
||
Image(systemName: "exclamationmark.triangle")
|
||
.font(.system(size: 20))
|
||
.foregroundColor(.orange)
|
||
|
||
Text("加载失败")
|
||
.font(.caption2)
|
||
.foregroundColor(.secondary)
|
||
|
||
Button(action: {
|
||
loadState = nil
|
||
loadImage()
|
||
}) {
|
||
Image(systemName: "arrow.clockwise")
|
||
.font(.caption)
|
||
.padding(4)
|
||
.background(Color.gray.opacity(0.2))
|
||
.clipShape(Circle())
|
||
}
|
||
.padding(.top, 4)
|
||
}
|
||
.frame(maxWidth: .infinity, maxHeight: .infinity)
|
||
.background(Color.gray.opacity(0.1))
|
||
.cornerRadius(8)
|
||
}
|
||
|
||
// MARK: - 私有方法
|
||
|
||
/// 加载图片
|
||
private func loadImage() {
|
||
let cacheKey = "\(media.id)" as NSString
|
||
|
||
// 检查缓存
|
||
if let cachedImage = ImageCache.getImage(forKey: cacheKey as String) {
|
||
image = cachedImage
|
||
loadState = .success(cachedImage)
|
||
return
|
||
}
|
||
|
||
// 使用专用的图片处理队列
|
||
imageProcessingQueue.async {
|
||
do {
|
||
let imageToCache: UIImage
|
||
|
||
switch media {
|
||
case .image(let uiImage):
|
||
imageToCache = uiImage
|
||
|
||
case .video(_, let thumbnail):
|
||
guard let thumbnail = thumbnail else {
|
||
throw NSError(
|
||
domain: "com.yourapp.media",
|
||
code: -1,
|
||
userInfo: [NSLocalizedDescriptionKey: "视频缩略图加载失败"]
|
||
)
|
||
}
|
||
imageToCache = thumbnail
|
||
}
|
||
|
||
// 缓存图片
|
||
ImageCache.setImage(imageToCache, forKey: cacheKey as String)
|
||
|
||
// 更新UI
|
||
DispatchQueue.main.async {
|
||
withAnimation(.easeInOut(duration: 0.2)) {
|
||
image = imageToCache
|
||
loadState = .success(imageToCache)
|
||
}
|
||
}
|
||
|
||
} catch {
|
||
print("图片加载失败: \(error.localizedDescription)")
|
||
DispatchQueue.main.async {
|
||
loadState = .failure(error)
|
||
}
|
||
}
|
||
}
|
||
}
|
||
}
|
||
|
||
private func getVideoDuration(url: URL) -> String {
|
||
let asset = AVURLAsset(url: url)
|
||
let durationInSeconds = CMTimeGetSeconds(asset.duration)
|
||
guard durationInSeconds.isFinite else { return "0:00" }
|
||
|
||
let minutes = Int(durationInSeconds) / 60
|
||
let seconds = Int(durationInSeconds) % 60
|
||
return String(format: "%d:%02d", minutes, seconds)
|
||
}
|
||
// MARK: - 扩展
|
||
|
||
/// 扩展 MediaType 以支持 Identifiable 协议
|
||
extension MediaType: Identifiable {
|
||
/// 唯一标识符
|
||
public var id: String {
|
||
switch self {
|
||
case .image(let uiImage):
|
||
return "image_\(uiImage.hashValue)"
|
||
case .video(let url, _):
|
||
return "video_\(url.absoluteString.hashValue)"
|
||
}
|
||
}
|
||
}
|
||
|
||
extension TimeInterval {
|
||
var formattedDuration: String {
|
||
let minutes = Int(self) / 60
|
||
let seconds = Int(self) % 60
|
||
return String(format: "%d:%02d", minutes, seconds)
|
||
}
|
||
}
|
||
|
||
// MARK: - 预览
|
||
|
||
struct MediaUploadView_Previews: PreviewProvider {
|
||
static var previews: some View {
|
||
NavigationView {
|
||
MediaUploadView()
|
||
}
|
||
}
|
||
}
|