close
当前位置: 物联网在线 > 技术文库 > ios >

iOS 图片选择器(仿微信)

照片选择器是APP开发中经常使用的功能.比如对商品的评价,某些报告提交等都会用到.

你只要继承我demo的HWPublishBaseController就可以了.在下面有说明.我在demo设置的是最多上传9张照片,你可以自己根据需求修改,在工程中搜索

#define kMaxImageCount 9

这是我在项目中的使用,如图:

iOS 图片选择器(仿微信)

iOS 图片选择器(仿微信)

iOS 图片选择器(仿微信)

不废话,直接上代码.其中用了第三方的东西.我demo中的EvaluateViewController页是写功能的主要看这个页面就可以.它如上面所说就是继承的HWPublishBaseController.demo中的代码说明的很详细可以参照此样式自定义页面.先说一说Base页面.

这是Base页面,你可以新建一个页面继承它,然后自定义页面样式.其中你可以根据需求是要大图的数据信息还是缩放的小图信息.这是小图的://方形压缩图image 数组 @property(nonatomic,strong) NSMutableArray imageArray;这是大图的- (NSArray )getBigImageArray;上传图片就要根据需求了,网上有很多.

首先是.h文件

// // HWPublishBaseController.h // PhotoSelector // // Created by 洪雯 on 2017/1/12. // Copyright © 2017年 洪雯. All rights reserved. // #import <UIKit/UIKit.h> #import <AssetsLibrary/AssetsLibrary.h> #import "HWCollectionViewCell.h" #import "JJPhotoManeger.h" #import "HWImagePickerSheet.h" @protocol HWPublishBaseViewDelegate <NSObject> @optional @end @interface HWPublishBaseController : UIViewController @property (nonatomic, assign) id<HWPublishBaseViewDelegate> delegate; @property (nonatomic, strong) UICollectionView *pickerCollectionView; @property (nonatomic, assign) CGFloat collectionFrameY; //选择的图片数据 @property(nonatomic,strong) NSMutableArray *arrSelected; //方形压缩图image 数组 @property(nonatomic,strong) NSMutableArray * imageArray; //大图image 数组 @property(nonatomic,strong) NSMutableArray * bigImageArray; //大图image 二进制 @property(nonatomic,strong) NSMutableArray * bigImgDataArray; //图片选择器 @property(nonatomic,strong) UIViewController *showActionSheetViewController; //collectionView所在view @property(nonatomic,strong) UIView *showInView; //图片总数量限制 @property(nonatomic,assign) NSInteger maxCount; //初始化collectionView - (void)initPickerView; //修改collectionView的位置 - (void)updatePickerViewFrameY:(CGFloat)Y; //获得collectionView 的 Frame - (CGRect)getPickerViewFrame; //获取选中的所有图片信息 - (NSArray*)getSmallImageArray; - (NSArray*)getBigImageArray; - (NSArray*)getALAssetArray; - (void)pickerViewFrameChanged; @end

这是.m文件 在新建页面调用 [self initPickerView];这个方法是 初始化collectionView 然后根据需求调用updatePickerViewFrameY这个方法这个是修改collectionView的位置即照片的显示位置.

