首页 > 代码库 > iOS开发项目篇—13标题栏设置
iOS开发项目篇—13标题栏设置
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)style11 {12 self = [super initWithStyle:style];13 if (self) {14 // Custom initialization15 }16 return self;17 }18 19 - (void)viewDidLoad20 {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 }
显示效果：
二、进一步实现
（1）要求：要求图标在右边，文字在左边
解决方法：自定义一个类，让其继承自UIButton,重写内部的方法，调整图片和文字的位置。
封装的原则，经常需要设置且不会经常变动的应该封装在方法内部。
自定义类的声明和实现：
1 // 2 // YYTitleButton.m 3 // 4 5 #import "YYTitleButton.h" 6 7 @implementation YYTitleButton 8 9 - (id)initWithFrame:(CGRect)frame10 {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 //设置内部图标的frame28 -(CGRect)imageRectForContentRect:(CGRect)contentRect29 {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 //设置内部文字的frame38 -(CGRect)titleRectForContentRect:(CGRect)contentRect39 {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 @end12 13 @implementation YYHomeTableViewController14 15 - (id)initWithStyle:(UITableViewStyle)style16 {17 self = [super initWithStyle:style];18 if (self) {19 // Custom initialization20 }21 return self;22 }23 24 - (void)viewDidLoad25 {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)pop47 {48 YYLog(@"---POP---");49 }50 -(void)friendsearch51 {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 source61 - (NSInteger)tableView:(UITableView *)tableView numberOfRowsInSection:(NSInteger)section62 {63 return 20;64 }65 66 - (UITableViewCell *)tableView:(UITableView *)tableView cellForRowAtIndexPath:(NSIndexPath *)indexPath67 {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 *)indexPath78 {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
实现效果：
新的问题：设置文字为右对齐，但是如果文字的长度非常长，不止是两个字的话就会影响到显示的效果，更好的做法是在设置尺寸的时候根据标题的长度能够自动设置尺寸。
三、进一步实现
（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 YYHomeTableViewController10 11 - (id)initWithStyle:(UITableViewStyle)style12 {13 self = [super initWithStyle:style];14 if (self) {15 // Custom initialization16 }17 return self;18 }19 20 - (void)viewDidLoad21 {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 *)titleButton46 {47 if (self.down) {48 //换成箭头向上49 self.down=NO;50 [titleButton setImage:[UIImage imageWithName:@"navigationbar_arrow_up"] forState:UIControlStateNormal];51 }else52 {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 }
声明：以上内容来自用户投稿及互联网公开渠道收集整理发布，本网站不拥有所有权，未作人工编辑处理，也不承担相关法律责任，若内容有误或涉及侵权可进行投诉： 投诉/举报 工作人员会在5个工作日内联系你，一经查实，本站将立刻删除涉嫌侵权内容。