iOS之设置用户头像的圆角
1. 显示用户头像用UIImageView实现,添加默认图片后效果如下图所示,头像显示为矩形图片。
代码实现:
// ViewController.m
// SetUserImage
//
// Created by jerei on 15-4-26.
// Copyright (c) 2015年 jerei. All rights reserved.
// #import "ViewController.h" #define kWidth self.view.bounds.size.width
#define kWH 100 @interface ViewController ()
{
UIImageView *_userImage;
} @end @implementation ViewController - (void)viewDidLoad {
[super viewDidLoad]; [self addUserImageView];
} #PRagma mark 添加显示用户头像的ImageView
-(void)addUserImageView
{
_userImage = [[UIImageView alloc] initWithFrame:CGRectMake((kWidth-kWH)/2, 100, kWH, kWH)];
_userImage.image = [UIImage imageNamed:@"img1.png"];
[self.view addSubview:_userImage];
}
@end
2. UIView里面有一个属性layer,CALayer类主要为内容展示和动画操作,在这里我们可以通过对layer的设置来得到圆角的头像。
让我们一起在.m文件中添加一个设置圆角图片的方法吧!
代码:
#pragma mark 设置显示用户头像的圆角ImageView
- (void)setUserImageView
{
//圆角的半径
_userImage.layer.cornerRadius = 50;
//是否显示圆角以外的部分
_userImage.layer.masksToBounds = YES;
//边框宽度
_userImage.layer.borderWidth = 5;
//边框颜色
_userImage.layer.borderColor = [[UIColor colorWithRed:0.86 green:0.52 blue:0.73 alpha:1] CGColor];
}
除了圆形,我们还可以将其设置为其他形状,如下图所示。假设显示的头像为正方形,也就是宽高相等,那么当layer.cornerRadius等于头像宽度一半时,正好为正圆形。
二、为用户头像添加单击事件 |
UIImageView只是用来做图片展示的,因此默认不响应用户的点击事件,如果想让其和按钮一样响应点击事件,需要先开启用户交互,然后通过添加手势来实现点击效果。
代码:
#pragma mark 为图片添加单击手势
- (void)addSingleTap
{
_userImage.userInteractionEnabled = YES;
UITapGestureRecognizer *singleTap = [[UITapGestureRecognizer alloc] initWithTarget:self action:@selector(tapUserImage:)];
//设置点击的手指根数
[singleTap setNumberOfTouchesRequired:1];
//设置单击次数
[singleTap setNumberOfTapsRequired:1];
//把单击手势加到用户头像图片上
[_userImage addGestureRecognizer:singleTap];
} #pragma mark 单击图片响应的方法
- (void)tapUserImage:(UITapGestureRecognizer*)tap
{
NSLog(@"click userImage...");
}
三、选取图片 |
用户头像图片的选取一般为两种,一是直接从手机相册中选择,二是打开照相机现拍一张。无论是哪种方式,都用到同一个类UIImagePickerController。
UIImagePickerController是图片选取控制器,用于从手机相册选取图片,选取图片后,将调用代理中方法,因此在文件的开头,要遵守该类的协议。
代码1:
@interface ViewController ()<UIImagePickerControllerDelegate,UINavigationControllerDelegate>
{
UIImageView *_userImage;
}
@end
代码2:
#pragma mark 单击图片响应的方法
- (void)tapUserImage:(UITapGestureRecognizer*)tap
{
NSLog(@"click userImage...");
[self openThePhotoAlbum];
} #pragma mark 打开系统相册或照相机
- (void)openThePhotoAlbum
{
//创建图片选取器对象
UIImagePickerController * pickerViwController = [[UIImagePickerController alloc] init];
/*
图片来源
UIImagePickerControllerSourceTypePhotoLibrary:表示显示所有的照片
UIImagePickerControllerSourceTypeCamera:表示从摄像头选取照片
UIImagePickerControllerSourceTypeSavedPhotosAlbum:表示仅仅从相册中选取照片。
*/
pickerViwController.sourceType = UIImagePickerControllerSourceTypePhotoLibrary; //允许用户编辑图片 (YES可以编辑,NO只能选择照片)
// pickerViwController.allowsEditing = YES; //设置代理
pickerViwController.delegate = self; [self presentViewController:pickerViwController animated:YES completion:nil];
} #pragma mark 相册协议中方法,选中某张图片后调用方法
- (void)imagePickerController:(UIImagePickerController *)picker didFinishPickingMediaWithInfo:(NSDictionary *)info
{
[self dismissViewControllerAnimated:YES completion:nil]; //头像设置为选中的图片
[info objectForKey:UIImagePickerControllerOriginalImage];
UIImage* image = [info objectForKey:@"UIImagePickerControllerOriginalImage"];
_userImage.image = image;
}
iOS之设置用户头像的圆角的更多相关文章
- Android中通过访问本地相册或者相机设置用户头像
目前几乎所有的APP在用户注册时都会有设置头像的需求,大致分为三种情况: (1)通过获取本地相册的图片,经过裁剪后作为头像. (2)通过启动手机相机,现拍图片然后裁剪作为头像. (3)在APP中添加一 ...
- IOS 设置圆角用户头像
在App中有一个常见的功能,从系统相册或者打开照相机得到一张图片,然后作为用户的头像.从相册中选取的图片明明都是矩形的图片,但是展示到界面上却变成圆形图片,这个神奇的效果是如何实现的呢? 请大家跟着下 ...
- 在Windows客户端自动设置AD用户头像
Windows现在可以设置用户头像,并在开始菜单显示.如果你安装了Exchange或者Lync,那么可以在Outlook或者Skype里看到用户的头像.这个图片是存储在AD用户属性里的.对于桌面电脑的 ...
- app如何更换用户头像信息呢?不妨这样做
对于现在的手机应用而言,要想获得更多的人的使用,就需要给用户更多的自由功能才行,这也是基于用户体验开发软件的核心思想,一切以用户为中心,想用户之所想,做用户之所需.今天我就来谈一谈刚学到的一个关于设置 ...
- iOS常见用户头像的圆形图片裁剪常见的几种方法
在开发中,基本上APP的用户头像的处理都需要把用户所上传的方形图片,处理为圆形图片.在这里就总结三种常见的处理圆形图片的方法. 1.使用位图上下文 2.使用UIView的layer进行处理 3.使用r ...
- ios/iphone手机请求微信用户头像错位BUG及解决方法
转:http://www.jslover.com/code/527.html ios/iphone手机请求微信用户头像错位BUG及解决方法 发布时间:2014-12-01 16:37:01 评论数:0 ...
- iOS UIView设置圆角
UIView设置圆角 1.比较简单的情况,UIView四个角都是圆角: UIView *aView = [[UIView alloc] init]; aView.frame = CGRectMake( ...
- 【绝对干货】仿微信QQ设置图形头像裁剪,让你的App从此炫起来~
最近在做毕业设计,想有一个功能和QQ一样可以裁剪头像并设置圆形头像,额,这是设计狮的一种潮流. 而纵观现在主流的APP,只要有用户系统这个功能,这个需求一般都是在(bu)劫(de)难(bu)逃(xue ...
- 【Mac电脑新手技巧】苹果电脑如何更换用户头像?
想给Mac电脑换一个喜欢的用户头像?苹果电脑的用户头像如何更换? 对于很多Mac小白来说,给自己的Mac换一个可心的用户头像很是必要.但是,大多数Mac新手都觉得无从下手!如果你也想给自己的Mac换一 ...
随机推荐
- ONVIF-WSDL
http://www.onvif.org/onvif/ver10/device/wsdl/devicemgmt.wsdl http://www.onvif.org/onvif/ver10/event/ ...
- [Python爬虫] 之二十八:Selenium +phantomjs 利用 pyquery抓取网站排名信息
一.介绍 本例子用Selenium +phantomjs爬取中文网站总排名(http://top.chinaz.com/all/index.html,http://top.chinaz.com/han ...
- HDU5312 Sequence
题意:t组数据,每组数据给个m.问m最少能由几项形如3*n*(n-1)+1的数表示 eg 7=1(n=1)+1(n=1)+1(n=1)+1(n=1)+1(n=1)+1(n=1)+1(n=1); ...
- 常用命令(过滤、管道、重定向、ping 命令、netstat 命令、ps命令)
常用命令 过滤 过滤出 /etc/passwd 文件中包含 root 的记录 grep 'root' /etc/passwd 递归地过滤出 /var/log/ 目录中包含 linux 的记录 grep ...
- vue - webpack.dev.conf.js for node-portfinder
描述:获取当前可用的port. (vue-cli配置好了,一旦端口被占用,报错,再次运行时会打开:8080+1,依次类推...8080+n) 官网地址:https://www.npmjs.com/pa ...
- css网页单位
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- SurfaceView绘制录音波形图
本文简单记录由View绘制转为SurfaceView绘制的波形图问题. 上代码: public class VoiceLineView extends View { private final int ...
- 代码可读性艺术在Andorid中的体现
前言 最近接手的一些项目,不同的人编码风格迥异,类里的变量.方法的定义穿插,注释极为稀少,更有一些变量和方法的命名非常近似,例如表示播放队列的"playQueue"和表示歌单的&q ...
- 遍历JavaScript某个对象所有的属性名称和值
/* * 用来遍历指定对象所有的属性名称和值 * obj 需要遍历的对象 */ function allPrpos(obj) { // 用来保存所有的属性名称和值 var props = " ...
- PHP中is_*() 函数用法
PHP中is_*() 函数用法 is_a - 如果对象属于该类或该类是此对象的父类则返回 TRUE is_array - 检测变量是否是数组 is_bool - 检测变量是否是布尔型 is_calla ...