MediaBrowser 网格视图实战:快速实现照片墙与视频缩略图浏览

发布时间:2026/8/19 20:06:40
MediaBrowser 网格视图实战:快速实现照片墙与视频缩略图浏览 MediaBrowser 网格视图实战快速实现照片墙与视频缩略图浏览【免费下载链接】MediaBrowser A simple iOS photo and video browser with optional grid view, captions and selections written in Swift5.0项目地址: https://gitcode.com/gh_mirrors/me/MediaBrowserMediaBrowser 是一款用 Swift 编写的 iOS 照片和视频浏览器它最大的亮点就是开箱即用的**网格视图照片墙**能力只需几行配置就能把几十张照片和视频以缩略图网格的形式铺满屏幕点击任意一张即可进入全屏大图浏览。本文将带你从零开始快速在 Xcode 项目中集成 MediaBrowser实现照片墙展示、视频缩略图预览与多选交互全程附上可照抄的配置步骤新手也能一次跑通。MediaBrowser 是什么为什么适合做照片墙MediaBrowser 是一个开源的 iOS 媒体浏览框架支持 Swift 6.0、iOS 13.0同时兼容 Swift Package Manager、CocoaPods 和 Carthage 三种主流集成方式。它不仅能展示本地图片UIImage、PHAsset还能直接加载网络图片地址URL和本地视频文件网络图片的下载与缓存由 SDWebImage 自动处理开发者无需关心内存压力。用它来做照片墙你几乎不用写任何复杂的UICollectionView布局代码——网格视图MediaGridViewController已经内置好你只需要告诉它要展示哪些媒体即可。核心特性一览 单图 / 多图 / 视频混合浏览支持横竖屏旋转 全屏大图支持双指缩放、拖动平移 视频自动播放、网格缩略图封面✅ 网格模式与全屏模式下的多选勾选功能 网络图片自动下载与缓存支持加载进度提示最快的安装方法两种方式任选其一方式一CocoaPods适合已有 Podfile 的项目在 Podfile 中加入一行并执行pod installpod MediaBrowser方式二Swift Package ManagerXcode 原生支持打开 Xcode选择File ▸ Add Package Dependencies…输入仓库地址即可自动集成https://gitcode.com/gh_mirrors/me/MediaBrowser提示项目根目录还提供了 Package.swift、MediaBrowser.podspec 和 Cartfile三种集成方式都有官方支持。快速搭建照片墙两个关键开关一开就生效MediaBrowser 的网格视图默认就是开启的你只需要关心两个属性它们定义在 MediaBrowser.swiftenableGrid是否允许显示网格视图照片墙startOnGrid进入浏览器时是否直接以网格模式打开完整的最小示例代码如下let browser MediaBrowser(delegate: self) browser.enableGrid true // 开启照片墙 browser.startOnGrid true // 打开即显示网格缩略图 navigationController?.pushViewController(browser, animated: true)就这样一个可上下滑动、自动分栏的照片墙就出现了网格的列数是根据屏幕宽度自动计算的见 MediaGridViewController.swift横竖屏切换时也会自动重新布局。照片墙的数据从哪来两个代理方法搞定照片墙本身不保存数据它通过MediaBrowserDelegate向你要内容核心就两个方法定义在 MediaBrowserDelegate.swiftfunc numberOfMedia(in mediaBrowser: MediaBrowser) - Int { return mediaArray.count } func media(for mediaBrowser: MediaBrowser, at index: Int) - Media { return mediaArray[index] }其中Media对象见 Media.swift支持多种构造方式Media(image: UIImage)直接传图片Media(url: URL)传网络或本地图片地址Media(asset:targetSize:)传系统相册的 PHAssetMedia(videoURL:previewImageURL:)传视频地址 封面图Demo 项目里的 DemoData.swift 就演示了如何快速生成一组本地图片填充照片墙是很好的参考模板。视频缩略图浏览让视频在照片墙中也有封面照片墙里混入视频时MediaBrowser 会自动在缩略图右上角叠加播放图标。要展示视频用Media(videoURL:previewImageURL:)即可let media Media( videoURL: URL(string: https://example.com/video.mp4)!, previewImageURL: URL(string: https://example.com/poster.jpg)! )如果视频来自系统相册甚至不需要手动指定封面MediaBrowser 会通过PHImageManager自动提取视频首帧作为缩略图对应逻辑在 Media.swift。另外网格缩略图还可以通过可选的代理方法thumbnail(for:at:)单独指定小尺寸封面让照片墙滚动更省内存func thumbnail(for mediaBrowser: MediaBrowser, at index: Int) - Media { return thumbArray[index] // 推荐使用小尺寸缩略图 }进阶技巧让照片墙浏览更丝滑的 4 个小配置开启预缓存减少滑动卡顿设置preCachingEnabled true并配合setCurrentIndex(at:)浏览器会提前加载当前页附近的图片避免快速滑动时的白屏相关实现见 MediaBrowser.swift。设置占位图提升加载体验placeholderImage (image: yourImage, isAppliedForAll: true)网络图片加载前会先显示占位图。照片墙支持多选开启displaySelectionButtons true网格缩略图和全屏大图都能勾选配合mediaDid(selected:at:in:)代理方法即可拿到选择结果非常适合做多选图片类功能。大图自适应zoomPhotosToFill true让全屏大图自动填满屏幕支持双指缩放查看细节。总结MediaBrowser 把照片墙、视频缩略图、全屏大图浏览、多选交互这些常见需求封装得足够简单核心思路就三步创建MediaBrowser→ 实现两个数据代理方法 → 打开enableGrid/startOnGrid。如果遇到配置上的疑问可以直接参考 Demo 工程 ViewController.swift 里 9 种不同场景的完整用法照着改就能快速落地到自己的项目里。【免费下载链接】MediaBrowser A simple iOS photo and video browser with optional grid view, captions and selections written in Swift5.0项目地址: https://gitcode.com/gh_mirrors/me/MediaBrowser创作声明:本文部分内容由AI辅助生成(AIGC),仅供参考