先看成品
头像上既不是圆形,也不是方形,好像iOS的控件里也没有这样的异形控件
这样的效果其实是这样做的,
首先
问设计要这样两张图
图一
图二
关键步骤一
将图二添加到图一中 (小图上添加了一个大图)
UIImageView *imageV = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sidebar_icon_tx_kb"]];
UIImageView *imageMaskV = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sidebar_icon_txwk1"]];
为了看的更清楚明白,我self.view的背景色调整一下
于是 会有这种效果
继续调整
把图二的center配置到图一的center
[imageMaskV mas_makeConstraints:^(MASConstraintMaker *make) {
make.center.equalTo(imageV);
}];
于是
填上图片看看效果
继续调整
把图一的内边距和图二对齐
[imageMaskV mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(imageV).insets(UIEdgeInsetsZero);
}];
然后去掉背景色 添加上我们的图 看看效果
完整代码
#import "ViewController.h"
#import "Masonry.h"
@interface ViewController ()
{
}
@property (nonatomic,strong)UIImageView *imageHeadView;
@end
@implementation ViewController
- (void)viewDidLoad {
[super viewDidLoad];
// Do any additional setup after loading the view, typically from a nib.
// self.view.backgroundColor = [UIColor orangeColor];
self.imageHeadView.frame = CGRectMake(30, 30, 60, 60);
self.imageHeadView.image = [UIImage imageNamed:@"22"];
[self.view addSubview:self.imageHeadView];
}
-(UIImageView*)imageHeadView{
if (!_imageHeadView) {
_imageHeadView = [self headImage];
}
return _imageHeadView;
}
-(UIImageView*)headImage{
UIImageView *imageV = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sidebar_icon_tx_kb"]];
UIImageView *imageMaskV = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"sidebar_icon_txwk1"]];
[imageV addSubview:imageMaskV];
[imageMaskV mas_makeConstraints:^(MASConstraintMaker *make) {
make.center.equalTo(imageV);
}];
[imageMaskV mas_makeConstraints:^(MASConstraintMaker *make) {
make.edges.equalTo(imageV).insets(UIEdgeInsetsZero);
}];
return imageV;
}
- (void)didReceiveMemoryWarning {
[super didReceiveMemoryWarning];
// Dispose of any resources that can be recreated.
}
@end