干货我是程序员;您好程先生;叫我序员就好了移动数码

第一个项目之四--UINavigationController

2015-02-09  本文已影响390人  _ChengChengCh

再续前缘


这次还是对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插件!祝福我。

上一篇 下一篇

猜你喜欢

热点阅读