Loading [MathJax]/jax/output/CommonHTML/config.js
首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >专栏 >iOS调整导航条BarButtonItem与titleView 的间距

iOS调整导航条BarButtonItem与titleView 的间距

作者头像
公众号iOS逆向
发布于 2021-08-25 09:08:04
发布于 2021-08-25 09:08:04
2.4K00
代码可运行
举报
文章被收录于专栏:iOS逆向与安全iOS逆向与安全
运行总次数:0
代码可运行

前言

例子:调整BarButtonItem按钮和titleView的间距

1、原理:titleview的起点位置和尺寸依赖于leftBarButtonItem和rightBarButtonItem的位置。 2、设置titleview之前,先初始化leftBarButtonItem和rightBarButtonItem的位置,然后根据leftBarButtonItem和rightBarButtonItem的位置来使titleview居中。

常见问题

1、 BarButtonItem 隐藏失效的解决方案:使用initWithCustomView进行实例化BarButtonItem 2、 iOS13.5.1 版本无法点击导航条右侧按钮:CustomView 不能直接是UIButton, 因此解决方案只要对UIButton进行包装一层之后再作为CustomView

I、调整BarButtonItem按钮和titleView的间距

与屏幕边界 或者与titleView 的间距 只要分别调整rightBarButtonItems 数组元素的顺序。

主要利用UIBarButtonItem 的UIBarButtonSystemItemFixedSpace 系统控件

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 UIBarButtonItem *negativeSpacer = [[UIBarButtonItem alloc]
                                       initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                                       target:nil action:nil];
    /**
     *  width为负数时,相当于btn向右移动width数值个像素,由于按钮本身和边界间距为5pix,所以width设为-5时,间距正好调整
     *  为0;width为正数时,正好相反,相当于往左移动width数值个像素
     */
    negativeSpacer.width = 10;

1.1 调整右边按钮和titleView的间距


代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
 //设置右边按钮
    UIBarButtonItem *btn_right =  [UIBarButtonItem barButtonItemWithTarget:self  Image:@"in" highlightedImage:@"in" actionMethod:@selector(in)];
    
    
    
    UIBarButtonItem *negativeSpacer = [[UIBarButtonItem alloc]
                                       initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                                       target:nil action:nil];
    /**
     *  width为负数时,相当于btn向右移动width数值个像素,由于按钮本身和边界间距为5pix,所以width设为-5时,间距正好调整
     *  为0;width为正数时,正好相反,相当于往左移动width数值个像素
     */
    negativeSpacer.width = 10;
    self.navigationItem.rightBarButtonItems = [NSArray arrayWithObjects: btn_right, negativeSpacer,nil];

1.2 调整左边按钮和titleView的间距


代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
//    经过尝试,发现titleview的起点位置和尺寸依赖于leftBarButtonItem和rightBarButtonItem的位置。
    

        UILabel * centerView = [[UILabel alloc] initWithFrame:CGRectMake(kAdjustRatio(20),0 , self.view.frame.size.width- kAdjustRatio(20), self.navigationController.navigationBar.frame.size.height)];
    
    self.navigationItem.titleView = centerView;
    
//    设置titleview之前,先初始化leftBarButtonItem和rightBarButtonItem的位置,然后根据leftBarButtonItem和rightBarButtonItem的位置来使titleview居中。
    

//    self.navigationItem.titleView.
    
    
    UIBarButtonItem *negativeSpacer = [[UIBarButtonItem alloc]
                                       initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace
                                       target:nil action:nil];
    /**
     *  width为负数时,相当于btn向右移动width数值个像素,由于按钮本身和边界间距为5pix,所以width设为-5时,间距正好调整
     *  为0;width为正数时,正好相反,相当于往左移动width数值个像素
     */

    negativeSpacer.width = 10;

    
//    self.navigationItem.leftBarButtonItem =negativeSpacer;

    self.navigationItem.leftBarButtonItems = [NSArray arrayWithObjects:  negativeSpacer,nil];

