• Stars
    star
    200
  • Rank 195,325 (Top 4 %)
  • Language
    Swift
  • License
    MIT License
  • Created over 7 years ago
  • Updated about 7 years ago

Reviews

There are no reviews yet. Be the first to send feedback to the community and the maintainers!

Repository Details

the best photo picker plugin in swift

TGPhotoPicker

the best photo picker plugin in swift(iOS8+) No using picture resources, based on TGImage

Swift Build License MIT Platform Cocoapod

Demo Screenshot

照片选择界面(.weibo)更多效果在下面哦:)

参数调节界面(只为方便直观查看本插件的参数效果,实际使用时请直接参考TGPhotoPickerConfig.swift提供的参数)

自定义拍照界面

Recently Updated

  • 0.0.5 添加AlertSheet类和useCustomActionSheet配置属性
  • 0.0.4 新增11个属性,向下兼容iOS8,其中最主要的新增功能是2个,1是允许用户选择使用iOS8或iOS10拍照功能,推荐仍使用iOS8,默认使用iOS10;2是拍照时是否同时把拍照结果保存到系统相册中去,默认不保存
  • 0.0.3 丰富的参数,DIY你满意的一款photo picker

Features

  • 不使用图片资源,基于TGImage实现
  • 支持链式编程配置,程序员的最爱
  • 支持Cocoapods
  • 支持2种遮罩模式(直接在选择的照片cell上显示遮罩、选择到最大照片数量后其余照片cell显示遮罩)
  • 支持选择完成后,长按控件的照片cell进行位置调整(iOS 9 及以上有效)
  • 支持2种删除模式(选择完成后直接点每个照片cell上的删除按钮删除、选择完成后预览单个照片大图时点工具栏上的删除按钮删除)
  • 支持选择指示器选择时的顺序数字显示(每个照片cell的状态有5种状态:未选择、选中状态、数字选中状态、删除状态、按住删除按钮时的高亮状态)
  • 支持2种选择模式(直接选择、预览选择)
  • 预置weibowechat 2种成组配置模式,省去多个参数配置,简化为一句代码配置
  • 支持8种选择样式(类型)单勾方块斜带三角
  • 支持4种选择位置(左上、左下、右上、右下)
  • 支持tinColor统一设置风格
  • 支持选择指示器大小调节
  • 自由选择iOS8或iOS10拍照功能
  • 轻量级、使用超灵活、功能超强大
  • 用例丰富,快速上手

Usage

总体分为2种使用方式,有界面的话,用TGPhotoPicker实例化(即多选照片选择完成后把数据呈现在控件上),不需要界面的话用TGPhotoPickerManager.shared.takePhotoModels单例方法获取多选照片数据(这个又分两种,用模型或不用模型(直接用分开的数组))

提示:

1、请先在info.plist中添加以下两个key,以请求相机相册的访问权限(iOS10)

NSCameraUsageDescription(Privacy - Camera Usage Description) NSPhotoLibraryUsageDescription(Privacy - Photo Library Usage Description)

2、作者的Xcode为8.3.3(8E3004b)若你的版本过低,可能会在TGPhotoPickerConfig.swift文件的case .smartAlbumScreenshots:处出现错误提示:Enum case 'smartAlbumScreenshots' not found in type 'PHAssetCollectionSubtype'   报错原因是这是iOS10.2/10.3新增两个值,   解决办法:1、请升级你的Xcode 2、注释相关代码

使用默认(有界面)

lazy var picker: TGPhotoPicker = TGPhotoPicker(self, frame: CGRect(x: 0, y: 50, width: UIScreen.main.bounds.width, height: 200))

override func viewDidLoad() {
        super.viewDidLoad()
        //放到界面中去
        self.view.addSubview(picker)
}

带配置(有界面)

    lazy var picker: TGPhotoPicker = TGPhotoPicker(self, frame: CGRect(x: 0, y: 50, width: UIScreen.main.bounds.width, height: 200)) { (config) in
        config.type = .weibo
        //更多配置在这里添加
    }

