最近遇到一个需要提高用户体验的问题:APP很多地方需要上传图片,上传图片之后就需要删除图片,然后删除图片一般比较小,并且偏右上角,有时候要点击几次或者小心点击才能点击到并触发删除事件,这对于手指比较大就更加困难。所以,为了达到轻松就能点击到删除按钮并删除图片的效果,我们就要在保持删除按钮的图片大小不变的情况下扩大点击区域。 看图:
由于APP上有多处类似的界面,所以我就封装了一个继承于UIButton的类。我的想法并不是扩大按钮的点击区域,而是扩大按钮本身的尺寸同时固定按钮的imageView的大小。下面上代码:
在init方法设置好按钮的普通状态下的图片和高亮状态下的图片
- (instancetype)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
[self setImage:[UIImage imageNamed:@"icon_close"] forState:UIControlStateNormal];
[self setImage:[UIImage imageNamed:@"icon_close_pressed"] forState:UIControlStateHighlighted];
}
return self;
}
调用UIButton本身的接口来设置imageView的位置
- (CGRect)imageRectForContentRect:(CGRect)contentRect
{
return CGRectMake(5, 5, 15, 15);//图片的位置大小
}
然后就在需要的地方按常规的方法初始化[[XXXDeleteBtn alloc] initWithFrame:CGRectMake(x,y,15 + 5x2,15 + 5x2)],15是imageView的大小,再加上上下边沿5,所以是乘以2。
下面再介绍UIButton自带的几个类似的方法
设置UIButton的TitleLabel的位置
- (CGRect)titleRectForContentRect:(CGRect)contentRect;
设置UIButton的内容的位置,也就是imageView和TitleLabel
- (CGRect)contentRectForBounds:(CGRect)bounds;
设置UIButton的背景图片的位置
- (CGRect)backgroundRectForBounds:(CGRect)bounds;