1.3 设置webViewVC 导航条的左边按钮的位置

在这里插入图片描述

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
- (void)updateNavigationItems {
    [self.navigationItem setLeftBarButtonItems:nil animated:NO];
    if (self.webView.canGoBack/* || self.webView.backForwardList.backItem*/) {// Web view can go back means a lot requests exist.
        UIBarButtonItem *spaceButtonItem = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace target:nil action:nil];
        spaceButtonItem.width = -6.5;
        self.navigationController.interactivePopGestureRecognizer.enabled = NO;
        if (self.navigationController.viewControllers.count == 1) {
            NSMutableArray *leftBarButtonItems = [NSMutableArray arrayWithArray:@[spaceButtonItem,self.navigationBackBarButtonItem]];
            // If the top view controller of the navigation controller is current vc, the close item is ignored.
            if (self.showsNavigationCloseBarButtonItem && self.navigationController.topViewController != self){
                [leftBarButtonItems addObject:self.navigationCloseBarButtonItem];
            }
            
            [self.navigationItem setLeftBarButtonItems:leftBarButtonItems animated:NO];
        } else {
            if (self.showsNavigationCloseBarButtonItem){
                [self.navigationItem setLeftBarButtonItems:@[self.navigationCloseBarButtonItem] animated:NO];
            }else{
                [self.navigationItem setLeftBarButtonItems:@[] animated:NO];
            }
        }
    } else {
        self.navigationController.interactivePopGestureRecognizer.enabled = YES;
        [self.navigationItem setLeftBarButtonItems:nil animated:NO];
    }
}

II、相关的常见问题

2.1 self.navigationItem.leftBarButtonItem.customView.hidden=YES 失效

  • UIBarButtonItem 使用initWithCustomView 进行实例化的时,这个方法才生效
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
self.navigationItem.leftBarButtonItem.customView.hidden=YES
  • 解决方法:使用initWithCustomView 进行实例化
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制


 UIBarButtonItem *lefttItem = [[UIBarButtonItem alloc]initWithCustomView:btn];

    
    self.navigationItem.leftBarButtonItem = lefttItem;

2.2 iOS13.5.1 版本无法点击导航条右侧按钮

  • 无法点击代码
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
//    UIButton *btn = [UIButton buttonWithType:UIButtonTypeCustom];
//    [btn setTitle:QCTLocal(@"print") forState:UIControlStateNormal];
//    [btn setTitleColor:HWColor(51, 51, 51) forState:UIControlStateNormal];
//    btn.titleLabel.font = [UIFont systemFontOfSize:14.0f];
//    [btn addTarget:self action:@selector(printBtn:) forControlEvents:UIControlEventTouchUpInside];
//    btn.tag = 0;
//    btn.tintColor = [UIColor blackColor];
//    UIBarButtonItem *rightBtn = [[UIBarButtonItem alloc] initWithCustomView:btn];
//    rightBtn.tintColor = [UIColor blackColor];
//    self.navigationItem.rightBarButtonItem = rightBtn;

  • 解决方案

CustomView 不能直接是UIButton, 因此解决方案只要对UIButton进行包装一层即可

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
- (void)setupNavigationBar {
    // 设置导航条右侧的按钮
    UIButton *btn = [[UIButton alloc] init];
    //    [btn setImage:[UIImage imageNamed:@"icon_kaidan_huiyuan"] forState:UIControlStateNormal];
    [btn setTitle:QCTLocal(@"print") forState:UIControlStateNormal];
    [btn setTitleColor:rgb(51,51,51) forState:UIControlStateNormal];
    [btn addTarget:self action:@selector(printBtn:) forControlEvents:UIControlEventTouchDown];
    btn.titleLabel.font = kTextFont(14);
    [btn sizeToFit];
    UIView *btnView = [[UIView alloc] init];
    btnView.frame = btn.bounds;
    [btnView addSubview:btn];
    UIBarButtonItem *item = [[UIBarButtonItem alloc] initWithCustomView:btnView];
    item.tintColor = [UIColor whiteColor];
    self.navigationItem.rightBarButtonItem = item;
    
    
    
    
    
}


