动态修改UINavigationBar的背景色--by-胡旭
这是我们最终想要得到的效果

思路
在UISrollView的delegate方法 - (void)scrollViewDidScroll:(UIScrollView *)scrollView中根据当前的contentOffset更新navigationBar的backgroundColor即可,so easy~
开动
那么我们来看看apple为我们提供了哪些API来设置navigationBar的颜色。
首先想到的是最常用的[UINavigationBar appearance],我们一般会在AppDelegate中使用它对navigationBar进行统一的设置。但是如果试一下,会发现在scrollViewDidScrollView中调用它并不能动态地改变navigationBar的颜色,原因可以看一下Apple的doc:
Use the UIAppearance protocol to get the appearance proxy for a class. You can customize the appearance of instances of a class by sending appearance modification messages to the class’s appearance proxy.
但是:
iOS applies appearance changes when a view enters a window, it doesn’t change the appearance of a view that’s already in a window. To change the appearance of a view that’s currently in a window, remove the view from the view hierarchy and then put it back.
所以换一条路,直接修改UINavigationBar的backgroudColor:
结果却是。。。

仔细观察,会发现navigationBar的高度是44,它的上方是statusBar,而且,navigationBar的上面还有一个未知的View。。。到底Apple是怎么实现UINavigationBar的呢,让我们一探究竟!
在xcode的顶部菜单栏找到Debug > View Debugging > Capture View Hierarchy:


