首页 > 代码库 > UIView中的tintColor和renderingMode

UIView中的tintColor和renderingMode

tintColor

  • 每一个view都有一个tintcolor,类似于魔法色,实现类似于换肤的效果。
  • 每一个view的subview都集成view的tintcolor,当然subview可以指定自己的tintcolor
  • 如果不指定的话,默认为blue

对于tabBar,不指定tintColor的话,效果如下:

技术分享
如果指定了tintColor为黄色,效果如下:

self.tabBar.tintColor = UIColor.yellowColor()

技术分享

UIImageRenderingMode

在iOS7以后,每个image的渲染模式有两种,一种是作为原图来渲染,一种是作为模板。作为模板来渲染时,系统会根据这种图片的alpha值来得到一个新的图片,原图的RGB色值不会被考虑。而tintColor的颜色是新图片的颜色。

每一个image在创建时候,渲染模式都是UIImageRenderingModeAutomatic,即根据上下文来选择渲染模式。根据文档,在导航栏、tabBar、toolbar等的前景图(foreground images)会在模板模式下被渲染。所以,如果我们在初始化tabBarItem时,如果不指定渲染模式为UIImageRenderingModeAlwaysOriginal,就会得到一个色块,而不是原图。

例子

        self.tabBar.tintColor = UIColor.yellowColor()
        self.pigVC?.tabBarItem = UITabBarItem.init(title: "pig",
                                                   image:TGResizeImage(image!,byRatio: 0.5),
                                                   tag: 1);
        self.catVC?.tabBarItem = UITabBarItem.init(title: "cat",
                                                   image:TGResizeImage(image!,byRatio: 0.5).imageWithRenderingMode(.AlwaysOriginal),
                                                   tag: 0);

设置了一个UITabBarController,有5个VC。pigVCtabBarItem初始化时,没有指定对应的imageview的renderingMode,而tabBartintColor又是黄色。对比catVC,初始化tabBarItem时,imageView的renderingMode指定为.AlwaysOriginal。效果如下:

技术分享

技术分享
可以看出pigVC在选中态、未选中态时,对应tabBarItem的图像都是色块,不同的是选中时,色块颜色是指定的tintColor,即黄色。
catVC在选中态、未选中态时,对应的tabBarItem的图像都是原图。
两个tabBarItem的文字的颜色在选中态都是tintColor对应的颜色。

UIView中的tintColor和renderingMode