利用 AFN 上传相册或拍照图片
概述
详细
由于项目中多处需要上传图片,我们可以自定义上传图片请求,自定义调取相册及拍照,方便多处使用时调用。
一、主要思路
1. 自定义ZLImagePicker, 从相册选择图片或者拍照上传图片页面
2. 请求上传你选取的相册图片或者拍照图片(经过压缩处理)
3. 获取到第一步图片url上传给服务器
4. 回显图片(当然进入该界面时先判断是否有图片,无图则展示占位图片,否则就回显图片)
二、程序实现
Step1. 自定义ZLImagePicker, 从相册选择图片或者拍照上传图片页面
用于present UIImagePickerController对 且allowsEditing 是否允许用户编辑图像:
+ (void)showImagePickerFromViewController:(UIViewController *)viewController allowsEditing:(BOOL)allowsEditing finishAction:(ZLImagePickerFinishAction)finishAction {
if (ZLImagePickerInstance == nil) {
ZLImagePickerInstance = [[ZLImagePicker alloc] init];
} [ZLImagePickerInstance showImagePickerFromViewController:viewController
allowsEditing:allowsEditing
finishAction:finishAction];
}
- (void)showImagePickerFromViewController:(UIViewController *)viewController
allowsEditing:(BOOL)allowsEditing
finishAction:(ZLImagePickerFinishAction)finishAction {
_viewController = viewController;
_finishAction = finishAction;
_allowsEditing = allowsEditing; UIActionSheet *sheet = nil; if ([UIImagePickerController isSourceTypeAvailable:UIImagePickerControllerSourceTypeCamera]) {
sheet = [[UIActionSheet alloc] initWithTitle:nil
delegate:self
cancelButtonTitle:@"取消"
destructiveButtonTitle:nil
otherButtonTitles:@"拍照", @"从相册选择", nil];
}else {
sheet = [[UIActionSheet alloc] initWithTitle:nil
delegate:self
cancelButtonTitle:@"取消"
destructiveButtonTitle:nil
otherButtonTitles:@"从相册选择", nil];
} UIView *window = [UIApplication sharedApplication].keyWindow;
[sheet showInView:window];
}
Step2. 封装的上传图片的网络请求(图片压缩) ZLUploadImage 文件
利用 afn 上传一张图片:
#import "AFNetworking.h"
/**
* 上传图片的网络请求(图片压缩)
*
* @param url 上传图片的网络请求地址
* @param name 和后台包名一致
*
*/
+ (void)post:(NSString *)url image:(UIImage *)image name:(NSString *)name success:(void (^)(id json))success failure:(void (^)(NSError *error))failure { // 1.创建网络管理者
AFHTTPSessionManager *manager = [AFHTTPSessionManager manager]; // 2.拼接请求参数url 也可在具体控制器请求里传入
// NSDictionary *dict = @{@"userId" : [YYPAccountTool getUserId]};
NSDictionary *dict; // 这里按实际情况的用户id上传 // 3.发送请求
[manager POST:url parameters:dict constructingBodyWithBlock:
^void(id<AFMultipartFormData> formData) { NSData *imageData = UIImageJPEGRepresentation(image, 0.5);//进行图片压缩 // 使用日期生成图片名称
NSDateFormatter *formatter = [[NSDateFormatter alloc] init];
formatter.dateFormat = @"yyyyMMddHHmmss";
NSString *fileName = [NSString stringWithFormat:@"%@.png",[formatter stringFromDate:[NSDate date]]];
// 任意的二进制数据MIMEType application/octet-stream
[formData appendPartWithFileData:imageData name:name fileName:fileName mimeType:@"image/png"]; } success:^void(NSURLSessionDataTask * task, id responseObject) { if (success) {
success(responseObject);
} } failure:^void(NSURLSessionDataTask * task, NSError * error) { if (failure) {
failure(error);
}
}];
}
Step3. 获取到第一步图片url上传给服务器
需要和各位自己后台server联调,就属于普通的get/post请求了哟
调用拍照或打开相册上传icon图像:
[ZLImagePicker showImagePickerFromViewController:self allowsEditing:YES finishAction:^(UIImage *image) {
if (image) { [btn setBackgroundImage:image forState:UIControlStateNormal];
self.icon = image;
}];
Step4: 回显图片
当然进入该界面时先判断是否有图片,无图则展示占位图片,否则就回显图片
[iconBtn setBackgroundImage:(self.icon == nil ? [UIImage imageNamed:@"icon"]: self.icon) forState:UIControlStateNormal];
PS:插一下,我们产品没让拍照的照片存储到相册:
// 存储图片名称:001.png ~ 009.png
for (int i = 1; i<=9; i++) {
UIImage *image = [UIImage imageNamed:[NSString stringWithFormat:@"00%d.png", i]]; UIImageWriteToSavedPhotosAlbum(image, nil, nil, nil); [NSThread sleepForTimeInterval:1];
}
三、压缩文件截图及运行效果
1、压缩文件截图
2、运行时的截图
四、其他补充
界面性问题可以根据自己项目需求调整即可, 具体可参考代码, 项目能够直接运行! 也可以把工具类直接拖到自己项目里使用!
注:本文著作权归作者,由demo大师发表,拒绝转载,转载需要作者授权
利用 AFN 上传相册或拍照图片的更多相关文章
- 第五十四篇、OC利用AFN上传上传语音
如果不是NSData就要想办法把语音文件转化为NSData,然后才能上传服务器. 首先我们拿到语音文件对应的NSData对象 NSData *voiceData = [message valueFor ...
- 第五十三篇、OC利用AFN上传视频到服务器
整体思路已经清楚,拿到视频资源,先转为mp4,写进沙盒,然后上传,上传成功后删除沙盒中的文件. 本地拍摄的视频,上传到服务器: //视频转换为MP4 //转码操作... _hud.mode = MBP ...
- canvas利用formdata上传到服务器
1.首先绘制canvas图片 <canvas id="myCanvas" width="100" height="100" style ...
- AFN上传多张图片
AFN上传多张图片代码: AFHTTPSessionManager *sessionManager = [AFHTTPSessionManager manager]; sessionManager.r ...
- hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images
hTML5实现表单内的上传文件框,上传前预览图片,针刷新预览images, 本例子主要是使用HTML5 的File API,建立一個可存取到该file的url, 一个空的img标签,ID为img0,把 ...
- 【转】asp.net(c#)使用HttpWebRequest附加携带请求参数以post方式模拟上传大文件(以图片为例)到Web服务器端
原文地址:http://docode.top/Article/Detail/10002 目录: 1.Http协议上传文件(以图片为例)请求报文体内容格式 2.完整版HttpWebRequest模拟上传 ...
- 从web编辑器 UEditor 中单独提取图片上传,包含多图片单图片上传以及在线涂鸦功能
UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码.(抄的...) UEditor是非常好用的富文 ...
- php用jquery-ajax上传多张图片限制图片大小
php用jquery-ajax上传多张图片限制图片大小 /** * 上传图片,默认大小限制为3M * @param String $fileInputName * @param number $siz ...
- 利用SecureCRT上传、下载文件(使用sz与rz命令),超实用!
利用SecureCRT上传.下载文件(使用sz与rz命令),超实用! 文章来源:http://blog.csdn.net/dongqinliuzi/article/details/39623169 借 ...
随机推荐
- objective-c block 详解 转
Block Apple 在C, Objective-C, C++加上Block這個延申用法.目前只有Mac 10.6 和iOS 4有支援.Block是由一堆可執行的程式組成,也可以稱做沒有名字的F ...
- 第二章 ActionScript 3.0学习之画星星(鼠标及键盘事件)
今天觉得学到的比较有趣,所以记录之......~~~ 下面这段就是画出星星的代码:StarShape.as package { import flash.display.Shape; import f ...
- 《OpenStack部署实践》
<OpenStack部署实践> 基本信息 作者: 张子凡 丛书名: 图灵原创 出版社:人民邮电出版社 ISBN:9787115346797 上架时间:2014-2-27 出版日期:2014 ...
- Mysql运行模式及1690错误处理
最近一段运行良好的代码突然无法运行,报错: MySQL said: Documentation 1690 - BIGINT UNSIGNED value is out of range in 经过查询 ...
- 文件内容操作篇clearerr fclose fdopen feof fflush fgetc fgets fileno fopen fputc fputs fread freopen fseek ftell fwrite getc getchar gets
clearerr(清除文件流的错误旗标) 相关函数 feof 表头文件 #include<stdio.h> 定义函数 void clearerr(FILE * stream); 函数说明 ...
- 缓存算法:LRU、LFU、FIFO
LRU全称是Least Recently Used,即最近最久未使用的意思.如果一个数据在最近一段时间没有被访问到,那么在将来它被访问的可能性也很小.也就是说,当限定的空间已存满数据时,应当把最久 ...
- 洛谷P1772 [ZJOI2006]物流运输 题解
题目描述 物流公司要把一批货物从码头A运到码头B.由于货物量比较大,需要n天才能运完.货物运输过程中一般要转停好几个码头.物流公司通常会设计一条固定的运输路线,以便对整个运输过程实施严格的管理和跟踪. ...
- Linked List Cycle leetcode java (链表检测环)
题目: Given a linked list, determine if it has a cycle in it. Follow up: Can you solve it without usin ...
- linux /dev 常见特殊设备介绍与应用[loop,null,zero,full,random]
linux是文件型系统,所有硬件如软件都会在对于的目录下面有相应的文件表示.对于dev这个目录,我们知道它下面的文件,表示的是linux的设备.在windows系统中,设备大家很好理解,象硬盘,磁盘指 ...
- 取消Eclipse SVN的自动链接方式
1. 选中指定的项目名(有文件夹样子的那个) 2. 右键,在在弹出菜单选择 Team 3. 然后再点击, Disconnect 即可.