2.3 使用 [UIBarButtonItem alloc] initWithImage: 方法,导致图片颜色被冲的解决方案

从其他VC回到当前控制器的时候,发现右边的self.navigationItem.rightBarButtonItem的背景颜色被冲淡了

  • 解决方法:UIImageRenderingModeAlwaysOriginal
代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
    UIImage *aimage = [UIImage imageNamed:@"icon_right_menu"];
    UIImage *image = [aimage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
    UIBarButtonItem *rightItem = [[UIBarButtonItem alloc] initWithImage:image style:UIBarButtonItemStylePlain target:self action:@selector(moreAction)];
    [self.navigationItem setRightBarButtonItem:rightItem animated:YES];



III、 控制器的跳转和回退细节处理

3.1 UIActionSheet打开相册的处理:通常是等didDismissWithButtonIndex 之后才进行控制器跳转

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
- (void)actionSheet:(UIActionSheet *)actionSheet didDismissWithButtonIndex:(NSInteger)buttonIndex NS_DEPRECATED_IOS(2_0, 8_3) __TVOS_PROHIBITED{
    
    if (buttonIndex == 0) {
        [self createCamera];
    }
}

3.2 pop回栈中指定的VC

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
- (void)pop
{
    for (UIViewController *temp in self.navigationController.viewControllers) {
        if ([temp isKindOfClass:[QCTMyFinancialViewController class]]) {
            [self.navigationController popToViewController:temp animated:YES];
        }
    }
}

IV、see also

感谢支持,更多内容请关注公众号:iOS逆向

常用的扩展方法

UIBarButtonItem (Extension)

代码语言:javascript
代码运行次数:0
运行
AI代码解释
复制
@implementation UIBarButtonItem (Extension)
+ (UIBarButtonItem*)barButtonItemWithTarget:(id)target Image:(NSString*)imageName highlightedImage:(NSString*)highlightedImage actionMethod:(SEL)actionMethod{
    // 设置图片
    UIButton *button = [UIButton buttonWithType:UIButtonTypeCustom];
    [button setBackgroundImage:[UIImage imageNamed:imageName] forState:UIControlStateNormal];
    [button setBackgroundImage:[UIImage imageNamed:highlightedImage] forState:UIControlStateHighlighted];
    //设置frame
    button.size = button.currentBackgroundImage.size;
    
    //设置监听
    [button addTarget:target action:actionMethod forControlEvents:UIControlEventTouchUpInside];
    return  [[UIBarButtonItem alloc]initWithCustomView:button];
}


本文参与 腾讯云自媒体同步曝光计划,分享自微信公众号。
原始发表:2021-08-18,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 iOS逆向 微信公众号,前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
暂无评论
推荐阅读
编辑精选文章
换一批
iOS小技能:右滑返回
原理:利用系统的返回手势interactivePopGestureRecognizer进行实现
公众号iOS逆向
2022/08/22
2.5K0
iOS小技能:右滑返回
iOS TabBarController实例
-(BaseNavigationController*)setTabBarItemWithRootVC:(id)vc Image:(NSString*)imgName SelectedImage:(NSString*)selectedImg { BaseNavigationController *nav = [[BaseNavigationController alloc] init]; [nav.tabBarItem setImage:[[UIImage imageNamed:imgNam
Lee坚武
2019/12/18
5590
iOS学习—— UINavigationController的返回按钮与侧滑返回手势的研究
侧滑返回手势是从iOS7开始增加的一个返回操作,经历了两年时间估计iPhone用户大部分都已经忽略了屏幕左上角那个碍眼的back按钮了。之前在网上搜过有关侧滑手势的技术博客,发现大多比较散乱,甚至有很多都是简单的粘贴复制,并不全面。侧滑返回的操作效果与左上角的back按钮是一样的,所以一起放在这里进行探讨。 导航栏左上角的back按钮是附着在UINavigationController的UINavigationBar里自带的一个返回按钮,导航栏自带的back按钮的图层结构如下图所示。一个UINavig
mukekeheart
2018/03/01
7.6K0
iOS学习—— UINavigationController的返回按钮与侧滑返回手势的研究
iOS11UINavigationBar的item左右间距调整
相信很多同学都知道在iOS7之后调整导航栏两侧按钮距离左右间距,其实就是在左右barButtonItem的数组中添加一个宽度为负的占位item。 - (void)addLeftBarButtonItem:(UIBarButtonItem *)leftBarButtonItem { UIBarButtonItem *space = [[UIBarButtonItem alloc] initWithBarButtonSystemItem:UIBarButtonSystemItemFixedSpace t
王大锤
2018/05/17
3.4K0
IOS开发之TabBarItem&NavigationBarItem
  想必大家都用过微信,微信间的页面切换是如何做成的呢?接下来我们用storyboard结合着代码来模拟一下微信的视图控制模式。   "工欲善其事,必先利其器",下面主要是对storyboard来进行我们项目框架的搭建的,必要时,用代码实现我们的页面效果。在IOS开发中常用的多视图间的切换大致有TabBarController, NavigationBarController, 和模态窗口。第一次接触模态的概念是在Web前端的内容中接触的。下面将会结合一个实际的效果来简单的介绍一下TabBar和Naviga
lizelu
2018/01/11
1.7K0
IOS开发之TabBarItem&NavigationBarItem
iOS右滑返回的实现【修订】
原理:利用系统的返回手势interactivePopGestureRecognizer进行实现
公众号iOS逆向
2021/08/25
1.9K0
iOS右滑返回的实现【修订】
UINavigationBar的用法
UINavigationBar是一个我们在开发中必定会碰到的控件,用好它能帮助我们自定义导航栏的样式,所以今天讲解一下UINavigationBar的用法。
Originalee
2018/08/30
2.3K0
iOS11 UIBarButtonItem无法偏移问题坑
1、创建UINavigationItem Category @implementation UINavigationItem (SXFixSpace) +(void)load { [self swizzleMethod:@selector(setLeftBarButtonItem:) swizzledSelector:@selector(sx_setLeftBarButtonItem:)]; [self swizzleMet
程序员不务正业
2018/06/15
1.7K0
六天完成一个简单iOS App - 第一天
项目介绍 仿照百思不得姐,通过看李明杰老师视频学习自己实践并简单总结项目开发过程中普遍遇到的问题,并且将可以用到其他项目中的分类方法进行简单总结,便于以后在别的项目中使用。 每天任务 1. 实现相应功能 2. 代码重构,简单优化 第一天任务: 配置项目基本环境 搭建框架 代码重构 配置项目基本环境 一. 接口获取 我们可以通过Charles等工具抓包来获取我们想做的App的接口,然后通过解析将每个接口的数据解析出来。也可以去知乎中有趣的 API 接口推荐找找看。 二. 项目图片获取方式 图片的获
xx_Cc
2018/05/10
1.3K0
iOS导航栏基础效果配置[通俗易懂]
若iOS7之后仍要使用第一种方法全局设置,则需要在plist文件中添加View controller-based status bar appearance 字段,值为NO ,意为不使用控制器管理状态栏。
全栈程序员站长
2022/07/21
2K0
iOS16适配指南之UINavigationItem
增加了类型为 UINavigationItem.ItemStyle 的属性style用于描述 UINavigationItem 在 UINavigationBar 上的布局,共有 3 种样式:navigator(默认样式),browser(浏览器样式)与editor(编辑器样式)。 // Created by YungFan import UIKit class ViewController: UIViewController { override func viewDidLoad() {
YungFan
2022/08/23
1.6K0
iOS开发UINavigation系列二——UINavigationItem
        UINavigationItem是导航栏上用于管理导航项的类,在上一篇博客中,我们知道导航栏是通过push与pop的堆栈操作来对item进行管理的,同样,每一个Item自身也有许多属性可供我们进行自定制。这篇博客,主要讨论UINavigationItem的使用方法。
珲少
2018/08/15
8640
iOS开发UINavigation系列二——UINavigationItem
UINavigationController
UINavigationController 利用UINavigationController,可以轻松地管理多个控制器,轻松完成控制器之间的切换,典型例子就是系统自带的“设置”应用 UINavigationController的使用步骤 初始化UINavigationController 设置UIWindow的rootViewController为UINavigationController 根据具体情况,通过push方法添加对应个数的子控制器 UINavigationController以栈的形
用户1941540
2018/05/11
1.8K0
iOS开发之微信聊天工具栏的封装
之前山寨了一个新浪微博(iOS开发之山寨版新浪微博小结),这几天就山寨个微信吧。之前已经把微信的视图结构简单的拖了一下(iOS开发之微信山寨版),今天就开始给微信加上具体的实现功能,那么就先从微信的聊天界面开始吧。提到封装是少不了写代码的,在封装组件的时候,为了组件的可移植性,我们就不能用storyboard来拖拽了。为了屏幕的适配,适应不同屏幕的手机,所以在封装组件的时候是少不了为我们的组件来添加约束。今天博客中的所有代码都是脱离storyboard的,这些代码在别的工程中也是可以使用的。好,废话少说,切
lizelu
2018/01/11
2.6K0
iOS开发之微信聊天工具栏的封装
【iOS开发-22】navigationBar导航栏,navigationItem建立:获取导航栏中的基本文本和button以及各种跳跃
(1)navigationBar导航栏可以被看作是self.navigationController一个属性导航控制器,它可以由点直接表示self.navigationController.navigationBar。当然navigationBar他还是很物业。让我们风格barStyle、背景backgroundColor、frame属性(能够获取宽高这些信息)。还能够用setBackgroundImage方法设置背景图片。当然图片多了能够使用clipsToBounds剪裁。
全栈程序员站长
2022/07/06
3.1K0
【iOS开发-22】navigationBar导航栏,navigationItem建立:获取导航栏中的基本文本和button以及各种跳跃
UIBarButtonItem设置Badge
UIBarButtonItem 默认是不能 设置 Badge 所以我们可以对它扩展使之支持
码客说
2019/10/22
7360
iOS小技能:自定义导航栏,设置全局导航条外观
在开发需求时app中使用的导航条在一个模块的主题基本是一致的,因此可通过自定义导航条来进行统一控制。
玖柒的小窝
2021/11/02
2.8K0
UIBarButtonItem 位置问题
1. UIEdgeInsetsMake方式 NSInteger inset = App_Frame_Width == 414 ? 10:6; self.navigationItem.rightBar
程序员不务正业
2018/06/13
5030
iOS8 自定义navigationbar 以及 UIBarButtonItem 边距问题
一。自定义navigationbar - (void)initNavigationBar{ [self.navigationController setNavigationBarHidden:YES]; UINavigationBar *bar = [[UINavigationBar alloc] initWithFrame:CGRectMake(0, 0, 320, 32)]; [bar setBackgroundImage:[UIImage imageNamed:@"zhu
王大锤
2018/05/17
2K0
iOS键盘、选取器上的工具栏
我们在使用键盘的时候,在打字完毕后想要收起键盘继续操作,要么是习惯性点击界面空白处收起键盘,要么是在键盘上方点击一个“完成”之类的按钮来收起键盘。在Android上键盘的完成按钮是自带的,但是iOS没有,所以需要开发者自行添加上去一个,这里就要用到工具栏UIToolbar。
Cloudox
2021/11/23
1.9K0
iOS键盘、选取器上的工具栏
推荐阅读
相关推荐
iOS小技能:右滑返回
更多 >
交个朋友
加入腾讯云官网粉丝站
蹲全网底价单品 享第一手活动信息
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档
本文部分代码块支持一键运行,欢迎体验
本文部分代码块支持一键运行,欢迎体验