原来UINavigationBar上有一个_UIBackDropView,正是它决定了navigationBar的背景色。
那么我们是不是可以修改它的颜色呢,赶紧打开UINavigationBar.h,找了一圈,
既然没有public的API,我们只能hack了!
Hack
我们的思路很简单,参照Apple的实现,在navigationBar的view hierarchy中插入一个view,通过它来控制在navigationBar的backgroundColor。
考虑到继承UINavigationBar使用起来会非常不便,我们决定用Category来实现,首先定义我们的category:
@interface UINavigationBar (BackgroundColor)
- (void)lt_setBackgroundColor:(UIColor *)backgroundColor;
@end
实现:我们使用associatedObject将overlayView动态地绑定到UINavigationBar的instance上,当调用lt_setBackgroundColor的时候,我们只要更新这个overlayView就行啦~
@implementation UINavigationBar (BackgroundColor)
static char overlayKey;
- (UIView *)overlay
{
return objc_getAssociatedObject(self, &overlayKey);
}
- (void)setOverlay:(UIView *)overlay
{
objc_setAssociatedObject(self, &overlayKey, overlay, OBJC_ASSOCIATION_RETAIN_NONATOMIC);
}
- (void)lt_setBackgroundColor:(UIColor *)backgroundColor
{
if (!self.overlay) {
[self setBackgroundImage:[UIImage new] forBarMetrics:UIBarMetricsDefault];
// insert an overlay into the view hierarchy
self.overlay = [[UIView alloc] initWithFrame:CGRectMake(0, -20, [UIScreen mainScreen].bounds.size.width, self.bounds.size.height + 20)];
self.overlay.autoresizingMask = UIViewAutoresizingFlexibleWidth|UIViewAutoresizingFlexibleHeight;
[self insertSubview:self.overlay atIndex:0];
}
self.overlay.backgroundColor = backgroundColor;
}
@end
最后在scrollViewDidScroll中,我们就可以动态地修改UINavigationBar的backgroundColor了:
[self.navigationController.navigationBar lt_setBackgroundColor:[color colorWithAlphaComponent:alpha]];
完整的代码在这里:https://github.com/ltebean/LTNavigationBar
写在最后
UINavigationBar是一个比较特殊的view,它被系统高度集成,有时候定制起来并不那么方便。其实这个demo完全可以用另外一种方法实现,就是不用UINavigationBar,自己画一套UI。
很多时候我们都会发现系统原生控件出现一些预料之外的行为,那么打开view debugging,找出原因,然后解决它!
动态修改UINavigationBar的背景色--by-胡旭的更多相关文章
- 动态修改UINavigationBar的背景色
这是我们最终想要得到的效果: 思路 在UISrollView的delegate方法 1 - (void)scrollViewDidScroll:(UIScrollView *)scrollView ...
- iOS 动态修改导航栏颜色 UINavigationBar
示例 所谓动态修改 意思是 在当前页面滚动的过程中 亦或 是在 触发返回事件\进入一个新的页面 导航栏的动态变化 由于系统级别的navBar 高度集成 很多自己想实现的功能 很不好弄 如果是通过 ...
- 动态修改svg的颜色,svg做背景色时候修改颜色
svg修改背景色可以使用fill属性来修改,但是我现在需要动态改变svg的颜色,例如我hover的时候 现在发现一种兼容性还不错的方法是css属性mask 类似于给路径填充上颜色,结合backgrou ...
- ReactNative 根据scrollView/listview滑动距离动态修改NavBar颜色
我们常见某些APP上滑的时候,NavBar颜色会从透明渐变为某种颜色 原理非常简单,根据scrollView的回调动态修改NavBar的透明度即可. 在RN中,尤其是ListView中这个回调不是很好 ...
- ASP.NET中直接用C# 动态修改CSS样式
ASP.NET中直接用C# 动态修改CSS样式 wonsoft (wonsoft@163.com) 使用JavaScript控制CSS样式有点麻烦,还是觉得直接使用C#操作更方便快捷,本文通过两个B ...
- 关于devexpress报表XtraReport,动态修改报表样式(.repx格式),动态添加数据并使用的理解
一.基本概念: XtraReports 中的每个报表都由 XtraRepot 类的一个实例表示,或者由该类的子类来表示(这种情况更常见). 因此,每个报表都作为带区的容器使用,而每个带区中都包含报表控 ...
- 【VS开发】VS2010 MFC中控件、对话框等背景颜色动态修改的方法
[VS开发]VS2010 MFC中控件.对话框等背景颜色动态修改的方法 标签(空格分隔):[VS开发] 声明:引用请注明出处http://blog.csdn.net/lg1259156776/ 说明: ...
- react+antd 使用脚手架动态修改主题色
最近做了一个需求,后台管理系统添加一个可以动态修改ant-design主题色.查询了大多数的文章,发现基本都是抄来抄去,而且文章记录的也一点也不详细.刚刚把这个功能做完了,顺便记录一下如何去修改主题色 ...
- thinkphp 3.2.3 动态修改conf配置文件
thinkphp 3.2.3 的C()方法能修改配置文件,但是是动态修改的,没有真正的更改文件. 我查了网上网友分享的方法,都不怎么合适,我就自己摸索写了一个,配置写到text.php中,我的目录如下 ...
随机推荐
- Java基础寒假作业-简易计算器
需求: 使用Java编写计算器的控制台程序,完成简单的加减乘除运算.实现以下功能: 1.运算选择 请用户选择一个算法(1.加法 2.减法 3.乘法 4.除法 5.关闭计算器) 2.计算 a)加法:实现 ...
- Docker | dockerfile 文件编写
dockerfile 的作用 dockerfile 作用就是制作镜像,保持开发,测试,生产环境的一致性. 直接将容器制作为镜像 制作新的镜像 # 把容器按照自己的需求个性完之后,就可以创建自己的镜像的 ...
- PaperRead - Comparison of Fundamental Mesh Smoothing Algorithms for Medical Surface Models
几种常见平滑算法的实现可以参见: 几种网格平滑算法的实现 - Jumanco&Hide - 博客园 (cnblogs.com) 1 Introduction 图像空间中相关的组织和结构,变换成 ...
- CSS基础 margin塌陷问题以及解决 办法
场景:两个相互嵌套的块级元素,父子元素相互紧贴margin-top会合并作用在父元素的子元素结果:导致两个盒子同时移动 解决方法: 1.给父元素设置overflow:hidden 2.给父元素设置浮动 ...
- 02.python线性数据结构
内建常用数据类型 分类 数值型 int.float.complex.bool 序列sequence 字符串str.字节序列bytes.bytearray 列表list.元组tuple 键值对 集合se ...
- win 10 遇到某文件一直在占用导致无法关闭,或者去任务管理器找不到服务怎么办?具体解决
1. 打开 cmd 指令框 ,输入 perfmon 回车 就会出来这个 点击 打开资源监视器, 在句柄搜索框搜索 那个占用资源的文件或软件关键词 ,如下 搜索酷狗 将有关的选项,右键选中后 打开菜单 ...
- [ bootstrap ] 图片内容占用padding的范围,如何解决?
问题描述: 从效果图看到,图片内容占据了padding的范围,怎么解决呢? html代码 <div class="container"> <div class=& ...
- 函数实现将 DataFrame 数据直接划分为测试集训练集
虽然 Scikit-Learn 有可以划分数据集的函数 train_test_split ,但在有些特殊情况我们只希望它将 DataFrame 数据直接划分为 train, test 而不是像 tr ...
- Android一句话 | View事件分发
View中,无论是down,move,还是up,事件都是这样传递的:由dispatchTouchEvent到onTouch,再到onTouchEvent,click是在onTouchEvent中的. ...
- day2 数组字符串逆序存放正序对接调试
这个问题仔细想了想,是s,t,s[],t[],重定义了,导致输入的是s,t这个定义变量,与传参传的是指针变量就不匹配了. 如果加上对s,t的地址,让传参的形式想匹配,还是报错,这块也没有弄懂,初步觉的 ...