带配置(链式)

    lazy var picker: TGPhotoPicker = TGPhotoPicker(self, frame: CGRect(x: 0, y: 50, width: UIScreen.main.bounds.width, height: 200)) { (config) in
        config.tg_type(.wechat)
              .tg_checkboxLineW(1)
    }

带配置(单例配置对象)

    lazy var picker: TGPhotoPicker = TGPhotoPicker(self, frame: CGRect(x: 0, y: 50, width: UIScreen.main.bounds.width, height: 200)) { _ in
        TGPhotoPickerConfig.shared.tg_type(.wechat)
            .tg_checkboxLineW(1)
            .tg_toolBarH(50)
            .tg_useChineseAlbumName(true)
    }

其他使用方式(无界面) 模型数组

TGPhotoPickerManager.shared.takePhotoModels(true, true) { (array) in
            //示例代码
            self.picker.tgphotos.removeAll()
            self.picker.tgphotos.append(contentsOf: array)
            DispatchQueue.main.async {
                self.picker.reloadData()
            }
        }

其他使用方式(无界面) 4个分开独立的数组(即模型里成员分出来的)

TGPhotoPickerManager.shared.takePhotos(true, true, { (config) in
            //链式配置
            config.tg_type(TGPhotoPickerType.weibo)
                .tg_confirmTitle("我知道了")
                .tg_maxImageCount(12)
        }) { (asset, smallImg, bigImg, data) in
            //示例代码
            self.picker.tgphotos.removeAll()
            for i in 0..<smallImg.count {
                let model = TGPhotoM()
                model.asset = asset[i]
                model.smallImage = smallImg[i]
                model.bigImage = bigImg[i]
                model.imageData = data[i]
                self.picker.tgphotos.append(model)
            }
            DispatchQueue.main.async {
                self.picker.reloadData()
            }
        }

使用控件中的数据

func upLoadData(){
        var dataArray = [Data]()
        for model in picker.tgphotos {
            dataArray.append(model.imageData!)
        }
        //上传Data数组
    }

