第一个项目之四--UINavigationController
再续前缘
这次还是对UITableView就是修修补补。这次给他加上一个UINavigationController,这个有什么用?字面意思啊!导航啊!
当你需要跳转到下一个页面的时候,用UINavigationController将下一个页面放到栈顶。恩,就是这么用的。
<br />
又要对AppDelegate动手啦
为了能使UITableView作为根视图可以实现页面跳转,我们就要对AppDelegate下手。将根视图控制器由RootViewController更换为UINavigationController,再将RootViewController作为UINavigationController的根视图。
大概关系就是这样:
UIApplication -- UIWindow -- UINavigation -- RootView -- UITableView -- UITableViewCell
AppDelegate.m
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions {
// Override point for customization after application launch.
self.window = [[UIWindow alloc] initWithFrame:[[UIScreen mainScreen] bounds]];
self.window.backgroundColor = [UIColor grayColor];
RootViewController *instance_rootView = [[RootViewController alloc]init];
[instance_rootView.view setFrame:self.window.frame];
UINavigationController *instance_navigation = [[UINavigationController alloc]initWithRootViewController:instance_rootView]; //初始化UINavigationController,并将RootViewController作为其根视图
self.window.rootViewController = instance_navigation; //再将UINavigationController作为UIWindow的根视图
[self.window makeKeyAndVisible];
return YES;
}
现在Run一下,就能看到效果了:
效果上面多了一条白色的条条,那个就是导航条了。导航条上面可以放什么?可以放按钮、标题等等很多。
但是这个好像不太美观啊,我们做下全局样式的变动吧。
在此之前,我要先打包一个全局类,将一些比较常用,但是又麻烦的方法封装在里面。
CommonHandler
CommonHandler.h
#import <Foundation/Foundation.h>
#import <UIKit/UIKit.h>
@interface CommonHandler : NSObject
+(UIColor *)getColorWithRGB:(int)rgb;
+(UIColor *)getColorWithRed:(float)red andGreen:(float)green andBlue:(float)blue andAlpha:(float)alpha;
@end
CommonHandler.m
#import "CommonHandler.h"
#define RGB(r, g, b) [UIColor colorWithRed:((r) / 255.0) green:((g) / 255.0) blue:((b) / 255.0) alpha:1.0]
#define RGBAlpha(r, g, b, a) [UIColor colorWithRed:((r) / 255.0) green:((g) / 255.0) blue:((b) / 255.0) alpha:(a)]
#define HexRGB(rgbValue) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:1.0]
#define HexRGBAlpha(rgbValue,a) [UIColor colorWithRed:((float)((rgbValue & 0xFF0000) >> 16))/255.0 green:((float)((rgbValue & 0xFF00) >> 8))/255.0 blue:((float)(rgbValue & 0xFF))/255.0 alpha:(a)]
@interface CommonHandler()
@end
@implementation CommonHandler
+(UIColor *)getColorWithRGB:(int)rgb{
return HexRGB(rgb);
}
+(UIColor *)getColorWithRed:(float)red andGreen:(float)green andBlue:(float)blue andAlpha:(float)alpha{
return RGBAlpha(red, green, blue, alpha);
}
@end
<br />
对导航条动刀了
就这样,一个快速获取颜色的公共类就搞定了,比自带的更方便了。
依旧是对AppDelegate动手。
AppDelegate.m
[[UINavigationBar appearance] setBarTintColor:[CommonHandler getColorWithRGB:0xFFB6C1]];
[[UINavigationBar appearance] setBarStyle:UIBarStyleBlackTranslucent];
就加上这两句,就完了。
Paste_Image.png<br />
导入AlertMessage
前面因为无聊,弄了个AlertMessage自定义类,现在可以移植到这里来做测试了!
因为已经打包好了,直接将两个文件复制进项目就可以直接用了。在这里我放出代码:
AlertMessage.h
#import <UIKit/UIKit.h>
@interface AlertMessage : UIView
-(id)initWithY:(CGFloat)y andTitle:(NSString *)title;
-(id)initWithY:(CGFloat)y;
-(id)initWithTitle:(NSString *)title;
-(void)setStartWithY:(CGFloat)y;
-(void)setTitle:(NSString *)title;
-(void)showWithCover:(BOOL)boolean;
-(void)dismiss;
-(void)setTitleColor:(UIColor *)titleColor;
-(void)setAlertColor:(UIColor *)alertColor;
-(void)setAlertColor:(UIColor *)alertColor andTitleColor:(UIColor *)titleColor;
-(void)setDismissOnLeft:(BOOL)isOnLeft;
@end
然后就是实现文件
AlertMessage.m
#import "AlertMessage.h"
#define HEIGHT_ALERT 55
#define WIDTH_ALERT 180
#define Y_OFFSET_ALERT 100
#define X_OFFSET_ALERT (320 - WIDTH_ALERT)
#define HEIGHT_TITLE 25
#define GAP_DEFAULT 10
#define FONT_TITLE [UIFont systemFontOfSize:16]
#define RGB(r, g, b) [UIColor colorWithRed:(r)/255.f green:(g)/255.f blue:(b)/255.f alpha:1.f]
@interface AlertMessage()
@property (nonatomic, strong) NSString *string_title;
@property (nonatomic, strong) UIColor *color_title;
@property (nonatomic, strong) UIColor *color_background;
@property (nonatomic, strong) UILabel *lb_title;
@property (nonatomic, strong) UIButton *btn_cover;
@property (nonatomic, assign) BOOL isOnLeft;
@property (nonatomic, assign) CGFloat y;
@end
@implementation AlertMessage
/*
// Only override drawRect: if you perform custom drawing.
// An empty implementation adversely affects performance during animation.
- (void)drawRect:(CGRect)rect {
// Drawing code
}
*/
- (id)initWithFrame:(CGRect)frame
{
self = [super initWithFrame:frame];
if (self) {
// Initialization code
}
return self;
}
-(id)initWithY:(CGFloat)y andTitle:(NSString *)title{
self = [self initAlert];
if(self){
[self setStartWithY:y];
[self initContentWithTitle:title];
}
return self;
}
-(id)initWithY:(CGFloat)y{
self = [self initAlert];
if(self){
[self setStartWithY:y];
}
return self;
}
-(id)initWithTitle:(NSString *)title{
self = [self initAlert];
if(self){
[self initContentWithTitle:title];
}
return self;
}
-(id)initAlert{
self = [self initWithFrame:CGRectMake([UIScreen mainScreen].bounds.size.width, Y_OFFSET_ALERT, WIDTH_ALERT, HEIGHT_ALERT)];
if(self){
self.y = Y_OFFSET_ALERT;
self.backgroundColor = [UIColor blackColor];
[self setAlpha:0.85];
self.isOnLeft = NO;
}
return self;
}
-(void)setStartWithY:(CGFloat)y{
self.y = y;
self.frame = CGRectMake([UIScreen mainScreen].bounds.size.width, self.y, WIDTH_ALERT, HEIGHT_ALERT);
}
-(void)setTitle:(NSString *)title{
self.string_title = [NSString stringWithString:title];
self.lb_title.text = self.string_title;
}
- (void)initContentWithTitle:(NSString *)title{
self.string_title = [NSString stringWithString:title];
self.lb_title = [[UILabel alloc]initWithFrame:CGRectMake([UIScreen mainScreen].bounds.size.width + GAP_DEFAULT, (HEIGHT_ALERT - HEIGHT_TITLE) / 2 + self.y, WIDTH_ALERT, HEIGHT_TITLE)];
self.lb_title.text = self.string_title;
self.lb_title.textColor = [UIColor whiteColor];
self.lb_title.font = FONT_TITLE;
}
-(void)showWithCover:(BOOL)boolean{
CGRect rect_cover = CGRectZero;
if(boolean){
rect_cover = [UIScreen mainScreen].bounds;
}
self.btn_cover = [UIButton buttonWithType:UIButtonTypeCustom];
[self.btn_cover setFrame:rect_cover];
[self.btn_cover setBackgroundColor:[UIColor clearColor]];
[self.btn_cover addTarget:self action:@selector(dismiss) forControlEvents:UIControlEventTouchUpInside];
[self.btn_cover addSubview:self];
[self.btn_cover addSubview:self.lb_title];
UIWindow *window = [UIApplication sharedApplication].keyWindow;
[window addSubview:self.btn_cover];
[UIView animateWithDuration:0.35f animations:^{
[self setFrame:CGRectMake([UIScreen mainScreen].bounds.size.width - WIDTH_ALERT, self.y, WIDTH_ALERT, HEIGHT_ALERT)];
[self.lb_title setFrame:CGRectMake(self.frame.origin.x + GAP_DEFAULT, (HEIGHT_ALERT - HEIGHT_TITLE) / 2 + self.y, WIDTH_ALERT, HEIGHT_TITLE)];
} completion:^(BOOL finished) {
}];
}
-(void)dismiss{
CGFloat endPoint;
CGFloat duration;
if(self.isOnLeft){
duration = 0.5;
endPoint = 0 - WIDTH_ALERT;
}else{
duration = 0.3;
endPoint = [UIScreen mainScreen].bounds.size.width;
}
[UIView animateWithDuration:duration animations:^{
[self setFrame:CGRectMake(endPoint, Y_OFFSET_ALERT, WIDTH_ALERT, HEIGHT_ALERT)];
[self.lb_title setFrame:CGRectMake(self.frame.origin.x, (HEIGHT_ALERT - HEIGHT_TITLE) / 2 + self.y, WIDTH_ALERT, HEIGHT_TITLE)];
} completion:^(BOOL finished) {
[self.btn_cover removeFromSuperview];
[self.lb_title removeFromSuperview];
}];
}
-(void)setTitleColor:(UIColor *)titleColor{
self.color_title = titleColor;
self.lb_title.textColor = self.color_title;
}
-(void)setAlertColor:(UIColor *)alertColor{
self.color_background = alertColor;
self.backgroundColor = self.color_background;
[self setAlpha:0.9];
}
-(void)setAlertColor:(UIColor *)alertColor andTitleColor:(UIColor *)titleColor{
[self setTitleColor:titleColor];
[self setAlertColor:alertColor];
}
-(void)setDismissOnLeft:(BOOL)isOnLeft{
self.isOnLeft = isOnLeft;
}
@end
只要把新建一个新的Cocoa Touch Class类,然后把上面代码复制进行就好了。
在测试之前,我们还需要实现UITableView的点击响应事件。
RootViewController.m
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
NSLog(@"%s || section: %ld and row: %ld of cell's been selected.", __FUNCTION__, indexPath.section, indexPath.row);
[self showAlertWithSection:indexPath.section andRow:indexPath.row];
}
- (void)showAlertWithSection:(NSInteger)section andRow:(NSInteger)row{
NSString *string_temp = [NSString stringWithFormat:@"%@ - %@", self.array_section[section], [self.array_row[section] objectAtIndex:row]];
AlertMessage *alert = [[AlertMessage alloc]initWithTitle:string_temp];
[alert setAlertColor:[CommonHandler getColorWithRGB:0xFFE4C4]];
[alert showWithCover:YES];
}
在底下加上这两个方法,就完成了。现在就可以测试下效果了!
AlertMessage.gif跳转页面
由于时间关系,这次就先跳一个空白的页面好了!
我们先Command+N新建一个空白的UIViewController。
这个类我打算作为后续项目插件,所以就叫他为RouteViewController好了。
先导入刚新建的文件到RootViewController里面,然后修改initData,新加一个分组。然后再在didSelectedRowAtIndexPath:里面改改就完成了。
RootViewController.m
#import "RouteViewController.h"
...
- (void)initData{
self.array_section = [NSArray arrayWithObjects:@"自定义消息提醒", @"自定义路线插件", nil];
self.array_row = [NSArray arrayWithObjects:
[NSArray arrayWithObjects:@"Show Alert", nil],
[NSArray arrayWithObjects:@"Show View", nil],
nil];
}
...
- (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath{
NSLog(@"%s || section: %ld and row: %ld of cell's been selected.", __FUNCTION__, indexPath.section, indexPath.row);
switch (indexPath.section) {
case 0:
[self showAlertWithSection:indexPath.section andRow:indexPath.row];
break;
case 1:
[self gotoRouteView];
break;
default:
break;
}
}
...
- (void)gotoRouteView{
RouteViewController *instance_routeView = [[RouteViewController alloc]init];
[self.navigationController pushViewController:instance_routeView animated:YES];
}
先初始化RouteViewController,然后通过UINavigationController里面的pushViewController方法来将RouteViewController放到栈顶,并显示到屏幕上。
<br />
补充一点
之前对RootViewController的封装的时候,因为疏忽,还有一个地方没有打包好,现在补上来:
RootViewController.m
- (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section{
return [self.array_row[section] count];
}
那么现在就来看看跳转页面的效果吧!是不是很期待呢!我也是啊!
ShowView.gif相信都看到了,在跳转页面之后,是一片灰(其实是空内容),虽然初始化了RouteViewController,但是并没有在RouteViewController里面写任何代码,所以就会出现这样的效果。
<br />
睡觉之前
今天就暂到这里,明天就开始写一下Route插件!祝福我。