新风作浪博客学习(七)代码 实现UIDatePicker控件 和 Tab Bar 视图切换 .

感觉代码写控件都一个理，先在ViewDidLoad中创建控件对象，然后初始化他的frame，在简单的描叙下他们的相关属性，最后在添加到视图上；这样控件就在视图上显示出来了；

UIDatePicker是一个用来选择日期或设置日期的控件，他不是UIPickerView子类，而是UIControl的子类，当然它所依赖的类也是与实践有关的类，NSDate；苹果公司已经为你实现好了这个控件是怎么实现的，它底层怎么实现你不必了解，你只需调用相关API就可以了；

上一文中写了Navigation Bar 和ToolBar的视图切换，这一节把Tab Bar视图切换也加上，切换两个不同格式下的日历表，还是先把效果图奉上吧(界面不咋好看):


前面两个tab Bar item图标是系统的图标，后面一个是添加了一张背景图片，但是不知道问什么没有显示，切换界面的两个按钮还是前面两个Tab Bar Item；
[img]
[img]http://dl.iteye.com/upload/attachment/0079/4022/aa4a5ddf-43fa-33cf-933f-9474865d9adf.png[/img]
[/img],[img]
[img]http://dl.iteye.com/upload/attachment/0079/4024/8db53f48-ac41-3e11-86bf-f6d1d0f8e9fd.png[/img]
[/img]


1.创建一个新工程叫DatePickerDemo； File->New->Project ->single View Application -> next
[img]
[img]http://dl.iteye.com/upload/attachment/0079/4026/7dfd66bd-04e9-3a3f-a74b-11df974f530c.png[/img]
[/img]


2.然后在新建两个ViewController分别叫FirstViewController和SecondViewController
[img]
[img]http://dl.iteye.com/upload/attachment/0079/4028/488052df-9256-3cef-b98a-699d5e8dc520.png[/img]
[/img]


3.设置UITabBarDelegate协议，在ViewController中，

#import <UIKit/UIKit.h>
#import "FirstViewController.h"
#import "SecondViewController.h"
@interface ViewController : UIViewController<UITabBarDelegate>
{
    UIDatePicker *datePicker;
    UITabBar *tabBar;
    FirstViewController *firstViewController;
    SecondViewController *secondViewCOntroller;
}

@end

4.在ViewController.m文件的ViewDidLoad中创建初始化界面

- (void)viewDidLoad
{
    [super viewDidLoad];
	// Do any additional setup after loading the view, typically from a nib.
//    初始化Tab Bar
    tabBar = [[UITabBar alloc] initWithFrame:CGRectMake(0, 416, 320, 44)];
  //设置Tab Bar上的交互属性为YES
    [tabBar setUserInteractionEnabled:YES];
//    设置代理
    [tabBar setDelegate:self];
//    设置TabBar的背景颜色
    [tabBar setBackgroundColor:[UIColor purpleColor]];
//    设置tabBar的透明度
    tabBar.alpha = 0.5f;

//    定义一个可变数组存放tab Bar Item
    NSMutableArray *tabBarArray= [NSMutableArray array];
//    初始化一个Tab Bar Item  到数组中
    [tabBarArray addObject:[[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemFavorites
                                                                     tag:1]];
    [tabBarArray addObject:[[UITabBarItem alloc]initWithTabBarSystemItem:UITabBarSystemItemHistory
                                                                     tag:2]];

    UIImage *image = [UIImage imageNamed:@"test48.png"];
    [tabBarArray addObject:[[UITabBarItem alloc]initWithTitle:@"测试" image:image tag:3]];

//    给Tab Bar 添加数组里的tab Bar Item
    [tabBar setItems:tabBarArray animated:NO];
    [self.view addSubview:tabBar];


//    datePicker宽度320像素和高度216像素，系统都设置好了，只需设置一下他的远点坐标，
    datePicker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0, 0, 0, 0)];

//    设置datePicker显示模式
    [datePicker setDatePickerMode:UIDatePickerModeDateAndTime];

//DatePicker属于UIControl子类，可以触发事件，当滚动滑轮滑轮停下后就调用这个方法了
    [datePicker addTarget:self action:@selector(dateChanged:) forControlEvents:UIControlEventValueChanged];

    [self.view addSubview:datePicker];
    }

5.设置日历控件的响应事件

-(void)dateChanged:(id)sender
{
    UIDatePicker *control = (UIDatePicker*)sender;
//    把当前控件设置的时间赋给date
    NSDate *date = control.date;
//    将NSDate格式装换成NSString类型
    NSDateFormatter *dateFormatter = [[NSDateFormatter alloc]init];
//    设置日历显示格式
    [dateFormatter setDateFormat:@"yyyy-MM-dd HH:mm:ss"];
//    把日历时间传给字符串
    NSString *strDate = [dateFormatter stringFromDate:date];

    NSString *message = [[NSString alloc]initWithFormat:@"你选取的时间是：%@",strDate];
//      弹出一个警告                  
    UIAlertView *alert = [[UIAlertView alloc] initWithTitle:@"温馨提示"
                                                    message:message
                                                   delegate:self
                                          cancelButtonTitle:@"OK"
                                          otherButtonTitles: nil];
//    显示警告
    [alert show];

}

这里涉及到了一个NSDate向NSString的转换问题

