前段时间有小伙伴问到我:"这样的控件该怎么作呢?",我感受是个比较简单的控件,可能对于入行不久的同志思路没有很清晰吧。趁着最近工做不忙,就来这里分享一下我封装自定义控件的几点体会吧。git
一个良好的自定义控件,能大大减小控制器里的代码,让代码在它最应该在的地方,显得层次清晰。此外,一个没有耦合的自定义控件,能拿到以后的任何项目中用,提升开发效率。接口友好、使用简单、不存在耦合、代码层次清晰易维护等是一个好控件的必备素质。项目中常见的自定义控件,每每是一些弹窗,方便用户进行查看、输入、选择等操做。github
下面贴出我最近封装的三个控件代码、效果图和思路分析。数组
1、时间选择器服务器
1. 使用方法:先调用show方法,再定义回调block。ide
2. 效果截图:控件内部加入了时间过滤(截图时间12-09 09:55)并记忆了上次的选择,无耦合。工具
3. 思路分析:这个即是小伙伴问到个人控件,这个控件当时是用于这样的场景:用户约时间咨询专家,经过这个控件选择一个时间点。个人思路以下:spa
1) 分析界面(view):设计
这个界面上部分是一个工具条,左右两个按钮分别切换到上一天/下一天,中间的lable显示日期和星期几。再看中间的12个按钮,每一个按钮都表明某一个时间点,有可点击状态/不可点击状态/选中状态三种样式,在Demo中我用的是按钮来实现,用collectionView应该能让代码更简洁。blog
同时须要考虑到,用户每切换到另外一天,控件须要刷新一下,要根据新的一天里,专家空闲时间(服务器返回),来刷新中间12个按钮的显示样式[可预定/不可预定/当前选择]。接口
2) 分析数据(model):
先分析当前展现的一天中须要的数据,咱们须要告诉用户该专家哪些时间点可预定,哪些不可预定,用一个字段来表示就能够了,这里一共是12个时间点,也就是说这个控件的每一次展现,须要一个有12个元素的数组,这12个元素分别对应这12个时间点是否可预定。
假设咱们容许用户的预定范围是将来一周,那么这个控件就须要一个包含7个子数组的大数组,每一个子数组有12个元素,是专家某一天的能否预定的数据。好,因此控制器须要给这个控件一个大数组。
3) 上一天/下一天按钮的点击事件处理:
更多分析详见Demo。
2、自定义多行输入框
1. 使用方法:先设置数据,再调用show方法,最后定义回调block。
2. 效果截图:控件内部加入了手机号、邮箱检测方法,无耦合; 非法提示方式也较合适。
3. 思路分析:这个控件很简单,用起来也很方便,控件内部会根据传进来的数据决定展现几行输入框出来,内部有作了数据的合法性检查、键盘处理等...思路倒没什么好说的...
3、日期选择器
1. 使用方法:先调用show方法,再定义回调block。
2. 效果截图:控件内部加入了简单的时间判断和非法选择时的提示,只有当时间合法时,才调用回调block,传递合法的时间string出去。
3. 思路分析:好吧,这个控件更简单了...
4、小结
当我拿到设计图时,第一步先分析界面什么地方应该是什么控件,再分析须要控制器传过来什么数据,而后把须要暴露的属性放在h文件里,不须要暴露的属性放在m文件里。我封装的自定义控件,一直努力作到如下两点:
1. 接口友好,使用尽可能简单。显示就是show,隐藏就是hide,不须要控制器来完成显示和隐藏的代码,控制器只须要告诉我何时show,何时hide就行。
2. 该封装的封装好,减小控制器里的代码。控制器只须要关心给你什么数据、何时让你show、何时让你hide和你的点击事件我应该怎么处理。而不去关心你怎么展现数据、怎么处理数据等。
Demo的github地址:https://github.com/banchichen/SomeGoodCustomView
欢迎你们也把本身经常使用好用的自定义控件分享上去...也欢迎你们对其中瑕疵之处进行批评指正...