// // HWPublishBaseController.m // PhotoSelector // // Created by 洪雯 on 2017/1/12. // Copyright © 2017年 洪雯. All rights reserved. // #import "HWPublishBaseController.h" @interface HWPublishBaseController ()<UICollectionViewDelegate,UICollectionViewDataSource,JJPhotoDelegate,HWImagePickerSheetDelegate>{ NSString *pushImageName; //添加图片提示 UILabel *addImageStrLabel; } @property (nonatomic, strong) HWImagePickerSheet *imgPickerActionSheet; @end @implementation HWPublishBaseController static NSString * const reuseIdentifier = @"HWCollectionViewCell"; -(instancetype)init{ self = [super init]; if (self) { if (!_showActionSheetViewController) { _showActionSheetViewController = self; } } return self; } - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. } /** 初始化collectionView */ -(void)initPickerView{ _showActionSheetViewController = self; UICollectionViewFlowLayout *layout = [[UICollectionViewFlowLayout alloc] init]; self.pickerCollectionView = [[UICollectionView alloc] initWithFrame:self.view.frame collectionViewLayout:layout]; if (_showInView) { [_showInView addSubview:self.pickerCollectionView]; }else{ [self.view addSubview:self.pickerCollectionView]; } self.pickerCollectionView.delegate=self; self.pickerCollectionView.dataSource=self; self.pickerCollectionView.backgroundColor = [UIColor whiteColor]; if(_imageArray.count == 0) { _imageArray = [NSMutableArray array]; } if(_bigImageArray.count == 0) { _bigImageArray = [NSMutableArray array]; } pushImageName = @"plus.png"; _pickerCollectionView.scrollEnabled = NO; //上传图片提示 addImageStrLabel = [[UILabel alloc]initWithFrame:CGRectMake(100, 50, 70, 20)]; addImageStrLabel.text = @"上传图片"; addImageStrLabel.textColor = [UIColor colorWithRed:153.0/255.0 green:153.0/255.0 blue:153.0/255.0 alpha:1.0]; [self.pickerCollectionView addSubview:addImageStrLabel]; } #pragma mark <UICollectionViewDataSource> - (NSInteger)numberOfSectionsInCollectionView:(UICollectionView *)collectionView { return 1; } - (NSInteger)collectionView:(UICollectionView *)collectionView numberOfItemsInSection:(NSInteger)section { return _imageArray.count+1; } - (UICollectionViewCell *)collectionView:(UICollectionView *)collectionView cellForItemAtIndexPath:(NSIndexPath *)indexPath { // Register nib file for the cell UINib *nib = [UINib nibWithNibName:@"HWCollectionViewCell" bundle: [NSBundle mainBundle]]; [collectionView registerNib:nib forCellWithReuseIdentifier:@"HWCollectionViewCell"]; // Set up the reuse identifier HWCollectionViewCell *cell = [collectionView dequeueReusableCellWithReuseIdentifier: @"HWCollectionViewCell" forIndexPath:indexPath]; if (indexPath.row == _imageArray.count) { [cell.profilePhoto setImage:[UIImage imageNamed:pushImageName]]; cell.closeButton.hidden = YES; //没有任何图片 if (_imageArray.count == 0) { addImageStrLabel.hidden = NO; } else{ addImageStrLabel.hidden = YES; } } else{ [cell.profilePhoto setImage:_imageArray[indexPath.item]]; cell.closeButton.hidden = NO; } [cell setBigImageViewWithImage:nil]; cell.profilePhoto.tag = [indexPath item]; //添加图片cell点击事件 UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapProfileImage:)]; singleTap.numberOfTapsRequired = 1; cell.profilePhoto .userInteractionEnabled = YES; [cell.profilePhoto addGestureRecognizer:singleTap]; cell.closeButton.tag = [indexPath item]; [cell.closeButton addTarget:self action:@selector(deletePhoto:) forControlEvents:UIControlEventTouchUpInside]; [self changeCollectionViewHeight]; return cell; } #pragma mark <UICollectionViewDelegate> //定义每个UICollectionView 的大小 - (CGSize)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout sizeForItemAtIndexPath:(NSIndexPath *)indexPath { return CGSizeMake(([UIScreen mainScreen].bounds.size.width-64) /4 ,([UIScreen mainScreen].bounds.size.width-64) /4); } //定义每个UICollectionView 的 margin - (UIEdgeInsets)collectionView:(UICollectionView *)collectionView layout:(UICollectionViewLayout*)collectionViewLayout insetForSectionAtIndex:(NSInteger)section { return UIEdgeInsetsMake(20, 8, 20, 8); } #pragma mark - 图片cell点击事件 //点击图片看大图 - (void) tapProfileImage:(UITapGestureRecognizer *)gestureRecognizer{ [self.view endEditing:YES]; UIImageView *tableGridImage = (UIImageView*)gestureRecognizer.view; NSInteger index = tableGridImage.tag; if (index == (_imageArray.count)) { [self.view endEditing:YES]; //添加新图片 [self addNewImg]; } else{ //点击放大查看 HWCollectionViewCell *cell = (HWCollectionViewCell*)[_pickerCollectionView cellForItemAtIndexPath:[NSIndexPath indexPathForItem:index inSection:0]]; if (!cell.BigImageView || !cell.BigImageView.image) { [cell setBigImageViewWithImage:[self getBigIamgeWithALAsset:_arrSelected[index]]]; } JJPhotoManeger *mg = [JJPhotoManeger maneger]; mg.delegate = self; [mg showLocalPhotoViewer:@[cell.BigImageView] selecImageindex:0]; } } - (UIImage*)getBigIamgeWithALAsset:(ALAsset*)set{ //压缩 // 需传入方向和缩放比例,否则方向和尺寸都不对 UIImage *img = [UIImage imageWithCGImage:set.defaultRepresentation.fullResolutionImage scale:set.defaultRepresentation.scale orientation:(UIImageOrientation)set.defaultRepresentation.orientation]; NSData *imageData = UIImageJPEGRepresentation(img, 0.5); [_bigImgDataArray addObject:imageData]; return [UIImage imageWithData:imageData]; } #pragma mark - 选择图片 - (void)addNewImg{ if (!_imgPickerActionSheet) { _imgPickerActionSheet = [[HWImagePickerSheet alloc] init]; _imgPickerActionSheet.delegate = self; } if (_arrSelected) { _imgPickerActionSheet.arrSelected = _arrSelected; } _imgPickerActionSheet.maxCount = _maxCount; [_imgPickerActionSheet showImgPickerActionSheetInView:_showActionSheetViewController]; } #pragma mark - 删除照片 - (void)deletePhoto:(UIButton *)sender{ [_imageArray removeObjectAtIndex:sender.tag]; [_arrSelected removeObjectAtIndex:sender.tag]; [self.pickerCollectionView deleteItemsAtIndexPaths:@[[NSIndexPath indexPathForItem:sender.tag inSection:0]]]; for (NSInteger item = sender.tag; item <= _imageArray.count; item++) { HWCollectionViewCell *cell = (HWCollectionViewCell*)[self.pickerCollectionView cellForItemAtIndexPath:[NSIndexPath indexPathForItem:item inSection:0]]; cell.closeButton.tag--; cell.profilePhoto.tag--; } [self changeCollectionViewHeight]; } #pragma mark - 改变view,collectionView高度 - (void)changeCollectionViewHeight{ if (_collectionFrameY) { _pickerCollectionView.frame = CGRectMake(0, _collectionFrameY, [UIScreen mainScreen].bounds.size.width, (((float)[UIScreen mainScreen].bounds.size.width-64.0) /4.0 +20.0)* ((int)(_arrSelected.count)/4 +1)+20.0); } else{ _pickerCollectionView.frame = CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, (((float)[UIScreen mainScreen].bounds.size.width-64.0) /4.0 +20.0)* ((int)(_arrSelected.count)/4 +1)+20.0); } [self pickerViewFrameChanged]; } /** * 相册完成选择得到图片 */ -(void)getSelectImageWithALAssetArray:(NSArray *)ALAssetArray thumbnailImageArray:(NSArray *)thumbnailImgArray{ //(ALAsset)类型 Array _arrSelected = [NSMutableArray arrayWithArray:ALAssetArray]; //正方形缩略图 Array _imageArray = [NSMutableArray arrayWithArray:thumbnailImgArray] ; [self.pickerCollectionView reloadData]; } - (void)pickerViewFrameChanged{ } - (void)updatePickerViewFrameY:(CGFloat)Y{ _collectionFrameY = Y; _pickerCollectionView.frame = CGRectMake(0, Y, [UIScreen mainScreen].bounds.size.width, (((float)[UIScreen mainScreen].bounds.size.width-64.0) /4.0 +20.0)* ((int)(_arrSelected.count)/4 +1)+20.0); } #pragma mark - 防止奔溃处理 -(void)photoViwerWilldealloc:(NSInteger)selecedImageViewIndex { NSLog(@"最后一张观看的图片的index是:%zd",selecedImageViewIndex); } - (UIImage *)compressImage:(UIImage *)image toMaxFileSize:(NSInteger)maxFileSize { CGFloat compression = 0.9f; CGFloat maxCompression = 0.1f; NSData *imageData = UIImageJPEGRepresentation(image, compression); while ([imageData length] > maxFileSize && compression > maxCompression) { compression -= 0.1; imageData = UIImageJPEGRepresentation(image, compression); } UIImage *compressedImage = [UIImage imageWithData:imageData]; return compressedImage; } //获得大图 - (NSArray*)getBigImageArrayWithALAssetArray:(NSArray*)ALAssetArray{ _bigImgDataArray = [NSMutableArray array]; NSMutableArray *bigImgArr = [NSMutableArray array]; for (ALAsset *set in ALAssetArray) { [bigImgArr addObject:[self getBigIamgeWithALAsset:set]]; } _bigImageArray = bigImgArr; return _bigImageArray; } #pragma mark - 获得选中图片各个尺寸 - (NSArray*)getALAssetArray{ return _arrSelected; } - (NSArray*)getBigImageArray{ return [self getBigImageArrayWithALAssetArray:_arrSelected]; } - (NSArray*)getSmallImageArray{ return _imageArray; } - (CGRect)getPickerViewFrame{ return self.pickerCollectionView.frame; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } /* #pragma mark - Navigation // In a storyboard-based application, you will often want to do a little preparation before navigation - (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender { // Get the new view controller using [segue destinationViewController]. // Pass the selected object to the new view controller. } */ @end

