iOS开发 - 第02篇 - UI进阶 - 14 - 彩票(第一天)

实现：彩票框架

源代码下载地址：点击打开链接

1、环境部署

1> 项目前缀：把项目名称里面的大写抽出来

2> 支持iOS6，iOS7

3> 不支持横竖屏

4> 导入图标和启动图片

5> 程序启动的时候，隐藏状态栏，iOS6需要恢复状态栏显示

6> 设置状态栏颜色，iOS7默认状态栏交给控制器管理，修改info.plist文件，让状态栏交给application管理

7> 项目文件夹按模块划分，Main(主框架，自定义tab控制器)，Other(存放其他头文件和.m文件(main，代理，pch(头文件)，第三方框架等)，注意需要修改pch路径

2、搭建项目主框架

2.1 Storyboard主框架搭建

1> 修改窗口的根控制器：窗口的根控制器是UITabBarController，Tab里面的子控制器是导航控制器，因为每个导航条的标题不一样。

2> 修改导航控制器的根控制器，默认拖出来的是UITableViewController，改为普通的UIViewController，并设置不同的背景颜色

2.2 设置tabBar上按钮的图片

1> 存在的问题：设置tabBar上面的按钮图片不好使，tabBarButton的图片有规格，不能正常显示

2> 解决方式：

1. 创建自定义ILTabBarViewController，关联

2. 自定义tabBar，系统自带的tabBar上的tabBarButton都不好使，搞个自己的tabBar添加UIButton，注意继承UIView，因为UITabBar里面的子控件根本用不上

3. 自定义tabBar，添加5个按钮，显示图片

注1：layoutSubViews方法中设置按钮位置

注2：监听按钮点击，设置按钮选中状态

注3：默认选中第一个

注4：取消高亮，自定义ILTabBarButton(继承自UIButton)，重写setHeight方法(不做任何操作)

2.3 点击ILTabBarButton控制器切换

只有UITabBarController设置selectedIndex才可以切换控制器，但是UITabBarController不知道当前选中哪个按钮

解决方式：用代理或者block把角标传给控制器

2.4 完善tabBar的封装

1> tabBar里面的按钮应该由控制器决定，提供一个方法，给控制器添加按钮，系统自带的tabBar里有多少按钮也是根据控制器个数决定的

2.5 自定义导航控制器

1> 第一个导航控制器的根控制器(购彩大厅)ILHallViewController，导航条文字，右侧Item资讯(图片+文字)

注1：UIBarButtonItem只能显示文字或者图片，不能全部显示，可以直接拖UIButton到UIBarButtonItm中，间距用属性面板的inset调整

注2：应该点击UIButton进行控制器跳转，点击UIBarButtonItem无用

2> push控制器的时候，隐藏底部tabBar

方法一：直接Storyboard修改

注：但是此时隐藏不了，因为在2.1节中已经先把系统自带的tabBar移除，而勾选这个只是隐藏系统自带的tabBar，因此，应该将自定义的ILTabBar添加到系统自带的tabBar上面[self.tabBar addSubView:tabBar];

方法二：自定义ILNavigationController，重写pushViewController

2.6 设置导航条外观

设置导航条的外观(背景图片和文字)，只需要设置一次

1> 为什么要获取整个应用程序的导航条外观？避免拿到一个一个导航控制器去设置导航条的外观

2> 怎么获取？UINavigationBar *navBar =[UINavigationBar appearance] 只要遵守UIAppearance这个协议，都可以这样获取

3> 设置导航条的背景颜色，iOS7和iOS6是不一样的

iOS7：控制器包括状态栏20的高度，导航条的高度为64，会自动把状态栏20的高度填充

iOS6：状态栏20的高度不属于控制器，导航条高度44，用44高度的图片

4> 定义宏，方便适配 #define iOS7 ([[UIDevice currentDevice].systemVersionfloatValue] >= 7.0)

注：适配多处地方需要使用，放在pch文件中

5> 设置导航条文字颜色

注意事项：

1> 为什么要自定义导航控制器？拦截push操作，重写push方法，在push的时候，隐藏底部条，就不需要一个控制器一个控制器的勾选Hide Bottom Bar on Push

2> 在自定义导航控制器设置导航条外观

3> 在initialize里设置：导航条外观只需要设置一次

4> initialize：在第一次使用这个类或者子类的时候调用

5> initialize里判断下是否是本类调用，是才需要设置导航条，保证设置一次主题。self == [ILNavgationController class]

2.7 自定义导航条titleView

合买跟单：titleView需要自定义按钮，设置内部的位置(文字在左边，图片在右边)

1> 自定义ILTitleButton(继承自UIButton)

2> 重写titleRectForContentRect和imageRectForContentRect方法

3> 修改内部子控件的尺寸

1. 获取当前文字：self.currentTitle

2. 获取当前文字尺寸，计算内部Label的尺寸。

3. 图片尺寸：假设图片宽度30，x = contentRect.size.width - 30

注1：titleRectForContentRect内部不能调用self.titleLabel，会造成死循环，因为self.titleLabel内部会调用titleRectForContentRect

注2：boundingRectWithSize在iOS7才有，iOS6没有这个方法，需要判断使用。

注3：多版本处理#import <Availability.h>

1. 理解编译时报错和运行时报错

2. 运行时报错：在SDK7.0的环境(Xcode5)编译boundingRectWithSize，是不会报错的，但是运行在iOS6的系统上会报错，iOS6没有这个方法，需要判断当前运行在哪个系统，用iOS7宏判断

3. 编译时报错：在SDK6.0的环境(Xcode4.6)编译boundingRectWithSize，是直接报编译错误，因为SDK6.0没有这个方法

3、我的彩票(登录界面)

3.1 界面

3.2 存在问题

1> 观察UIImageView的y值

2> UIImageView的y值在iOS6和iOS7不一样。

原因：

1. iOS6，iOS7控制器View的尺寸不一样。

2. iOS6里主流框架中，导航控制器的根控制器View的尺寸，很小，iOS6控制器从导航条开始，iOS7从屏幕左上角开始，包含状态栏。

3. iOS7多了一个edgesForExtendedLayout属性，才让导航控制器的根控制器View的尺寸和屏幕一样大，edgesForExtendedLayout可以让控制器上下左右扩展

解决：

1. 通过代码判断下，调整在iOS7和iOS6的UIImageView的位置，这种方式麻烦，因为界面是固定的，用XIB或者Storyboard描述更省时间

2. 找到我的彩票控制器，告诉他不要上下扩展就好了，找到Extend Edages，把Under Top Bars 和 Under Bottom Bars取消选中

3. 一般开发中，如果不需要滚动的控制器，就不需要扩展，因为不需要有穿透效果

4. 在iOS7取消我的彩票控制器的上下扩展，这时候iOS7导航控制器的根控制器View的尺寸就和iOS6一样的了

5. autolayout解决运行在3.5英寸上图片被拉伸

3.3 登录按钮拉伸

1> 拉伸图片中间一个像素点

2> 通过Storyboard只能拉伸UIImageView

注：Storyboard中x：表示左边多少不拉伸y：表示上边多少不拉伸w：表示宽度拉伸多少个像素h：表示高度拉伸多少个像素

x：0.5(左边一半不拉伸) y：0.5(顶部一半不拉伸) w：0 (宽度拉伸一个像素) h：0(高度拉伸一个像素)

3> 拉伸按钮，必须通过代码

4> 自定义登录控制器loginViewController

5> UIImage抽分类resizableImageWithName(Other/Category目录)

3.4 设置导航条上的按钮背景 & 颜色

右上角设置按钮的颜色和返回按钮的颜色默认是蓝色，需要设置为白色

1> 应用程序所有导航条上的UIBarButton都需要设置白色的

2> UIBarButton在导航条上，所以设置导航条的主题颜色就好了

3> 获取整个应用程序的外观，设置主题颜色

[UINavigationBar setTintColor:];

4> 只需要设置一次，并且跟导航控制器有关系，在导航控制器里的initialize里设置，并且之前在导航控制器拿到了整个应用程序的导航条

5> 设置iOS6上应用程序所有导航条上的按钮背景

1. 导航条白色主题只有在iOS7才需要设置

2. 设置导航条上的UIBarButton背景，只有在iOS6才需要设置

3. UIBarButton由UIBarButtonItem决定

4. 获取整个应用程序的UIBarButtonItem，设置整个应用程序的UIBarButton，避免一个控制器一个控制器的设置

5. UIBarButtonItem setBackgroundImage // 设置按钮背景

6. UIBarButtonItem setBackButtonBackgroundImage // 设置返回按钮背景