Sian 发表于 2014-8-9 18:16:19

ios6制作扁平化的segmentedControl(仿iOS7风格)

本帖最后由 Sian 于 2014-8-9 18:18 编辑

先上效果图:

像 UISegmentControl 通过自定义或者第三方控件,很容易实现 iOS6 和 iOS7 一致风格,如果你就想用系统的控件让 iOS6 实现 iOS7 的风格也不是没有办法。我们可以设置 segment 部分选中状态和非选中状态下的背景图片,segment 之间的分割线图片。因为 iOS6 上 UISegmentControl 的 title 字体比 iOS7 上大,也可以一并做一下修改:
1、通过appearance修改属性
      
      UISegmentedControl *seg = ;
      
      // 默认状态
      UIImage *normal = ;
      ;

      // 选择状态
      UIImage *selected = ;
      ;
      
      // 高亮状态
      UIImage *highlight = ;
      ;
      
      // 中分隔线
      ;
      
      // 文字属性
      , UITextAttributeTextShadowOffset: } forState:UIControlStateNormal];
      , UITextAttributeFont: , UITextAttributeTextShadowOffset: } forState:UIControlStateSelected];2、设置圆角属性
    <span style="background-color: rgb(255, 255, 255);">segment</span>.layer.cornerRadius = 4.0f;
    <span style="background-color: rgb(255, 255, 255);">segment</span>.layer.masksToBounds = YES;
    <span style="background-color: rgb(255, 255, 255);">segment</span>.layer.borderWidth = 1.0f;
    <span style="background-color: rgb(255, 255, 255);">segment</span>.layer.borderColor = kBlueColor.CGColor;注意:
1、第1点可以在任何地方实现,只要在创建segment之前能执行就OK
2、第2点设置圆角只能创建segment后再设置才会生效,如果是自定义segment,把该部分代码写在init方法中是不生效的
3、个人建议自定义segment,然后把第二部分在Frame的set方法中实现,如:
- (void)setFrame:(CGRect)frame
{
    ;
    self.layer.cornerRadius = 4.0f;
    self.layer.masksToBounds = YES;
    self.layer.borderWidth = 1.0f;
    self.layer.borderColor = kBlueColor.CGColor;
}附:提供上述使用到的样式图,让你的ios6的segment实现扁平化,高仿ios7风格



参考链接:http://blog.sina.com.cn/s/blog_605409770101ovdk.html
页: [1]
查看完整版本: ios6制作扁平化的segmentedControl(仿iOS7风格)