自定义button的点击区域

某些情况下我们需要按钮有不规则的形状,在这些形状内点击才有响应,例如下面的图片中:

图片中红线圈出的两处都是用按钮做的,按钮的实际布置是上面第二张图所画的那样,所有按钮都是矩形的,但是中间的按钮和一圈的转盘形状都不可能用矩形,否则点击的时候难免相互影响。

那么如何自定义按钮点击的有效区域呢,其实很简单,只要重写一个函数即可:

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event

系统发生触摸事件的时候会从window到父控件到子控件一个个检测触摸点是否在其中,如果在其中,则返回YES,最后返回YES的子控件作为响应事件的控件。

我们只要重写这个方法,在其中判断,是否点击了我们想要的区域,是的话就返回YES,否则返回NO,这样就实现了自定义点击的有效区域了。注意,这边并没有改变按钮的形状,按钮还是矩形的按钮,只是改变了按钮中响应区域而已。

那么接下来的问题就是,怎么判断一个点是否在一个不是矩形的区域中呢,这边可以使用UIBezierPath的方法:

- (BOOL)containsPoint:(CGPoint)point;

我们可以先根据想要的形状绘制一条path,然后判断调用上面的方法去判断即可。

例如,我自定义了上面圆盘中心的圆形按钮,重写了函数,实现只有点击圆形区域按钮才有用。

- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
    //首先调用父类的方法确定点击的区域确实在按钮的区域中
    BOOL res = [super pointInside:point withEvent:event];
    if (res) {
        //绘制一个圆形path
        UIBezierPath *path = [UIBezierPath bezierPathWithOvalInRect:self.bounds];
        if ([path containsPoint:point]) {
            //如果在path区域内,返回YES
            returnYES;
        }
        returnNO;
    }
    returnNO;

}

圆盘周围的按钮则比较复杂一些,我取巧的只画了一个三角形,这样效果几乎跟弧形差不多。

//自定义圆盘周围星座按钮的点击区域
- (BOOL)pointInside:(CGPoint)point withEvent:(UIEvent *)event {
    BOOL res = [super pointInside:point withEvent:event];
    if (res) {
        //画了一个三角形的path,形状跟弧形接近,点击效果几乎没什么区别
        UIBezierPath *path = [UIBezierPath bezierPath];
        [path moveToPoint:CGPointMake(self.bounds.size.width/2,self.bounds.size.height)];
        [path addLineToPoint:CGPointMake(0,0)];
        [path addLineToPoint:CGPointMake(self.bounds.size.width,0)];
        [path addLineToPoint:CGPointMake(self.bounds.size.width/2,self.bounds.size.height)];
        if ([path containsPoint:point]) {
            returnYES;
        }
        returnNO;
    }
    returnNO;

}

最后,对自定义按钮重写以上方法后按钮的有效区域就像下图所示的用蓝色和绿色框线标注出来的那样,只有在这个区域内点击才有效:

时间: 2024-08-01 14:17:01

自定义button的点击区域的相关文章

ios 添加到cell 上的button点击无效!扩大button的点击区域(黑魔法)

一般情况下点击效果都是正常的!要不然你对它做了什么?一般细心的小伙伴都没有遇到这种情况,但是呢! 当然我是二班的!在这里我主要讲两个问题,解决问题和普及魔法. 一.普及问题(button在cell上点击无效) 自定义一个cell,cell里边creat了一个button!然后调试了半天,什么反应都没有! 1.button的enable 设置为yes可点击的. 1.我以为我设置了交互禁用! self.userInteractionEnabled = YES; 2.button的frame越界了!

IOS开发之自定义Button(集成三种回调模式)

前面在做东西的时候都用到了storyboard,在今天的代码中就纯手写代码自己用封装个Button.这个Button继承于UIView类,在封装的时候用上啦OC中的三种回调模式:目标动作回调,委托回调,Block回调.具体的内容请参考之前的博客:“Objective-C中的Block回调模式”,“Target-Action回调模式”,“Objective-C中的委托(代理)模式”.在接下来要封装的button中将要用到上面的知识点.之前在做新浪微博中的Cell的时候用到了Block回调来确定是那

