美团(iPad)顶部界面的简单实现, 及开发时常见bug
项目功能介绍:
1.支持横竖屏旋转,界面正常显示
2.通过点击界面顶部"美团",可展示出左右双tableView分别显示服务类列表和子类列表
3.通过点击界面顶部"广州",可展示出左右双tableView分别显示所在城市区域和详细地址
4通过点击界面顶部"排序",可展示出所选服务项目的排序列表并选择
详细代码请前往: https://git.oschina.net/null_248_6948/Metuan-for-iPad
一.美团(界面搭建)
#01.搭建导航栏,并设置导航栏的背景
#02.设置导航栏的items
二.美团(导航栏的Items)
#01.创建导航栏items的控制器,以及创建xib,用于描述items
// 加载xib:
#02.分别创建分类的item,区域的item,排序的item
#03.把所有item添加到导航栏的左边items中
三.美团(设置Items的内容)
#01.拖线设置items中的属性
#02.设置方法传入参数并给属性赋值
// func setInfo(...)
#03.设置方法传入参数并监听点击事件
// func addTarget(...)
#04.调用对应方法并给各个item属性传值
#05.调用对应方法添加监听并传值
// @objc fileprivate func categoryItemClick() {...}
四.美团(弹出分类控制器)
#01.创建左右tableViewController
#02.创建Category分类,设置属性,并重写init给每个属性赋值
#03.分别创建左边tableView和右边tableView,并重写init(style...),设置cell样式
#04.创建categoryViewController
// 1.定义私有属性
" categories : [Category] = [Category]()
" lrTableView = LRTableView.loadLrTableView()
// 2.设置Popover在控制器中显示的尺寸
// 3.把leftViewCellr添加到LrTableViewController中
// 3.加载categories.pist
// 4.设置数组接收数据
// 5.字典转模型,给数组拼接内容
#05.在LRTableView中
// 1.托线定义控件属性
// 2.注册重用ID
// 3.(托线)遵守代理和数据源并实现代理方法
" 001.设置左边或右边tableViewCell行数
" 002.给cell属性赋值
" 003.实现数据源,点击cell时: didSelectRowAt
' 1.取出分类: let category = categories![indexPath.row]
' 2.给子类赋值: self.subcategories = category.subcategories
' 3.刷新数据表格: rightTableView.reloadData()
#06.当点击item时,以Popover弹出
// 1.用定义要弹出来的categoryVC,并设置懒加载及Popover样式
" categoryVc.modalPresentationStyle = .popover
// 2.弹出
" categoryVc.popoverPresentationController?.barButtonItem = categoryItem
五.美团(弹出区域控制器)
#01.把模型分出BaseModel,并创建Region模型,并继承BaseModel
#02.给LRTableView设置数据源方法向外界索取数据
#03.对外暴露属性
#04.让分类控制器遵守数据源,并传递数据
#05.创建区域控制器
#06.添加控件属性,并监听区域点击事件
六.美团(设计LRTableView)
#01.继续添加数据源方法
#02.设置代理方法
#03.在点击方法中记录下标识,并通代理
#04.在对应的控制器中实现代理方法
七.美团(弹出排序控制器)
#01.创建排序模型
#02.创建排序控制器
// 1.设置私有属性
// 2.加载数据,(三步)从plist文件中加载
// 3.设置UI界面
// 01.定义常量
// 02.获取数据的个数
// 03.遍历每个数据
" 001.创建button
" 002.设置buttond的属性
" 003.把button添加到Popover上
" 004.监听button的点击事件: 设置通知 -> 交换三部曲 -> 将数据传递出去 -> 消失Popover
// 04.设置显示在Popover上的控制器的尺寸
#03.监听排序item的点击事件
#04.接收通知
#05.监听通知,并将数据展示到topItem中
// 1.取出模型对象
// 2.把内容设置答item中
好了, 顺便再附带一些可能出现的bug的图片吧,希望对你有用












