美团(iPad)顶部界面的简单实现, 及开发时常见bug

一.美团(界面搭建)

#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的图片吧,希望对你有用

时间: 2024-12-29 09:56:47

美团(iPad)顶部界面的简单实现, 及开发时常见bug的相关文章

精美的 ( Android, iPhone, iPad ) 手机界面设计素材和线框图设计工具

在制作界面原型的时候,如果有现成的界面基础元素可以使用的话,设计师就可以非常快速的完成原型的制作,能够节省大量的时间和精力.在这篇文章, 我向大家分享45套非常有用的 UI 和 Wireframe 套件素材包,帮助设计们用于 Web 和 Mobile 项目的界面原型设计. Android 2.2 GUI 整套 Android 2.2 手机界面 UI 组件素材,非常精美! Big Block UI 下拉列表,开关切换按钮,搜索框以及单选,多选按钮等. Stencil kit 滑块控制,开关按钮等组

Android 自定义view实现上下滑动,大众点评,美团地图导航界面。

主函数: package com.example.slideview; import com.example.fdadsf.R; import android.os.Bundle; import android.widget.ArrayAdapter; import android.widget.LinearLayout; import android.widget.ListView; import android.app.Activity; /** * 滑动菜单Demo主Activity *

简单的iOS开发实例

项目需求 写一个iPhone应用程序,要求可以输入名字,点击按钮后,会显示一段文字向输入的名字打招呼,例如输入“宝玉”,显示“你好,宝玉!” 需求分析 这是一个很简单的应用程序,包含一个文本输入框,一个文本显示框,一个按钮.输入名字到文本输入框,再点击按钮,这时文本显示框的文字就会变成“你 好,<名字>!”.但是要注意,如果用户输入为空,要有警告提示用户重新输入:如果用户输入文字太长,超过16个字符,要自动截断. 产品设计 根据项目需求,画出相应的产品原型图: 初始状态 初始时,文本输入框为空

[转]微信公众平台开发(四) 简单回复功能开发

本文转自:http://www.cnblogs.com/mchina/p/3155072.html 一.简介 微信公众平台可以根据用户发送的信息进行判断,然后给出对应的回复,具有良好的交互性.下文将模拟简单的回复功能,根据这个案例,开发者也可以基本理解微信交互的原理,进行更深层次的开发. 二.思路分析 用户发送过来的文本信息,我们可以提取关键字,通过简单的 if...elseif...else... 实现. 关键代码如下: if($keyword=="你好"){ $contentStr

在jqueryEasyUI界面将时间以日期加时分秒的格式显示

问题描述: oracle 10G中用户表有一个字段是日期型,数据格式为yyyy-MM-dd HH:mm:ss,前端显示时只能显示成yyyy-MM-dd 后面的 HH:mm:ss不显示. 经过一番痛苦的原因分析,发现应该将用户实体的日期类型由java.sql.Date修改成java.util.Date型,并且对 jackson进行如下处理: private void Test(MyUser user) { ObjectMapper mapper = new ObjectMapper(); Writ

微信公众平台开发(四) 简单回复功能开发

原文地址:http://www.cnblogs.com/mchina/p/3155072.html 一.简介 微信公众平台可以根据用户发送的信息进行判断,然后给出对应的回复,具有良好的交互性.下文将模拟简单的回复功能,根据这个案例,开发者也可以基本理解微信交互的原理,进行更深层次的开发. 二.思路分析 用户发送过来的文本信息,我们可以提取关键字,通过简单的 if...elseif...else... 实现. 关键代码如下: if($keyword=="你好"){ $contentStr

解决Xcode在ipad/iphone 9.2 系统真机测试时出现could not find developer disk image问题

解决Xcode在ipad/iphone 9.2 系统真机测试时出现could not find developer disk image问题 方法1:拷贝这个文件(http://download.csdn.net/detail/cvbtvbwu/9340467)到/Applications/Xcode.app/Contents/Developer/Platforms/iPhoneOS.platform/DeviceSupport,然后重新启动xcode(完全退出)就可以了. 方法2:更新Xcod

webpack4从零配置搭建简单的React16开发环境

写在最前 暑假想要学习React, 发现React官网上的没有说明如何搭建React开发环境, 网上找的很多都是基于webpack3的, 或者直接使用脚手架, 所以趁着放假, 就稍微学了下webpack, 开始搭建自己的React项目. 第一次写博客, 如有错误, 请指出, 谢谢! 之后也会继续更新从零搭建React全家桶系列, react+react-router+redux+es6. 希望大家多多支持. 说明 开发环境是windows 10 技术栈版本 node 10.3.0 npm 6.1

UITableView(微博界面的简单搭建)

通过MVC的设计模式,设计微博界面 1.M--Model 1)数据Model 1>声明 #import <Foundation/Foundation.h> @interface CZStatus : NSObject // 用户头像 @property (nonatomic, copy) NSString *icon; // 用户名 @property (nonatomic, copy) NSString *name; // 会员 @property (nonatomic, assign