SKPhotoBrowser 7.1.0

SKPhotoBrowser 7.1.0

测试已测试
Lang语言 SwiftSwift
许可证 MIT
发布最新发布2022年7月
SPM支持 SPM

suzuki-0000Alexsander Khitev 维护。



  • suzuki_keishi

SKPhotoBrowser

由 Swift 编写的简单 PhotoBrowser/Viewer,受到 Facebook 和 Twitter 图片浏览器的启发

Swift5 Build Status Platform Contributors

功能

  • 通过提供 UIImage 对象或 URL 数组的字符串,显示一个或多个图像。
  • 照片可以缩放和拖动,并可以显示可选的标题
  • 极简 Facebook 风格的界面,上下滑动以关闭
  • 可以自定义控制。 (隐藏/显示控制栏,左右滑动控制)
  • 处理和缓存来自网络的图片
  • 支持横向操作
  • 支持删除图片功能(通过 offbye)。通过设置 displayDelete=true 在状态栏显示删除图标,可以从代理函数 didDeleted 获取已删除的下标。
表格/集合视图示例 按钮点击示例
sample sample

需求

  • iOS 8.0+
  • Swift 2.0+
  • ARC

版本与Swift版本比较。

以下是表格,显示了您应该使用哪个SKPhotoBrowser版本与您的Swift版本搭配。

Swift版本 SKPhotoBrowser版本
5.0 >= 6.1.0
4.2 >= 6.0.0
4.1 >= 5.0.0
3.2 >= 4.0.0
2.3 2.0.4 - 3.1.4
2.2 <= 2.0.3

安装

CocoaPods

可在CocoaPods上使用。只需将以下内容添加到项目的Podfile中

pod 'SKPhotoBrowser'
use_frameworks!

Carthage

要使用Carthage将SKPhotoBrowser集成到Xcode项目中,请在Cartfile中指定它

github "suzuki-0000/SKPhotoBrowser"

使用方法

请参考以下代码示例了解如何实现,或查看示例项目。

从UIImages

// 1. create SKPhoto Array from UIImage
var images = [SKPhoto]()
let photo = SKPhoto.photoWithImage(UIImage())// add some UIImage
images.append(photo) 

// 2. create PhotoBrowser Instance, and present from your viewController. 
let browser = SKPhotoBrowser(photos: images)
browser.initializePageIndex(0)
present(browser, animated: true, completion: {})

从URLs

// 1. create URL Array 
var images = [SKPhoto]()
let photo = SKPhoto.photoWithImageURL("https://placehold.jp/150x150.png")
photo.shouldCachePhotoURLImage = false // you can use image cache by true(NSCache)
images.append(photo)

// 2. create PhotoBrowser Instance, and present. 
let browser = SKPhotoBrowser(photos: images)
browser.initializePageIndex(0)
present(browser, animated: true, completion: {})

从本地文件

// 1. create images from local files
var images = [SKLocalPhoto]()
let photo = SKLocalPhoto.photoWithImageURL("..some_local_path/150x150.png")
images.append(photo)

// 2. create PhotoBrowser Instance, and present. 
let browser = SKPhotoBrowser(photos: images)
browser.initializePageIndex(0)
present(browser, animated: true, completion: {})

如果您想使用现有视图的缩放效果,请使用另一个初始化器

// e.g.: some tableView or collectionView.
func collectionView(collectionView: UICollectionView, didSelectItemAtIndexPath indexPath: NSIndexPath) {
   let cell = collectionView.cellForItemAtIndexPath(indexPath) 
   let originImage = cell.exampleImageView.image // some image for baseImage 

   let browser = SKPhotoBrowser(originImage: originImage ?? UIImage(), photos: images, animatedFromView: cell) 
   browser.initializePageIndex(indexPath.row)
   present(browser, animated: true, completion: {})
}

自定义

工具栏

您可以通过SKPhotoBrowserOptions自定义工具栏。

SKPhotoBrowserOptions.displayToolbar = false                              // all tool bar will be hidden
SKPhotoBrowserOptions.displayCounterLabel = false                         // counter label will be hidden
SKPhotoBrowserOptions.displayBackAndForwardButton = false                 // back / forward button will be hidden
SKPhotoBrowserOptions.displayAction = false                               // action button will be hidden
SKPhotoBrowserOptions.displayHorizontalScrollIndicator = false            // horizontal scroll bar will be hidden
SKPhotoBrowserOptions.displayVerticalScrollIndicator = false              // vertical scroll bar will be hidden
let browser = SKPhotoBrowser(originImage: originImage, photos: images, animatedFromView: cell)

颜色

您可以通过SKPhotoBrowserOptions或SKToolbarOptions自定义文本、图标和背景颜色。

