image.png

在自定义导航条时,通常会继承系统的UINavigationBar,但如上图,在iOS11上,导航条改动了。
自定义导航条代码

    -(MBNavigationBar *)myNavBar{
if (!_myNavBar) {
_myNavBar = [[MBNavigationBar alloc] initWithFrame:CGRectMake(0, 0, [UIScreen mainScreen].bounds.size.width, 64)];
_myNavBar.barTintColor = [UIColor colorWithRed:245/255.0 green:245/255.0 blue:245/255.0 alpha:1.0];
_myNavBar.translucent = NO;
}
return _myNavBar;
}

高度设置为64,但看着高度只有44,而且上移到状态栏位置
不过仔细看层级结构对照可以发现,导航栏的高度还是64,内部的子视图向上移动了导航栏高度的距离。

 
image.png

在自定义的UINavigationBar中,遍历找到需要的控件,对size.height和origin.y和相应调整,
版本适配:iOS10之前使用的是_UINavigationBarBackground,iOS10之后改为_UIBarBackground

    #define IS_IPHONE_X ([UIScreen instancesRespondToSelector:@selector(currentMode)] ? CGSizeEqualToSize(CGSizeMake(1125, 2436), [[UIScreen mainScreen] currentMode].size) : NO)
- (void)layoutSubviews
{
[super layoutSubviews]; CGFloat systemVersion = [UIDevice currentDevice].systemVersion.floatValue;
for (UIView *view in self.subviews) {
if (systemVersion >= 11.0) {
if ([view isKindOfClass:NSClassFromString(@"_UIBarBackground")]) {
CGRect frame = view.frame;
frame.size.height = 64;
if (IS_IPHONE_X) {
frame.size.height = 88;
}
view.frame = frame;
}
if ([view isKindOfClass:NSClassFromString(@"_UINavigationBarContentView")]) {
CGRect frame = view.frame;
frame.origin.y = 20;
if (IS_IPHONE_X) {
frame.origin.y = 44;
}
view.frame = frame;
}
}
}
}

之后便正常了

 
image.png

有时设置BackgroundImage也可以

    [_myNavBar setBackgroundImage:nil forBarMetrics:UIBarMetricsDefault];

iOS11自定义导航条上移处理的更多相关文章

  1. jQuery Mobile 自定义导航条图标

    1.jQuery Mobile 自定义导航条图标

  2. React Native中自定义导航条

    这是2017年年初开始的公司的项目,对于导航条的要求很高,Android和iOS上必须用一致的UI,按钮位置还有各种颜色都有要求,而且要适应各种奇葩要求. 尝试了一下当时React Native自带的 ...

  3. iOS7新特性-完美解决iOS7关于自定义导航条UIBarButtonItem偏移的问题

    前言: 本文由DevDiv社区@Vincent 原创,转载请注明出处! http://www.devdiv.com/iOS_iPhone-ios_ios_uibarbuttonitem_-thread ...

  4. 可自定义导航条功能案例ios项目源码

    可定制的navigationitem ,当我们使用系统的方法设置navigationItem的leftItem或者rightItem时,我们会 发现item位置会有偏差(左边的偏右,右边的偏左).当设 ...

  5. React Native自定义导航条

    Navigator和NavigatorIOS 在开发中,需要实现多个界面的切换,这时候就需要一个导航控制器来进行各种效果的切换.在React Native中RN为我们提供了两个组件:Navigator ...

  6. 自定义 导航条分割线,tabBar分割线颜色(或者是 去掉)

    UIView * lineView = [[UIView alloc] initWithFrame:CGRectMake(0, 0, bgView.frame.size.width, 0.5)]; l ...

  7. uni-app自定义导航栏按钮|uniapp仿微信顶部导航条

    最近一直在学习uni-app开发,由于uniapp是基于vue.js技术开发的,只要你熟悉vue,基本上很快就能上手了. 在开发中发现uni-app原生导航栏也能实现一些顶部自定义按钮+搜索框,只需在 ...

  8. Nuxt/Vue自定义导航栏Topbar+标签栏Tabbar组件

    基于Vue.js实现自定义Topbar+Tabbar组件|仿咸鱼底部凸起导航 最近一直在倒腾Nuxt项目,由于Nuxt.js是基于Vue.js的服务端渲染框架,只要是会vue,基本能很快上手了. 一般 ...

  9. 基于vue3+electron11实现QQ登录切换|自定义导航栏|托盘|打包

    上一篇有给大家分享过使用vue3和electron快速搭建项目.创建多窗口/父子modal窗口的一些方法.今天继续给大家分享一些vue3.x+electron11项目开发中的一些知识点/踩坑记录,希望 ...

随机推荐

  1. 软件工程wc项目,基于py

    ###WC项目文件链接:https://github.com/ILTHEW/wc.git 个人项目:WC 实践是理论的基础和验证标准,希望读者贯彻"做中学"的思想,动手实现下面的项 ...

  2. promise知识点小结

    断断续续学习es6也有一段时间了,趁着开学空闲对知识点做一些小结. 为什么使用promise 谈到Promise,我们知道,这是社区较理想的异步编程解决方案.想要掌握promise,我们首先要知道其提 ...

  3. Ubuntu18.04下安装搜狗输入法

    Ubuntu18.04下安装搜狗输入法 第一步:安装 fcitx输入框架 sudo apt-get install fcitx 第二步:在官网下载 Linux 版本搜狗输入法 https://piny ...

  4. 从零开始 —— Canvas(一)

    从零开始-Canvas 1.颜色.样式和阴影 属性 a.fillStyle(设置或返回用于填充绘画的颜色.渐变或模式) 语法:context.fillStyle = color(颜色值) | grad ...

  5. jq、js判断元素是否在可视区域内

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <style> ...

  6. Haxe东游记(上)part1.5:roadmap

    part1.6 = 常用API参考 1.5.7 -> 官方手册目录/总结/中文化 1.8 -> 官方示例/讲解/总结 1.5.6-> haxe整体结构/解析/综述 part2 = 中 ...

  7. websocket+rabbitMQ

    拉取镜像:docker run -d --hostname my-rabbit --name some-rabbit  -p 5672:5672 -p 15672:15672 -p 61613:616 ...

  8. nginx自定义header支持

    今天配置nginx的时候遇到一个问题,直接访问接口没有问题,但是通过nginx转发之后,总是报token失效,无法获取token值,发现请求头丢失了. 默认是不支持非nginx标准的用户自定义head ...

  9. Struts框架原理及应用

    Struts 2框架本身大致可以分为3个部分:核心控制器FilterDispatcher.业务控制器Action和用户实现的企业业务逻辑组件. 核心控制器FilterDispatcher是Struts ...

  10. PHP安装过程中问题详解

    安装Apace时我就犯了一个大错误.因为我的母语是JAVA,我以为Tomcat就是Apache.其实不然,Tomcat是给Java用的,处理JSP等的动态页面. 而PHP则是单纯的用Apache安装A ...