NSDateFormatter *dateFormatter = [[NSDateFormatter alloc] init];
[dateFormatter setDateFormat:@"yyyy-MM-dd HH:mm:ss"];
NSString *strDate = [dateFormatter stringFromDate:[NSDate date]];
NSLog(@"%@", strDate);

NSString向NSDate如何转换

NSDateFormatter *dateFormatter = [[NSDateFormatter alloc] init];
[dateFormatter setDateFormat:@"yyyy-MM-dd HH:mm:ss"];
NSDate *date = [dateFormatter dateFromString:@"2012-07-04 9:03:03"];
NSLog(@"%@", date)

6.UITabBarDelegate的委托方法

-(void)tabBar:(UITabBar *)tabBarBar didSelectItem:(UITabBarItem *)item
{

    if (item.tag == 1) {
     //   [tabBar setSelectedItem:[tabBar.items objectAtIndex:0]];
        NSLog(@"---->%d",item.tag);
        if(firstViewController.view.superview==nil)
        {
            if (firstViewController.view==nil) {

        FirstViewController *firstView = [[FirstViewController alloc]initWithNibName:@"FirstViewController" bundle:nil];
            firstViewController=firstView;
            }
            [secondViewCOntroller.view removeFromSuperview];
//            [self.view insertSubview:firstViewController.view atIndex:0];
            [self.view  addSubview:firstViewController.view];
        }
        else {
            [secondViewCOntroller.view removeFromSuperview];
//              [self.view insertSubview:firstViewController.view atIndex:0];
            [self.view  addSubview:firstViewController.view];

        }


    }
    if (item.tag == 2) {

        if (secondViewCOntroller.view.superview==nil) {
            if (secondViewCOntroller.view == nil)
            {

            SecondViewController *secondView = [[SecondViewController alloc] initWithNibName:@"SecondViewController" bundle:nil];
            secondViewCOntroller=secondView;
            }
            [firstViewController.view removeFromSuperview];
            [self.view insertSubview:secondViewCOntroller.view atIndex:0];

        }
        else {
            [firstViewController.view removeFromSuperview];
            [self.view insertSubview:secondViewCOntroller.view atIndex:0];

        }

        }



    NSLog(@"---->%d",item.tag);
}

在方法中我们看到有Item.tag是在ViewDidLoad给Tab Bar Item设定的tag，相当于给这个按钮编了一个号码，这个号码代表这个按钮;再点击不同按钮的时候切换不同视图，这个方法和上一博客所用的视图切换方法思想一样，只是没有添加动画效果，首先判断第一个视图父视图是否为空，在判断在试图是否为空，为空则创新创建一个，初始化并把管理权交给该视图控制器，移去原来的视图，把现在视图切换过去；

[self.view insertSubview:firstViewController.view atIndex:0];

            [self.view addSubview:firstViewController.view];

在方法中我把第一个给注释了，第一个是插入主视图后面，出现的情况就是主视图上的DatePicker把插入给覆盖了，显示不出来，第二种是之间把切换的视图放在主视图上面，但是这个问题出来了，他把主视图下面的Tab Bar给覆盖了，于是我把需要切换的视图的frame高度设置成了460-44高度，在FirstViewController的ViewDidLoad方法中

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view from its nib.
    self.view.frame = CGRectMake(0, 0, 320, 416);

    self.view.backgroundColor = [UIColor blueColor];
    UIDatePicker *datePicker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0, 0, 0, 0)];

    //    设置datePicker显示模式
    [datePicker setDatePickerMode:UIDatePickerModeTime];  
    [self.view addSubview:datePicker];
}

在item.tag=2中，并未这样做，只是想做一下对比，在我们前面看见的这个界面的截图并没有完全显示SecondViewController视图上的内容，他被ViewController上的视图覆盖了，在SeconViewController上的ViewDidLoad初始化是这样的

- (void)viewDidLoad
{
    [super viewDidLoad];
    // Do any additional setup after loading the view from its nib.
    self.view.backgroundColor = [UIColor greenColor];
    UIDatePicker *datePicker = [[UIDatePicker alloc] initWithFrame:CGRectMake(0, 0, 0, 0)];

    //    设置datePicker显示模式
    [datePicker setDatePickerMode:UIDatePickerModeDate];
    [self.view addSubview:datePicker];
}

[datePickersetDatePickerMode:UIDatePickerModeDateAndTime];设置日历显示模式，有四种模式
typedefenum {

UIDatePickerModeDateAndTime,

UIDatePickerModeTime,

UIDatePickerModeDate,

UIDatePickerModeCountDownTimer

} UIDatePickerMode;


[img]
[img]http://dl.iteye.com/upload/attachment/0079/4030/170648b3-3130-34d7-9cf3-a5fa8102d499.png[/img]
[/img] [img]
[img]http://dl.iteye.com/upload/attachment/0079/4032/5d4c9bcd-cbc6-358f-9200-0ee8b63aaf0f.png[/img]
[/img] [img]
[img]http://dl.iteye.com/upload/attachment/0079/4034/0dae87f8-d7b9-324f-ab8f-82ff122d61a3.png[/img]
[/img] [img]
[img]http://dl.iteye.com/upload/attachment/0079/4036/4216aa2e-92a3-3e4a-aac6-613eddec7c05.png[/img]
[/img]