iOS Button按钮 热区的放大
Apple的iOS人机交互设计指南中指出,按钮点击热区应不小于44x44pt,否则这个按钮就会让用户觉得“很难用”,因为明明点击上去了,却没有任何响应。
但我们有时做自定义Button的时候,设计图上的给出按钮尺寸明显要小于这个数。例如我之前做过的自定义Slider上的Thumb只有12x12pt,做出来后我发现自己根本点不到按钮……
这个问题在WWDC 2012 Session 216视频中提到了一种解决方式。它重写了按钮中的pointInside方法,使得按钮热区不够44×44大小的先自动缩放到44×44,再判断触摸点是否在新的热区内。
//官方在视频中给出的示例源码
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent*)withEvent
{
CGFloat widthDelta = 44.0 - bounds.size.width;
CGFloat heightDelta = 44.0 - bounds.size.height;
bounds = CGRectInset(bounds, -0.5 * widthDelta, -0.5 * heightDelta);
return CGRectContainsPoint(bounds, point);
}
Apple的iOS人机交互设计指南中指出,按钮点击热区应不小于44x44pt,否则这个按钮就会让用户觉得“很难用”,因为明明点击上去了,却没有任何响应。
但我们有时做自定义Button的时候,设计图上的给出按钮尺寸明显要小于这个数。例如我之前做过的自定义Slider上的Thumb只有12x12pt,做出来后我发现自己根本点不到按钮……
这个问题在WWDC 2012 Session 216视频中提到了一种解决方式。它重写了按钮中的pointInside方法,使得按钮热区不够44×44大小的先自动缩放到44×44,再判断触摸点是否在//官方在视频中给出的示例源码
不过这里有两个小问题:
当定义的Button.frame大于44×44时,这里仍然会将热区缩小至44×44,从而导致超过44×44的按钮热区失去响应。
bounds变量未定义
修正后的代码如下:
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent*)event
{
CGRect bounds = self.bounds;
//若原热区小于44x44,则放大热区,否则保持原大小不变
CGFloat widthDelta = MAX(44.0 - bounds.size.width, 0);
CGFloat heightDelta = MAX(44.0 - bounds.size.height, 0);
bounds = CGRectInset(bounds, -0.5 * widthDelta, -0.5 * heightDelta);
return CGRectContainsPoint(bounds, point);
}
二: 运行时模式 UIButton+LP
// UIButton+LP.h
#import <UIKit/UIKit.h>
@interface UIButton (LP)
@property(nonatomic,assign)CGFloat enlargedEdge;
//-(void)setEnlargedEdge:(CGFloat)enlargedEdge;
//-(float)enlargeEdge;
-(void)setEnlargedEdgeWithTop:(CGFloat)top left:(CGFloat)left bottom:(CGFloat)bottom right:(CGFloat)right;
@end
// UIButton+LP.m
#import "UIButton+LP.h"
#import <objc/runtime.h>
@implementation UIButton (LP)
staticchar topEdgeKey;
staticchar leftEdgeKey;
staticchar bottomEdgeKey;
staticchar rightEdgeKey;
-(void)setEnlargedEdge:(CGFloat)enlargedEdge
{
[selfsetEnlargedEdgeWithTop:enlargedEdge left:enlargedEdge bottom:enlargedEdge right:enlargedEdge];
}
-(float)enlargeEdge
{
return [(NSNumber *)objc_getAssociatedObject(self, &topEdgeKey) floatValue];
}
-(void)setEnlargedEdgeWithTop:(CGFloat)top left:(CGFloat)left bottom:(CGFloat)bottom right:(CGFloat)right
{
objc_setAssociatedObject(self, &topEdgeKey, [NSNumbernumberWithFloat:top], OBJC_ASSOCIATION_RETAIN_NONATOMIC);
objc_setAssociatedObject(self, &leftEdgeKey, [NSNumbernumberWithFloat:left], OBJC_ASSOCIATION_RETAIN_NONATOMIC);
objc_setAssociatedObject(self, &bottomEdgeKey, [NSNumbernumberWithFloat:bottom], OBJC_ASSOCIATION_RETAIN_NONATOMIC);
objc_setAssociatedObject(self, &rightEdgeKey, [NSNumbernumberWithFloat:right], OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}
-(CGRect)enlargedRect
{
NSNumber * topEdge = objc_getAssociatedObject(self, &topEdgeKey);
NSNumber * leftEdge = objc_getAssociatedObject(self, &leftEdgeKey);
NSNumber * bottomEdge = objc_getAssociatedObject(self, &bottomEdgeKey);
NSNumber * rightEdge = objc_getAssociatedObject(self, &rightEdgeKey);
if(topEdge && leftEdge && bottomEdge && rightEdge){
CGRect enlargedRect = CGRectMake(self.bounds.origin.x - leftEdge.floatValue, self.bounds.origin.y - topEdge.floatValue, self.bounds.size.width + rightEdge.floatValue + leftEdge.floatValue ,self.bounds.size.height + topEdge.floatValue + bottomEdge.floatValue);
return enlargedRect;
}else{
returnself.bounds;
}
}
-(UIView *)hitTest:(CGPoint)point withEvent:(UIEvent *)event
{
if(self.alpha <= 0.01 || !self.userInteractionEnabled ||self.hidden){
returnnil;
}
CGRect enlargedRect = [selfenlargedRect];
returnCGRectContainsPoint(enlargedRect, point)?self:nil;
}
@end
iOS Button按钮 热区的放大的更多相关文章
- icon图标和文字整体居中在button按钮
icon图标和文字整体居中在button按钮 icon图标和文字整体居中 一般我们常做的button按钮是文字居中 现在这个需要icon图标和文字一起居中在背景色 <a href="# ...
- button 按钮,结合onclick事件,验证和提交表单
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 如何在MFC界面开发中响应Button按钮的Down和Up事件
通过尝试有两种方案可以解决这个问题,第一种方案是通过PreTranslateMessage函数在调度消息之前对消息类型进行筛选,第二种方案是重载CButton类,在重载后的类CForTestButto ...
- 遭遇input与button按钮背景图失效不显示的解决办法
笔者从事网页前端代码页面工程师已有多年,作为一个网页重构人员常常会遇到一些莫名其妙的DIV+CSS(正确的说法是XHTML+CSS)在 IE.FireFox火狐. 谷歌浏览器CHROME.苹果浏览器S ...
- button按钮
button按钮只加类名不加type时,点击此按钮页面会刷新
- Unity3D NGUI 给button按钮添加单间事件
Unity3D中, NGUI 给button按钮添加单间事件的方法很多,在这里只给推荐一种比较常用的方法. 推荐方法:使用UIListener. 1.给button组价添加上UIListener.选择 ...
- iphone中button按钮显示为圆形解决
iphone中button按钮显示为圆形解决: 添加样式: -webkit-appearance:button; 如果需要为直角: border-radius:0 在源码中添加如:style=&quo ...
- 【html】button按钮的一些问题
问题: button 按钮在不设置 type 属性时,在不同的浏览器作用不一样.举个例子: html: <!doctype html> <html lang="en&quo ...
- RFS_点击button按钮之后,RFS出现卡死的问题
[html代码] <html> <head> <title> 主窗口 </title> </head> <body> <d ...
随机推荐
- struts配置测试中遇到报错信息,记录下
tomcat7 jdk7myeclipse2014 部署完成后,访问页面报错struts.xml文件内容: <?xml version="1.0" encoding=&quo ...
- mysql centeros 安装
http://www.cnblogs.com/xiaoluo501395377/archive/2013/04/07/3003278.html linux mysql允许远程连接 1.登录数据库:my ...
- 手动内存管理与ARC互相转换问题
- python中的yield
在理解yield之前,要首先明白什么是generator,在理解generator之前首先要理解可迭代的概念. 可迭代(iterables)在你创建一个list的时候,可以逐个读取其中的元素,该逐个读 ...
- CPU boot up过程
1. CPU0 BOOT CPU1 BOOT 通过IPC互相通信 2. CPU1 BOOT 完后,loop,等待IPC from CPU0 3. cpu0 写IPC通知CPU1,cpu1 ...
- [转] FastJson---高性能JSON开发包
原文地址: FastJson---高性能JSON开发包 Fastjson介绍 Fastjson是一个Java语言编写的JSON处理器,由阿里巴巴公司开发.1.遵循http://json.org标准,为 ...
- linux第1天 fork exec 守护进程
概念方面 文件是对I/O设备的抽象表示.虚拟存储器是对主存和磁盘I/O设备的抽象表示.进程则是对处理器.主存和I/O设备的抽象表示 中断 早期是没有进程这个概念,当出现中断技术以后才出现进程这个概念 ...
- git批量删除分支
要删除本地,首先要考虑以下三点 列出所有本地分支 搜索目标分支如:所有含有'dev'的分支 将搜索出的结果传给删除函数 所以我们可以得到: git br |grep 'dev' |xargs git ...
- php扩展的基本安装
phpize ./config --with-php-config=.. make&make install php.ini
- 直关的sql 联级更新语句
在sql-server中用这种写法最直观:UPDATE a SET a.c = b.c FROM table1 ainner join table2 b on b.a=a.aWHERE a.c is ...