然后新建一个页面,继承base页面

#import <UIKit/UIKit.h> #import "HWPublishBaseController.h" @interface EvaluateViewController : HWPublishBaseController @end
(责任编辑:ioter)

用户喜欢...

Python:图片转字符画

作者:邓旭东HIT 字符画真的很有意思,将图片中的像素用字符代替,就生成了字符画。 但是像素是有颜色深浅的,我...


OpenCV: 图片人脸识别

作者:邓旭东HIT 现在正在做论文,数据处理过程中有一个变量是对用户头像进行数据编码。图片有上万张,如果人工...


艾迈斯半导体新的高性能传感器接口解决方案使医疗、工业和安防CT扫描仪呈现更清晰、细节丰富的图片

AS5900是一款用于光电二极管阵列的26比特、128通道电流输入模拟数字转换器,在噪音、分辨率、线性、速度和功耗方面具备世界一流性能 全球领先的高性能传感器解决方案供应商艾迈斯半导体...


Unity+NGUI打造网络图片异步加载与本地缓存工具类(一)

我们在移动端的开发中,异步网络图片加载用的非常的多,在unity当中虽然有AssetBundle的存在,一般是先加载好游戏资源然后再进入场景,但是还有不少地方能够用到异步网络图片的加载以及...


Unity+NGUI打造网络图片异步加载与本地缓存工具类(二)

