Swift 自定义UISegmentedControl

最新推荐文章于 2021-08-13 08:08:47 发布

星光uoin

最新推荐文章于 2021-08-13 08:08:47 发布

阅读量2.9k

点赞数

分类专栏： IT iOS swift 自定义UI 文章标签： Swift 自定义UISegmentedControl 自定义UISegmentedControl

本文链接：https://blog.csdn.net/qq_37269542/article/details/88415566

版权

iOS 同时被 3 个专栏收录

35 篇文章 0 订阅

订阅专栏

29 篇文章 1 订阅

订阅专栏

swift

27 篇文章 0 订阅

订阅专栏

在项目需求中需要实现如下UI效果(背景色自定义，并且去除segmentcontrol中间的分割线及边框颜色)：

实现代码如下：

import UIKit

class ViewController: UIViewController {

    override func viewDidLoad() {
        super.viewDidLoad()
        
        let segment = UISegmentedControl(items: ["测试一", "测试二", "测试三"])
        segment.frame = CGRect(x: 100, y: 100, width: 250, height: 40)
        segment.center.x = self.view.center.x
        segment.setSegmentStyle(normalColor: UIColor(red: 249/255.0, green: 249/255.0, blue: 249/255.0, alpha: 1.0), selectedColor: UIColor(red: 251/255.0, green: 84/255.0, blue: 6/255.0, alpha: 1.0), dividerColor: UIColor.clear)
        segment.selectedSegmentIndex = 0
        view.addSubview(segment)
    }
}

//通过输入rgb值返回一个该颜色的img
extension UIImage{
    public class func renderImageWithColor(_ color: UIColor, size: CGSize) -> UIImage {
        UIGraphicsBeginImageContext(size)
        guard let context = UIGraphicsGetCurrentContext() else {
            UIGraphicsEndImageContext()
            return UIImage()
        }
        context.setFillColor(color.cgColor);
        context.fill(CGRect(x: 0, y: 0, width: size.width, height: size.height));
        let img = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return img ?? UIImage()
    }
}

extension UISegmentedControl {
    /// 自定义样式
    /// - Parameters:
    ///   - normalColor: 普通状态下背景色
    ///   - selectedColor: 选中状态下背景色
    ///   - dividerColor: 选项之间的分割线颜色
    func setSegmentStyle(normalColor: UIColor, selectedColor: UIColor, dividerColor: UIColor) {
        
        let normalColorImage = UIImage.renderImageWithColor(normalColor, size: CGSize(width: 1.0, height: 1.0))
        let selectedColorImage = UIImage.renderImageWithColor(selectedColor, size: CGSize(width: 1.0, height: 1.0))
        let dividerColorImage = UIImage.renderImageWithColor(dividerColor, size: CGSize(width: 1.0, height: 1.0))
        
        setBackgroundImage(normalColorImage, for: .normal, barMetrics: .default)
        setBackgroundImage(selectedColorImage, for: .selected, barMetrics: .default)
        setDividerImage(dividerColorImage, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)
        
        // 文字在两种状态下的颜色
        setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.gray, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 14)], for: .normal)
        setTitleTextAttributes([NSAttributedString.Key.foregroundColor: UIColor.white,NSAttributedString.Key.font: UIFont.systemFont(ofSize: 14)], for: .selected)
        
        // 边界颜色、圆角
        self.layer.borderWidth = 0.7
        self.layer.cornerRadius = 5.0
        self.layer.borderColor = dividerColor.cgColor
        self.layer.masksToBounds = true
    }
}