SKPhotoBrowserOptions.backgroundColor = UIColor.whiteColor()               // browser view will be white
SKPhotoBrowserOptions.textAndIconColor = UIColor.blackColor()              // text and icons will be black
SKToolbarOptions.textShadowColor = UIColor.clearColor()                    // shadow of toolbar text will be removed
SKToolbarOptions.font = UIFont(name: "Futura", size: 16.0)                 // font of toolbar will be 'Futura'

图片

您可以通过SKPhotoBrowserOptions自定义显示图片的填充。

SKPhotoBrowserOptions.imagePaddingX = 50                                   // image padding left and right will be 25
SKPhotoBrowserOptions.imagePaddingY = 50                                   // image padding top and bottom will be 25

状态栏

您可以通过SKPhotoBrowserOptions自定义浏览器视图中状态栏的可见性。

SKPhotoBrowserOptions.displayStatusbar = false                             // status bar will be hidden

关闭和删除按钮

这就是您如何自定义关闭和删除按钮的方法。

SKPhotoBrowserOptions.displayDeleteButton = true                           // delete button will be shown
SKPhotoBrowserOptions.swapCloseAndDeleteButtons = true                     // now close button located on right side of screen and delete button is on left side
SKPhotoBrowserOptions.closeAndDeleteButtonPadding = 20                     // set offset from top and from nearest screen edge of close button and delete button

自定义从Web URL缓存

如果其他可适应,可以使用SKCacheable协议。(SKImageCacheable或SKRequestResponseCacheable)

e.g. SDWebImage

// 1. create custom cache, implement in accordance with the protocol 
class CustomImageCache: SKImageCacheable { var cache: SDImageCache }

// 2. replace SKCache instance with custom cache
SKCache.sharedCache.imageCache = CustomImageCache()

自定义按钮图片

关闭、删除按钮可更改图片和边框。

browser.updateCloseButton(UIImage())
browser.updateUpdateButton(UIImage())

删除照片

你可以删除自己的照片自行处理。通过从 removePhoto 代理函数检测按钮点击。

照片标题

可以在PhotoBrowser底部简单显示照片标题。通过在特定照片上设置caption属性。

let photo = SKPhoto.photoWithImage(UIImage())
photo.caption = "Lorem Ipsum is simply dummy text of the printing and typesetting industry."

滑动手势

垂直滑动可启用/禁用。

SKPhotoBrowserOptions.disableVerticalSwipe = true 

代理

有一些触发点可以通过代理来处理,这些都是可选的。更多信息请参阅 SKPhotoBrowserDelegate

  • didShowPhotoAtIndex(_ index:Int)
  • willDismissAtPageIndex(_ index:Int)
  • willShowActionSheet(_ photoIndex: Int)
  • didDismissAtPageIndex(_ index:Int)
  • didDismissActionSheetWithButtonIndex(_ buttonIndex: Int, photoIndex: Int)
  • didScrollToIndex(_ index: Int)
  • removePhoto(_ browser: SKPhotoBrowser, index: Int, reload: (() -> Void))
  • viewForPhoto(_ browser: SKPhotoBrowser, index: Int) -> UIView?
  • controlsVisibilityToggled(_ browser: SKPhotoBrowser, hidden: Bool)
let browser = SKPhotoBrowser(originImage: originImage, photos: images, animatedFromView: cell)
browser.delegate = self

// MARK: - SKPhotoBrowserDelegate
func didShowPhotoAtIndex(_ index: Int) {
// when photo will be shown
}

func willDismissAtPageIndex(_ index: Int) {
// when PhotoBrowser will be dismissed
}

func didDismissAtPageIndex(_ index: Int) {
// when PhotoBrowser did dismissed
}

选项

可以通过 SKPhotoBrowserOptions 访问,用于浏览器控制。更多详情请参阅 SKPhotoBrowserOptions

  • 单次点击处理,消失/无操作
  • 处理出现在照片外的黑色区域
  • 出现/消失时的弹跳动画
  • 文本颜色、字体等
SKPhotoBrowserOptions.enableZoomBlackArea    = true  // default true
SKPhotoBrowserOptions.enableSingleTapDismiss = true  // default false

来自

许可证

可在MIT许可证下使用。更多信息请参阅LICENSE文件。

贡献者

感谢以下这些优秀的人们(emoji key


Alexander Khitev

💻

K Rummler

💻

Mads Bjerre

💻

Meng Ye

💻

_ant_one

💻

Tim Roesner

💻

胥冥

💻

Kevin Wolkober

💻

PJ Gray

💻

ghysrc

💻

Josef Doležal

💻

Mark Goody

💻

Philippe Riegert

💻

Bryan Irace

💻

dirtmelon

💻

Heberti Almeida

💻

Felix Weiss

💻

.Some

💻

Onur Var

💻

Andrew Barba

💻

此项目遵循 all-contributors 规范。欢迎任何类型的贡献!