TabBarController 是在 ios 开发过程中使用较为频繁的一个 Controller,但是在使用过程中经常会遇到一些问题,例如本文所要解决的,如何修改 TabBar 选中时文字及图片的颜色。

如果需要,可以从这里下载完整的代码。

首先,我们创建一个新的项目,使用 TabBarController,并为该 TabBarController 的 Child Controller 中的 TabBarItem 设置默认图片以及选中时的图片,如下图所示:

storyboard:

tab bar items:

image assets:

我们将 tab bar item 的默认图片是设置为灰色图,选中后是红色图。编译运行该项目,会发现并不是我们所期望的,貌似我们的设置的选中图片并没有生效呀~~(其实是生效的,只是图片颜色不对罢了~不信的话,可以将selected image和image设置成不同的图片看看哦~)

通过查看下 ios 中生成 tab bar item 的 api 可以发现:

原来 UIImage 在呈现(render)时会选择对应的呈现方式(render mode),ios提供了3种render mode,分别是

意义
UIImageRenderingModeAutomatic  根据图片的使用位置自动调整渲染模式(默认值)
UIImageRenderingModeAlwaysOriginal  始终绘制图片原始状态,不适用tint color。  
UIImageRenderingModeAlwaysTemplate  使用根据tint color绘制图片,忽略图片的颜色信息

所以要解决我们遇到的问题,只需要设置选中的图片的render mode就可以了。

打开其中一个view controller, 在viewDidLoad方法里添加下述代码:

   UIImage *image = [self.tabBarItem.selectedImage imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
self.tabBarItem.selectedImage = image;

重新运行程序,可以看到选中的tab bar item变成红色的图片了,但是文字的颜色还是木有变呀~

我们可以用 text attribute 的方式设置文字样式,在上述代码下继续添加:

   [self.tabBarItem setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor redColor]} forState:UIControlStateSelected];

编译运行,可以看到字和图片都变成我们想要的啦,大功告成~

设置 TabBarItem 选中时的图片及文字颜色的更多相关文章

  1. 设置TabBarItem选中时的图片及文字颜色

    TabBarItem选中时,默认文字和图片都变为蓝色.使用以下代码可以进行修改. MainViewController *mainVC = [[MainViewController alloc] in ...

  2. 设置UITableViewCell 选中时的背景颜色

    自定义Cell如图 一个View上面放了四个Label 分别连线到.m文件中 @property (weak, nonatomic) IBOutlet UILabel *nameLabel; @pro ...

  3. iOS TabbarController 设置底部Toolbar图片和文字颜色选中样式

    提取公共方法: -(void)createChildVcWithVc:(UIViewController *)vc Title:(NSString *)title image:(NSString *) ...

  4. iOS设置cell选中时文字颜色的变化

    cell.titleStr.highlightedTextColor = EMCGreenColor;

  5. QTextEdit中选中文本修改字体与颜色,全部文本修改字体与颜色(设置调色板的前景色、背景色、文字颜色以及基色)

    ----我的生活,我的点点滴滴!! 当然以下内容都可以通过设置样式来达到目的,但是下面不使用这样的方法 先来看张图,理解此图基本就能实现上面所要达到的目的了 Widget::Widget(QWidge ...

  6. android在代码中四种设置控件(以及TextView的文字颜色)背景颜色的方法

      http://blog.csdn.net/fth826595345/article/details/9208771 主题 TextView 转载请注明出处: http://blog.csdn.ne ...

  7. 设置tabBar的图片/高度/title颜色

    实现了一下内容: 1.设置tabBarItem选中及非选中时的图片,图片充满item; 2.调整了 tabBar 高度; 3.改变了title颜色及位置. ------------代码如下: ---T ...

  8. CSS 之 控制图片与文字对齐

    文字旁边搭配图片时,发现图片比文字靠上,原来默认的情况是图片顶对齐而文字底对齐,通过设置css属性可以使得图片与文字对齐. 设置各对象的vertical-align属性,属性说明: baseline- ...

  9. css控制图片与文字对齐

    文字旁边搭配图片时,发现图片比文字靠上,原来默认的情况是图片顶对齐而文字底对齐,通过设置css属性可以使得图片与文字对齐. 设置各对象的vertical-align属性,属性说明:baseline-将 ...

随机推荐

  1. Global eval. What are the options?

    David Flanagan最近写了一个关于全局eval的简单表达式,可以用一行式子表示: var geval = this.execScript || eval; 尽管看起来很简短,但是跨浏览器的兼 ...

  2. Machine Learning

    Recently, I am studying Maching Learning which is our course. My English is not good but this course ...

  3. 关于《selenium2自动测试实战--基于Python语言》

    关于本书的类型: 首先在我看来技术书分为两类,一类是“思想”,一类是“操作手册”. 对于思想类的书,一般作者有很多年经验积累,这类书需要细读与品位.高手读了会深有体会,豁然开朗.新手读了不止所云,甚至 ...

  4. 2.第一个Struts2程序-HelloWorld程序

    1.新建Web Project项目:Study_Struts2 2.新建HelloWordAction.java类 3.复制struts.xml文件到src目录下,配置struts.xml文件内容如下 ...

  5. 转: GUI应用程序架构的十年变迁:MVC,MVP,MVVM,Unidirectional,Clean

    十年前,Martin Fowler撰写了 GUI Architectures 一文,至今被奉为经典.本文所谈的所谓架构二字,核心即是对于对于富客户端的 代码组织/职责划分 .纵览这十年内的架构模式变迁 ...

  6. Android封装OkHttpClient的类库

    由于android6.0的SDK没有HttpClient,只有HttpURLConnection和OkHttpClient,特记下OkHttpClient的使用方法 1.Ui测试界面布局 <?x ...

  7. 纯css3天气动画场景特效

    CSS3超强大,以下是纯用CSS3+HTML实现的场景效果图: 查看效果:http://hovertree.com/h/bjaf/cssrotate.htm css3 3d展示中rotate()介绍与 ...

  8. win10与ubuntu下演示运行.net core rc2 1.0.0.3002702程序

    随着.net core rc2(1.0.0.002702)发布的同时,我们也来在本地 win10与ubuntu玩一下吧. 先简单说下.net core ,在.net core rc1中用的是dnx 工 ...

  9. Java--JDK动态代理核心源码解析

    1.首先我们了解一下JDK动态代理的使用方法: public static void main(String[] args) { /** * 创建一个Bean对象,该对象实现BeanInterFace ...

  10. Hadoop之HDFS文件读写过程

    一.HDFS读过程 1.1 HDFS API 读文件 Configuration conf = new Configuration(); FileSystem fs = FileSystem.get( ...