美团(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/ 按照提 ...
随机推荐
- Build Android Webrtc Libjingle Library On Ubuntu
Our team is developing an app to help people solve problem face to face. We choose webrtc protocol a ...
- js多种切换图片
分享通过js实现多种图片切换特效,这里只有手动切换哦,自动效果需自写,效果地址:http://dwz.cn/1drD5u. 下载地址:http://***/download/index/52209 适 ...
- Object-C中代码如何分离接口和实现
使用C#习惯了代码的布局为:public (interface,class with static memebers),internal (class with implementation). 比如 ...
- 【原创】--linux平台下opencv安装
1.到opencv官网下载源码 也可以下载此链接http://pan.baidu.com/s/1mgId5ZM 2.解压到任意目录 可以使用右键-提取到此处,也可以在命令行中使用指令解压(linux中 ...
- JS中json数据的处理
1. json数据结构(对象和数组) json对象:var obj = {"name":"xiao","age":12}; json数组: ...
- Sensor(ACCELEROMETER)
package com.example.sensor01; import java.util.List; import android.hardware.Sensor; import android. ...
- STC12C5A60S2笔记1(管脚定义)
STC12C5A60S2管脚定义 管脚1:标准IO口P1.0.ADC0 模数转换通道0.CLKOUT2 波特率发生器的时钟输出 管脚2:标准IO口P1.1.ADC1 模数转换通道1 管脚3:标准IO口 ...
- Linux 网络编程(IO模型)
针对linux 操作系统的5类IO模型,阻塞式.非阻塞式.多路复用.信号驱动和异步IO进行整理,参考<linux网络编程>及相关网络资料. 阻塞模式 在socket编程(如下图)中调用如下 ...
- C/C++ char* arr与char arr[]的区别(反汇编解析)
写作日期:2016.08.31 修改日期:2016.09.01 .2016.09.02. 交流qq:992591601 用了几天时间复习了下C语言.对于C语言的字符串操作有些不习惯,于是作为练习,写下 ...
- git 修改管理
查看修改: 撤销某一文件的修改(还没提交): 撤销所有文件的修改: git checkout .