button 设置背景出现蓝色条问题

创建

xib：直接拖

code:UIButton* button = [UIButton buttonWithType:UIButtonTypeCustom];

注意：xib中直接拖进去的button默认为UIButtonTypeSystem，该类型默认会对button做些一些定制化工作(包括字体，颜色等)，如果我们在该类型的基础上对button做自定义背景图片，会产生错误的效果。对于我们最常用的按钮，通常设定为UIButtonTypeCustom

背景图片

设置常态下的背景图片

[self.button setBackgroundImage:[UIImage imageNamed:@"green_btn_normal"] forState:UIControlStateNormal];

设置按下状态的背景图片

[self.button setBackgroundImage:[UIImage imageNamed:@"green_btn_selected"] forState:UIControlStateHighlighted];

注意：按下状态时，state的值是UIControlStateHighlighted，而不是selected，只有这样设置，才能让你的按钮显示出正确的颜色

实例解析

制作demo，需求如下：

创建2个按钮

SystemTypeOriginal为storyboard中直接拖上去的button，type保持system不变，设置green_btn_normal.png为normal状态的背景图片，设置green_btn_selected.png为highlighted状态的背景图片

CustomTypeOriginal为storyboard中直接拖上去的button，type设置为Custom，设置green_btn_normal.png为normal状态的背景图片，设置green_btn_selected.png为highlighted状态的背景图片

运行demo，效果图如下：

Paste_Image.png

通过上图分析可知：

SystemType下字体默认为15，且字体颜色为蓝色

CustomType下字体默认为18，字体颜色为白色

普通状态下的按钮背景图片与预期相符，green_btn_normal表示的是原始图片的颜色，此时原始图片颜色与按钮背景颜色一致

此时，按下SystemTypeOriginal，效果图如下：

按下SystemTypeOriginal

上图的按下效果变得非常诡异，与预期的green_btn_selected颜色相差甚远，这就是上面说的，在systemtype下，设置背景图片会产生错误的效果，所以常用的按钮都会设置为Customtype。

那么，我们按下CustomTypeOriginal，看下效果图：

按下CustomTypeOriginal

现在按下的背景图片就对了！

为什么要设置highlighted而不是selected

因为button在按下时，状态是highlighted，而不是selected，所以设置selected是没有作用的。