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. MySQL中RESET SLAVE和RESET MASTER的区别

    RESET SLAVE的语法如下: RESET SLAVE [ALL] [channel_option] channel_option: FOR CHANNEL channel 其中,channel_ ...

  2. AGS中通过FeatureServer插入数据失败、插入数据在WMTS请求中无法显示以及version概念的讨论

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 在多个项目中,当我方接口给其他部门人员使用时出现了插入数据失 ...

  3. (十三)WebGIS中工具栏的设计之命令模式

    文章版权由作者李晓晖和博客园共有,若转载请于明显处标明出处:http://www.cnblogs.com/naaoveGIS/. 1.背景 从这一章节开始我们将正式进入WebGIS的工具栏中相关功能的 ...

  4. 【JUC】JDK1.8源码分析之LinkedBlockingQueue(四)

    一.前言 分析完了ArrayBlockingQueue后,接着分析LinkedBlockingQueue,与ArrayBlockingQueue不相同,LinkedBlockingQueue底层采用的 ...

  5. 关于JavaScript定时机制的总结

    要理解JavaScript的定时机制,就要知道JavaScript的运行机制. 首先声明,JavaScript是单线程运行(JavaScript引擎线程)事件驱动. 一.浏览器中有多个线程 一款浏览器 ...

  6. 7.7 数据注解特性--Table

    大家可能注意到,有几个特性,我没有翻译,因为实在是太简单了,看一下就知道,之前也学过,现在只是系统学一下,所以就粗略的看一下就行了. 现在学习数据注解特性的--Table特性. Table 特性可以被 ...

  7. Nancy之结合tinyfox给我们的应用提供简单的数据服务

    说到提供数据服务给我们的一些应用,估计用的最多的也就是json和xml这两种数据格式 实现的方法也是多种多样,web api,mvc的jsonresult和contentresult...等等 本文是 ...

  8. Using Nuget in Visual Studio 2005 & 2008

    NuGet is a Visual Studio extension that makes it easy to install and update third-party libraries an ...

  9. jQuery+HTML5弹出创意搜索框层

    效果体验:http://hovertree.com/texiao/jquery/26/ 本效果适用于移动设备,可以使用手机等浏览效果. 代码下载:http://hovertree.com/h/bjaf ...

  10. 设置Textview最大长度,超出显示省略号

    <TextView android:id="@+id/tvUserNameUgcListItem" android:layout_height="@dimen/dp ...