Firemonkey 自定义Button的Style

这篇文章模仿HTML中基于CSS的Button,通过Style实现自定义样式的Button. 前言 主要模仿的CSS代码如下: CSS Code 123456789101112131415161718192021222324252627   a.button{    text-align:center;    display:block;    width:50px;    color:#fff;    text-decoration:none;    font-weight:700;    l

iOS_Swift初识之使用三种回调方式自定义Button

最近在学习Swift ,发现青玉伏案大神早期用OC写的一篇博客--IOS开发之自定义Button(集成三种回调模式)  很适合用来熟悉Swift的回调方式,于是我就用Swift翻版了一下,具体实现原理就不多说了,主要贴上Swift的代码给大家看看.由于刚开始了解Swift,有使用不恰当的地方请轻拍.... 上代码: 1.新建一个xib,拖一个UIView到界面上,绑定上自定义的UIView类,拖一个UILabel到view上,写上Button假装是个UIButton:并将label拖到代码当中

通过UIView来模拟 实现 Button的点击效果

首先建立根视图 在根视图上实现以下功能: 通过MyButton 实现 button的点击效果 首先建立一个类:MyButton这个类 1.在MyButton.h文件中写一个自定义的方法,把目标和对应的动作传过来 原代码: -(void)addNewTarget:(id)target Action:(SEL)action; target :目标 ,button 执行哪一个类的方法,对应的目标就是那个类的对象 action:动作 ,让button具体做什么事,执行的方法就是对相应的动作 2.在MyB

android ListView中的Item有Button时候点击异常处理

1.当ListView中有Button的时候往往会遇到很多问题,比较常见的一个问题是: 假设:在ListView中有N个Item当点击其中某个Item中的Button的时候,需要改变当前Button的状态,在你点击以后确实最后一个Item的Button的状态改变了,不管点击哪一个Button都是最后一个 Item的中的Button的状态被改变了,这里涉及到ListView重绘的问题. 要解决上面的问题的方法是将点击的监听事件提出来进行封装,在用就可以解决上述问题了. 给个示例代码: 在ListV

iOS自定义backBarButtonItem的点击事件

最近遇到一个关于导航栏返回按钮的问题,因为之前项目里面都是用的系统默认的返回按钮样式所以没有想过要去更改,后来有需要将返回按钮箭头旁边的文字去掉,同时将该返回按钮的点击事件重新定义.一开始尝试自定义按钮然后设置为leftBarButtonItem,但是这样图片可能跟系统自带的不一样,还有就是返回按钮的位置跟系统自带的不一样.后来找了一些资料,发现将文字去掉比较简单,一般做法是控制器中添加如下代码,然后他的下一级控制就有一个只有箭头没有文字返回按钮: UIBarButtonItem *backBt

在UITableView的 didSelectRowAtIndexPath中获取点击区域

项目中,要在UITableViewCell区分不同的点击区域,比如左边点击执行某个操作,右边点击执行另一个操作.原本我的方案是在cell的左边和右边各放一个透明的UIButton,点击两个button执行不同的操作,而controller中的didSelectRowAtIndexPath函数就设为空了.但是后来有个问题,就是可以同时用多个手指长按在不同的cell上,导致触发过个操作,而且cell的选中态也不好控制. 后来想到,UIview的触摸事件可以得到触摸的位置,那可不可以在cell的tou

android中样式和自定义button样式

1)自定义button样式 一.采用图片方式 首先新建Android XML文件,类型选Drawable,根结点选selector,自定义一个文件名. 随后,开发环境自动在新建的文件里加了selector结点,我们只需要在selector结点里写上三种状态时显示的背景图片(按下.获取焦点,正常)即可.具体如下: <?xml version="1.0" encoding="utf-8"?> <selector xmlns:android="