码迷,mamicode.com
首页 > 移动开发 > 详细

iOS开发项目篇—13标题栏设置

时间:2014-07-11 21:03:29      阅读:242      评论:0      收藏:0      [点我收藏+]

标签:style   blog   http   color   使用   strong   

iOS开发项目篇—13标题栏设置

一、添加标题栏

代码:

 1 #import "YYHomeTableViewController.h"
 2 #import "YYOneViewController.h"
 3 
 4 @interface YYHomeTableViewController ()
 5 
 6 @end
 7 
 8 @implementation YYHomeTableViewController
 9 
10 - (id)initWithStyle:(UITableViewStyle)style
11 {
12     self = [super initWithStyle:style];
13     if (self) {
14         // Custom initialization
15     }
16     return self;
17 }
18 
19 - (void)viewDidLoad
20 {
21     [super viewDidLoad];
22     
23     //设置导航栏的按钮
24     self.navigationItem.leftBarButtonItem=[UIBarButtonItem itemWithImageName:@"navigationbar_friendsearch" highImageName:@"navigationbar_friendsearch_highlighted" target:self action:@selector(friendsearch)];
25     self.navigationItem.rightBarButtonItem=[UIBarButtonItem itemWithImageName:@"navigationbar_pop" highImageName:@"navigationbar_pop_highlighted" target:self action:@selector(pop)];
26     
27     //设置导航栏按钮
28     UIButton *titleButton=[[UIButton alloc]init];
29     //设置文字
30     [titleButton setTitle:@"首页" forState:UIControlStateNormal];
31     //设置文字颜色为黑色
32     [titleButton setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
33     //设置图标
34     [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
35     //设置背景
36     [titleButton setBackgroundImage:[UIImage resizedImage:@"navigationbar_filter_background_highlighted"] forState:UIControlStateHighlighted];
37     //当高亮的时候,不调整图片
38     titleButton.adjustsImageWhenHighlighted=NO;
39     //设置尺寸
40     titleButton.width=100;
41     titleButton.height=35;
42     self.navigationItem.titleView=titleButton;
43 }

显示效果:

bubuko.com,布布扣   bubuko.com,布布扣

二、进一步实现

(1)要求:要求图标在右边,文字在左边

解决方法:自定义一个类,让其继承自UIButton,重写内部的方法,调整图片和文字的位置。

bubuko.com,布布扣

bubuko.com,布布扣

封装的原则,经常需要设置且不会经常变动的应该封装在方法内部。

自定义类的声明和实现:

 1 //
 2 //  YYTitleButton.m
 3 //
 4 
 5 #import "YYTitleButton.h"
 6 
 7 @implementation YYTitleButton
 8 
 9 - (id)initWithFrame:(CGRect)frame
10 {
11     self = [super initWithFrame:frame];
12     if (self) {
13         //设置图片居中
14         self.imageView.contentMode=UIViewContentModeCenter;
15         //当高亮的时候,不调整图片
16         self.adjustsImageWhenHighlighted=NO;
17         //设置文字对齐方式为右对齐
18         self.titleLabel.textAlignment=NSTextAlignmentRight;
19         //设置文字颜色为黑色
20         [self setTitleColor:[UIColor blackColor] forState:UIControlStateNormal];
21         //设置文字的字体为统一的20号字体
22         self.titleLabel.font=YYNavigationTitleFont;
23     }
24     return self;
25 }
26 
27 //设置内部图标的frame
28 -(CGRect)imageRectForContentRect:(CGRect)contentRect
29 {
30     CGFloat imageY=0;
31     CGFloat imageW=self.height;
32     CGFloat imageH=imageW;
33     CGFloat imageX=self.width-imageW;
34     return CGRectMake(imageX, imageY, imageW, imageH);
35 
36 }
37 //设置内部文字的frame
38 -(CGRect)titleRectForContentRect:(CGRect)contentRect
39 {
40     CGFloat titleY=0;
41     CGFloat titleX=0;
42     CGFloat titleH=self.height;
43     //图片为正方形
44     CGFloat titleW=self.width-self.height;
45     return CGRectMake(titleX, titleY, titleW, titleH);
46 }
47 
48 @end

在控制器中的使用:

 1 //
 2 //  YYHomeTableViewController.m
 3 //
 4 
 5 #import "YYHomeTableViewController.h"
 6 #import "YYOneViewController.h"
 7 #import "YYTitleButton.h"
 8 
 9 @interface YYHomeTableViewController ()
10 
11 @end
12 
13 @implementation YYHomeTableViewController
14 
15 - (id)initWithStyle:(UITableViewStyle)style
16 {
17     self = [super initWithStyle:style];
18     if (self) {
19         // Custom initialization
20     }
21     return self;
22 }
23 
24 - (void)viewDidLoad
25 {
26     [super viewDidLoad];
27     
28     //设置导航栏的按钮
29     self.navigationItem.leftBarButtonItem=[UIBarButtonItem itemWithImageName:@"navigationbar_friendsearch" highImageName:@"navigationbar_friendsearch_highlighted" target:self action:@selector(friendsearch)];
30     self.navigationItem.rightBarButtonItem=[UIBarButtonItem itemWithImageName:@"navigationbar_pop" highImageName:@"navigationbar_pop_highlighted" target:self action:@selector(pop)];
31     
32     //设置导航栏按钮
33     YYTitleButton *titleButton=[[YYTitleButton alloc]init];
34     //设置文字
35     [titleButton setTitle:@"首页" forState:UIControlStateNormal];
36     //设置图标
37     [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
38     //设置背景
39     [titleButton setBackgroundImage:[UIImage resizedImage:@"navigationbar_filter_background_highlighted"] forState:UIControlStateHighlighted];
40   
41     //设置尺寸
42     titleButton.width=100;
43     titleButton.height=35;
44     self.navigationItem.titleView=titleButton;
45 }
46 -(void)pop
47 {
48     YYLog(@"---POP---");
49 }
50 -(void)friendsearch
51 {
52     //跳转到one这个子控制器界面
53     YYOneViewController *one=[[YYOneViewController alloc]init];
54     one.title=@"One";
55     //拿到当前控制器
56     [self.navigationController pushViewController:one animated:YES];
57     
58 }
59 
60 #pragma mark - Table view data source
61 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section
62 {
63     return 20;
64 }
65 
66 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath
67 {
68     static NSString *ID = @"cell";
69     UITableViewCell *cell = [tableView dequeueReusableCellWithIdentifier:ID];
70     if (!cell) {
71         cell = [[UITableViewCell alloc] initWithStyle:UITableViewCellStyleSubtitle reuseIdentifier:ID];
72     }
73     cell.textLabel.text = [NSString stringWithFormat:@"%d----首页测试数据", indexPath.row];
74     return cell;
75 }
76 
77 - (void)tableView:(UITableView *)tableView didSelectRowAtIndexPath:(NSIndexPath *)indexPath
78 {
79     //点击cell的时候,跳到下一个界面
80     UIViewController *newVc = [[UIViewController alloc] init];
81     newVc.view.backgroundColor = [UIColor redColor];
82     newVc.title = @"新控制器";
83     [self.navigationController pushViewController:newVc animated:YES];
84 }
85 
86 @end

实现效果:

bubuko.com,布布扣

新的问题:设置文字为右对齐,但是如果文字的长度非常长,不止是两个字的话就会影响到显示的效果,更好的做法是在设置尺寸的时候根据标题的长度能够自动设置尺寸。

三、进一步实现

(1)要求:点击标题栏按钮切换箭头的方向

  第一种实现方法:

 1 #import "YYHomeTableViewController.h"
 2 #import "YYOneViewController.h"
 3 #import "YYTitleButton.h"
 4 
 5 @interface YYHomeTableViewController ()
 6 @property(nonatomic,assign)BOOL down;
 7 @end
 8 
 9 @implementation YYHomeTableViewController
10 
11 - (id)initWithStyle:(UITableViewStyle)style
12 {
13     self = [super initWithStyle:style];
14     if (self) {
15         // Custom initialization
16     }
17     return self;
18 }
19 
20 - (void)viewDidLoad
21 {
22     [super viewDidLoad];
23     
24     //设置导航栏的按钮
25     self.navigationItem.leftBarButtonItem=[UIBarButtonItem itemWithImageName:@"navigationbar_friendsearch" highImageName:@"navigationbar_friendsearch_highlighted" target:self action:@selector(friendsearch)];
26     self.navigationItem.rightBarButtonItem=[UIBarButtonItem itemWithImageName:@"navigationbar_pop" highImageName:@"navigationbar_pop_highlighted" target:self action:@selector(pop)];
27     
28     //设置导航栏按钮
29     YYTitleButton *titleButton=[[YYTitleButton alloc]init];
30     //设置文字
31     [titleButton setTitle:@"首页" forState:UIControlStateNormal];
32     //设置图标
33     [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
34     //设置背景
35     [titleButton setBackgroundImage:[UIImage resizedImage:@"navigationbar_filter_background_highlighted"] forState:UIControlStateHighlighted];
36   
37     //设置尺寸
38     titleButton.width=100;
39     titleButton.height=35;
40     //监听按钮的点击事件
41     [titleButton addTarget:self action:@selector(titleButtonClick:) forControlEvents:UIControlEventTouchUpInside];
42     self.navigationItem.titleView=titleButton;
43 }
44 
45 -(void)titleButtonClick:(UIButton *)titleButton
46 {
47     if (self.down) {
48         //换成箭头向上
49         self.down=NO;
50         [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_up"] forState:UIControlStateNormal];
51     }else
52     {
53         self.down=YES;
54         //换成箭头向下
55         [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
56     }
57 }

缺点:需要增加一个全局的属性(down)用来记录状态

第二种实现方法:

 1 -(void)titleButtonClick:(UIButton *)titleButton
 2 {
 3     if (titleButton.tag==0) {
 4         titleButton.tag=10;
 5         //换成箭头向上
 6         self.down=NO;
 7         [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_up"] forState:UIControlStateNormal];
 8     }else
 9     {
10         titleButton.tag=0;
11         self.down=YES;
12         //换成箭头向下
13         [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
14     }
15 }

缺点:这里使用了tag,虽然不需要添加一个新的属性,但是使用tag引入了魔法数字,不利于阅读。

第三种实现方法:

 1 -(void)titleButtonClick:(UIButton *)titleButton
 2 {
 3     UIImage *titleImage=[UIImage imageWithName:@"navigationbar_arrow_down"];
 4    
 5     if (titleButton.currentImage==titleImage) {
 6         //换成箭头向上
 7         [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_up"] forState:UIControlStateNormal];
 8     }else
 9     {
10         //换成箭头向下
11         [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_down"] forState:UIControlStateNormal];
12     }
13 }

 

iOS开发项目篇—13标题栏设置,布布扣,bubuko.com

iOS开发项目篇—13标题栏设置

标签:style   blog   http   color   使用   strong   

原文地址:http://www.cnblogs.com/wendingding/p/3833337.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!