接上文,我们的工具类中的主要方法: public void SetAsyncImage(string url,UITexture texture) 按照前文分析的图片加载步骤来 public void SetAsyncImage(string url,UITexture texture){ //开始下载图片前,将UITexture的主...


Google开源核心图像识别技术,应用于Nest摄像头、图片搜索和谷歌街景

积极的开源策略也有助于将Google的TensorFlow打造成人工智能领域的主流机器学习框架平台IT经理网...


Social Listening 2.0,冲出图片数据的盲区

用户在社交网络中留下了海量信息,为企业进行消费者和市场研究提供了宝贵的数据资源,Social Listening(社群聆听)已...


图片变形的抗锯齿处理方法

前言 周末在微博上看到@周楷雯Kevin说起CALayer抗锯齿的问题 具体做法是: layer.allowsEdgeAntialiasing = true 想起了很久以前也遇到过类似的问题 那时候要做一个类贴纸的应用 理所当然会遇到贴纸缩...


Scrapy爬取美女图片续集

作者:七夜的故事 上一篇咱们讲解了Scrapy的工作机制和如何使用Scrapy爬取美女图片,而今天接着讲解Scrapy爬取美女图...


如此精美绝伦的图片怎么来的?

请仔细看题图图片,这不是照片,这样精美绝伦的图片是PowerVR Wizard GPU利用实时光线追踪技术实现的效果,它达到了照片集的效果!在今年的GDC 2016上会进行演示。这是我们的剧透! 相比传统...