可以配置的属性(以下为部分可以配置的参数,完整配置参数见TGPhotoPickerConfig.swift(其中官方Demo中列出了主要的32个参数的使用效果))

    /** Alert样式*/
    var useCustomActionSheet: Bool = true
    
    /** 拍照后是否保存照片到相册*/
    var saveImageToPhotoAlbum: Bool = false
    
    /** 使用iOS8相机: false 根据iOS版本判断使用iOS10或iOS8相机; true 指定使用iOS8相机*/
    var useiOS8Camera: Bool = false
    
    /** 与useCustomSmartCollectionsMask结合使用,当useCustomSmartCollectionsMask为true时过滤需要显示smartAlbum的Album类型*/
    var customSmartCollections 
    
    /** 使用自定义的PHAssetCollectionSubtype集合来过滤显示自己想要的相册夹,如想显示慢动作和自拍,那么上面的useCustomSmartCollectionsMask数组中设置为(或添加)[PHAssetCollectionSubtype.smartAlbumSlomoVideos,PHAssetCollectionSubtype.smartAlbumSelfPortraits]*/
    var useCustomSmartCollectionsMask: Bool = true
    
    /** 是否使用中文名称显示smartAlbum的Album名*/
    var useChineseAlbumName: Bool = false
    
    /** 空内容的相册夹是否显示 */
    var isShowEmptyAlbum: Bool = false
    
    /** 升序排列照片*/
    var ascending: Bool = false
    
    /** 预置的成组配置, 微博 微信*/
    var type: TGPhotoPickerType = .normal
    
    /** 在选择类型为方 带时用到的Corner*/
    var checkboxCorner: CGFloat = 0
    
    /** 选择框显示的位置*/
    var checkboxPosition: TGCheckboxPosition = .topRight
    
    /** 移除按钮显示的位置*/
    var removePosition: TGCheckboxPosition = .topRight
    
    /** 移除类型,同选择类型*/
    var removeType: TGCheckboxType = .diagonalBelt
    
    /** 是否显示选择顺序*/
    var isShowNumber: Bool = true
    
    /** 纯数字模式下显示选择顺序时的数字阴影宽,不需要阴影设置为0*/
    var shadowW:CGFloat = 1.0
    
    /** 纯数字模式下显示选择顺序时的数字阴影高,不需要阴影设置为0*/
    var shadowH:CGFloat = 1.0
    
    /** 选择框类型(样式) 8种 */
    var checkboxType: TGCheckboxType = .diagonalBelt
    
    /** 显示在工具栏上的选择框的大小*/
    var checkboxBarWH: CGFloat = 30
    
    /** 显示在照片Cell上的选择框的大小*/
    var checkboxCellWH: CGFloat = 20
    
    /** 选择框起始透明度*/
    var checkboxBeginngAlpha: CGFloat = 1
    
    /** 选择框的结束透明度, 两者用于选择框渐变效果*/
    var checkboxEndingAlpha: CGFloat = 1
    
    /** 选择框的画线宽度, 工具栏上返回、删除按钮的画线宽度*/
    var checkboxLineW: CGFloat = 1.5
    
    /** 选择框的Padding*/
    var checkboxPadding: CGFloat = 1
    
    /** 选择时是否动画效果*/
    var checkboxAnimate: Bool = true
    
    /** 选择时或选择到最大照片数量时,当前或其他Cell的遮罩的透明度*/
    var maskAlpha: CGFloat = 0.6
    
    /** 使用选择遮罩: false,当选择照片数量达到最大值时,其余照片显示遮罩; true,其余照片不显示遮罩,而是已经选择的照片显示遮罩 */
    var useSelectMask: Bool = false
    
    /** 工具条的高度*/
    var toolBarH: CGFloat = 44.0
    
    /** 相册类型列表Cell的高度*/
    var albumCellH: CGFloat = 60.0
    
    /** 照片Cell的高宽,即选择时的呈现的宽高*/
    var selectWH: CGFloat = 80
    
    /** 控件本身的Cell的宽高,即选择后的呈现的宽高*/
    var mainCellWH: CGFloat = 80
    
    /** 自动宽高,用于控件本身Cell的宽高自动计算*/
    var autoSelectWH: Bool = false
    
    /** true,在选择照片界面,点击照片(非checkbox区域)时,不跳转到大图预览界面,而是直接选择或取消选择当前照片; false, 点击照片checkbox区域选择或取消选择当前照片,点击非checkbox区域跳转到大图预览界面*/
    var immediateTapSelect: Bool = false
    
    /** 控件或Cell之间布局时的padding*/
    var padding: CGFloat = 1
    
    /** 左右没有空白,即选择时呈现的UICollectionView没有contentInset中的左右Inset*/
    var leftAndRigthNoPadding: Bool = true
    
    /** 选择时呈现的UICollectionView的每行列数*/
    var colCount: CGFloat = 4
    
    /** 选择后控件本身呈现的UICollectionView的每行列数*/
    var mainColCount: CGFloat = 4
    
    /** 完成按钮标题*/
    var doneTitle = "完成"
    
    /** 完成按钮的宽*/
    var doneButtonW: CGFloat = 70
    
    /** 完成按钮的高*/
    var doneButtonH: CGFloat = 30.8
    
    /** 导航工具栏返回按钮图标显示圆边 及 星(star)样式显示圆边*/
    var isShowBorder: Bool = false
    
    /** 分多次选择照片时,剩余照片达到上限时的提示文字*/
    var leftTitle = "剩余"
    
    /** 相册类型界面的标题*/
    var albumTitle = "照片"
    
    /** 确定按钮的标题*/
    var confirmTitle  = "确定"
    
    /** 选择数量达到上限时的提示文字, #为占位符*/
    var errorImageMaxSelect = "图片选择最多不能超过#张"
    
    /** 拍摄标题*/
    var cameraTitle = "拍摄"
    
    /** 选择标题*/
    var selectTitle = "从手机相册选择"
    
    /** 取消标题*/
    var cancelTitle = "取消"
    
    /** 选择时显示的数字的字体大小等*/
    var fontSize: CGFloat = 15.0
    
    /** 预览照片的最大宽度*/
    var previewImageFetchMaxW:CGFloat = 600
    
    /** 工具栏的背景色,有透明部分则全屏穿透效果*/
    var barBGColor = UIColor(red: 40/255, green: 40/255, blue: 40/255, alpha: 0.9)
    
    /** 选择框 、按钮的颜色*/
    var tinColor = UIColor(red: 7/255, green: 179/255, blue: 20/255, alpha: 1)
    
    /** 删除按钮的颜色*/
    var removeHighlightedColor: UIColor = .red
    
    /** 删除按钮是否隐藏*/
    var isRemoveButtonHidden: Bool = false
    
    /** 按钮无效时的文字颜色*/
    var disabledColor: UIColor = .gray
    
    /** 最大照片选择数量上限*/
    var maxImageCount: Int = 9
    
    /** 压缩比,0(most)..1(least) 越小图片就越小*/
    var compressionQuality: CGFloat = 0.5