美团(iPad)顶部界面的简单实现, 及开发时常见bug的更多相关文章
- 精美的 ( Android, iPhone, iPad ) 手机界面设计素材和线框图设计工具
在制作界面原型的时候,如果有现成的界面基础元素可以使用的话,设计师就可以非常快速的完成原型的制作,能够节省大量的时间和精力.在这篇文章, 我向大家分享45套非常有用的 UI 和 Wireframe 套 ...
- 学生与部门管理app-产品功能与界面的简单设计
学生与部门管理app-产品功能与界面的简单设计 1. 结对成员学号 我:********* 大佬:*******10 2. 需求分析(NABCD模型) 2.1 N-需求 各个部门在开学初占据学校青春广 ...
- 【React Native开发】React Native控件之Image组件解说与美团首页顶部效果实例(10)
),React Native技术交流4群(458982758),欢迎各位大牛,React Native技术爱好者增加交流!同一时候博客左側欢迎微信扫描关注订阅号,移动技术干货,精彩文章技术推送! Im ...
- Fiddler主界面图标简单说明
Fiddler主界面图标简单说明: 名称 含义 # 抓取HTTP Request的顺序,从1开始,以此递增 Result HTTP状态码 Protocol 请求使用的协议,如HTTP/HTTPS/FT ...
- iPad开发(相对于iPhone开发时专有的API)
iPad开发 一.iPad开发简介 1.什么是iPad 一款苹果公司于2010年发布的平板电脑 定价介于苹果的智能手机iPhone和笔记本电脑产品之间 跟iPhone一样,搭载的是iOS操作系统 2. ...
- 少量代码设计一个登录界面 - .NET CORE(C#) WPF开发
微信公众号:Dotnet9,网站:Dotnet9,问题或建议:请网站留言, 如果对您有所帮助:欢迎赞赏. 少量代码设计一个登录界面 - .NET CORE(C#) WPF开发 阅读导航 本文背景 代码 ...
- Hibernate入门2.简单的项目开发实例
Hibernate入门2.简单的项目开发实例 这一节通过一个简单的项目学习Hibernate项目的配置 代码下载 : 链接: http://pan.baidu.com/s/1zlgjl 密码: p34 ...
- VS2010 简单ATL COM开发
http://blog.csdn.net/wangwenjing90/article/details/8771934#reply http://blog.csdn.net/wangwenjing90/ ...
- 基于Django进行简单的微信开发
代码地址如下:http://www.demodashi.com/demo/11756.html 一.微信公众号的准备: 1. 注册 访问地址:https://mp.weixin.qq.com/ 按照提 ...
随机推荐
- Cobbler学习之二--Cobbler的Web管理和维护
Cobbler的Web管理模块和命令行模块是可以分开工作的,没有依赖关系. 1 WebUI的功能 查看所有的对象和配置文件 添加或者删除system,distro, profile 执行“cobble ...
- CAP定理
from wikipedia CAP定理 CAP定理(CAP theorem),又被称作布鲁尔定理(Brewer's theorem),它指出对于一个分布式计算系统来说,不可能同时满足以下三点: 一致 ...
- H5项目常见问题
转自 https://github.com/FrontEndZQ/HTML5-FAQH5项目常见问题及注意事项 Meta基础知识: H5页面窗口自动调整到设备宽度,并禁止用户缩放页面//一.HTML页 ...
- [转] How to Show Usual Winform as View in XAF
How to Show Usual Winform as View in XAF http://www.codeproject.com/Tips/464188/How-to-Show-Usual-Wi ...
- ubuntu使用经验整理
===================================================== 清理/boot分区 =================================== ...
- 如何让ECSHOP不同的分类调用不同模板方法
如何给ecshop商品分类,显示不同的模板的话.可以通过不同的分类ID来取得不同模板.我们可以通过分类ID来判断,比如分类为1的,调用cat1.dwt.分类为2的,调用cat2.dwt,我们在cate ...
- 拾遗——java多线程
由于sleep()方法是Thread类的方法,因此它不能改变对象的机锁.所以当在一个Synchronized方法中调用sleep()时,线程虽然休眠了,但是对象的机锁没有被释放,其他线程仍然无法访问这 ...
- Python 之 super & MRO (没有遇到过适用场景)
WOW!!! 这里wow的是真尼玛绕且没看完, 好困呐,贴上网址,等自己英文好一点再看(https://rhettinger.wordpress.com/2011/05/26/super-consid ...
- 解压缩c#
protected void btn_ServerClick(object sender, EventArgs e) { string strtxtPath = "E:/ ...
- 图片下载缓存防止OOM
一 ImageManager ImageMemoryCache(内存缓存).ImageFileCache(文件缓存) 关于Java中对象的软引用(SoftReference),如果一个对象具有 ...