使用链式编程配置时,请在所有属性前加tg_前缀即可

选择指示器各状态组合参数说明(选择类型checkboxType、大小checkboxCellWH、位置checkboxPosition各状态下都起作用,其他配置参数起作用时机见下表(最佳快速上手请使用官方Demo进行参数调配,参数效果立竿见影))

类型 未选择状态 选择状态 删除状态 删除高亮状态 数字状态 其他说明
只有勾 勾色white(0.7) 、checkboxLineW 勾色tincolor、checkboxLineW 叉色同左 叉色removeHighlightedColor shadowW、shadowH、fontSize、checkboxLineW、checkboxPadding、字色tinColor
圈勾 圈色white(0.3)、border色white(0.7)、 勾色white、checkboxLineW、checkboxPadding 圈色tincolor、 勾色white,checkboxLineW、 渐变(checkboxBeginngAlpha、checkboxEndingAlpha)、 checkboxPadding 叉色同左 叉色removeHighlightedColor 字色white、圈色tinColor、checkboxPadding 微博未选择状态勾色clear、微博删除状态叉色white
方勾 方色white(0.3)、 勾色white、checkboxLineW、checkboxCorner 方色tincolor、渐变(checkboxBeginngAlpha、checkboxEndingAlpha)、 勾色white、checkboxCorner、checkboxLineW 叉色同左 叉色removeHighlightedColor 字色white、方色tinColor、checkboxCorner
带勾 带色white(0.3)、 勾色white、渐变(checkboxBeginngAlpha、0.01)、checkboxLineW、checkboxCorner、checkboxPadding 带色tincolor、 勾色white、   渐变(checkboxBeginngAlpha、0.01)、 checkboxCorner、checkboxPadding、checkboxLineW 叉色同左 叉色removeHighlightedColor 字色white、带色tinColor(渐变(checkboxBeginngAlpha、0.01))、checkboxCorner
斜带勾 带色white(0.3)、 勾色white、checkboxLineW 带色tincolor、 勾色white、checkboxLineW 叉色同左 叉色removeHighlightedColor 底色tinColor、字色white
三角勾 角色white(0.3)、 勾色white、checkboxLineW 角色tincolor、 勾色white、checkboxLineW 叉色同左 叉色removeHighlightedColor 底色tinColor、字色white
心色white(0.7)、checkboxLineW、 无勾 心色tincolor、 无勾 叉色同左、removeType为circle 叉色removeHighlightedColor 同circle
星色white(0.3)、border色white(0.7)、isShowBorder、checkboxLineW、无勾 星色tincolor、无勾、无border 叉色同左、removeType为circle 叉色removeHighlightedColor 同circle

更多使用配置组合效果请download本项目或fork本项目查看

ScreenShots

1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

17

18

19

运行效果

diagonalBelt

circle

belt

square

onlyCheckbox

triangle

heart

star

Installation

  • 下载并拖动TGPhotoPicker到你的工程中

  • Cocoapods

pod 'TGPhotoPicker'

Reference

如果你觉得赞,请Star