ios 如何从分段控件中删除边框

How to remove border from segmented control

提问by Happiehappie

How do I remove the outside border of a segmented control? I've set the divider image to what I wanted but now to follow the mock of my app I need to have a segmented control without the outer border.

如何删除分段控件的外边框？我已经将分隔符图像设置为我想要的，但现在要遵循我的应用程序的模拟，我需要有一个没有外边框的分段控件。

回答by Sohil R. Memon

What you must understand is the backgroundColorproperty is not stateful. Hence you have to use setBackgroundImage(_:for:barMetrics:).

您必须了解的是，该backgroundColor属性不是有状态的。因此你必须使用setBackgroundImage(_:for:barMetrics:).

We can easily remove both borders and dividers using the below function.

我们可以使用以下函数轻松删除边框和分隔线。

For Swift 3 & 4+:

对于 Swift 3 和 4+：

extension UISegmentedControl {
    func removeBorders() {
        setBackgroundImage(imageWithColor(color: backgroundColor ?? .clear), for: .normal, barMetrics: .default)
        setBackgroundImage(imageWithColor(color: tintColor!), for: .selected, barMetrics: .default)
        setDividerImage(imageWithColor(color: UIColor.clear), forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)
    }

    // create a 1x1 image with this color
    private func imageWithColor(color: UIColor) -> UIImage {
        let rect = CGRect(x: 0.0, y: 0.0, width:  1.0, height: 1.0)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()
        context!.setFillColor(color.cgColor);
        context!.fill(rect);
        let image = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        return image!
    }
}

---

---

For Swift 2.2:

对于 Swift 2.2：

extension UISegmentedControl {
    func removeBorders() {
        setBackgroundImage(imageWithColor(backgroundColor!), forState: .Normal, barMetrics: .Default)
        setBackgroundImage(imageWithColor(tintColor!), forState: .Selected, barMetrics: .Default)
        setDividerImage(imageWithColor(UIColor.clearColor()), forLeftSegmentState: .Normal, rightSegmentState: .Normal, barMetrics: .Default)
    }

    // create a 1x1 image with this color
    private func imageWithColor(color: UIColor) -> UIImage {
        let rect = CGRectMake(0.0, 0.0, 1.0, 1.0)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()
        CGContextSetFillColorWithColor(context, color.CGColor);
        CGContextFillRect(context, rect);
        let image = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        return image
    }
}

Call the above function.

调用上面的函数。

segmentedControl.removeBorders()

Reference: Remove UISegmentedControl separators completely. (iphone)

参考：完全删除 UISegmentedControl 分隔符。（苹果手机）

Thanks to https://stackoverflow.com/users/3921490/amagainfor Swift 3 version.

感谢https://stackoverflow.com/users/3921490/aagainSwift 3 版本。

回答by amagain

Here's the swift 3 version of Sohil's answer that might help someone else. It did help me. :)

这是Sohil答案的 swift 3 版本，可能对其他人有帮助。它确实帮助了我。:)

extension UISegmentedControl {
func removeBorders() {
    setBackgroundImage(imageWithColor(color: backgroundColor!), for: .normal, barMetrics: .default)
    setBackgroundImage(imageWithColor(color: tintColor!), for: .selected, barMetrics: .default)
    setDividerImage(imageWithColor(color: UIColor.clear), forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)
}

// create a 1x1 image with this color
private func imageWithColor(color: UIColor) -> UIImage {
    let rect = CGRect(x: 0.0, y: 0.0, width:  1.0, height: 1.0)
    UIGraphicsBeginImageContext(rect.size)
    let context = UIGraphicsGetCurrentContext()
    context!.setFillColor(color.cgColor);
    context!.fill(rect);
    let image = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();
    return image!
    }
}

回答by kalpa

Hope it will help someone

希望它会帮助某人

Swift - 4

斯威夫特 - 4

Make the Background color and Tint color of your Segment control to same color. Then "set titleTextAttributes" of your Segment control

将 Segment 控件的背景颜色和色调颜色设置为相同的颜色。然后“设置 titleTextAttributes”您的 Segment 控件

    segmentedControl.tintColor = UIColor.red
    segmentedControl.backgroundColor = UIColor.red
    let attributes = [NSAttributedStringKey.foregroundColor: UIColor.white]
    segmentedControl.setTitleTextAttributes(attributes, for: .normal)
    segmentedControl.setTitleTextAttributes(attributes, for: .selected)

回答by miss Gbot

If you want save borders between cells

如果要保存单元格之间的边框

extension UISegmentedControl {
  func removeBorders() {
    if let backgroundColor = backgroundColor, let backgroundImage = UIImage.imageWithSize(size: CGSize.one_one, color: backgroundColor){
      setBackgroundImage(backgroundImage, for: .normal, barMetrics: .default)
    }

    if let tintColor = tintColor, let tintImage = UIImage.imageWithSize(size: CGSize.one_one, color: tintColor){
      setBackgroundImage(tintImage, for: .selected, barMetrics: .default)
        setDividerImage(tintImage, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)
    }
  }
}

extension CGSize{
  static var one_one: CGSize{
    return CGSize(width: 1.0, height: 1.0)
  }
}

extension UIImage{
  static func imageWithSize(size : CGSize, color : UIColor = UIColor.white) -> UIImage? {
    var image:UIImage? = nil
    UIGraphicsBeginImageContext(size)
    if let context = UIGraphicsGetCurrentContext() {
      context.setFillColor(color.cgColor)
      context.addRect(CGRect(origin: CGPoint.zero, size: size));
      context.drawPath(using: .fill)
      image = UIGraphicsGetImageFromCurrentImageContext();
    }
    UIGraphicsEndImageContext()
    return image
  }
}

回答by Alex Kornhauser

You might have the usecase where you don't want the rounded border as you don't want to see it if it's embedded in a cell. In this case, set the autolayout constraints to -2 and the border will be hidden as it will extend beyond the cell border.

您可能有这样的用例，您不想要圆形边框，因为如果它嵌入在单元格中，您不想看到它。在这种情况下，将自动布局约束设置为 -2，边框将被隐藏，因为它将超出单元格边框。

回答by Lal Krishna

If you need segment control with texts Only, use,

如果您只需要文本段控制，请使用，

segmentControl.backgroundColor = .clear
segmentControl.tintColor = .clear

let attributes: [NSAttributedString.Key : Any] = [.font : UIFont(family: .medium, ofSize: 13)!, .foregroundColor : UIColor.white]
segmentControl.setTitleTextAttributes(attributes, for: .normal)

let selectedAttrib: [NSAttributedString.Key : Any] = [.font : UIFont(family: .medium, ofSize: 13)!, .foregroundColor : UIColor.red]
segmentControl.setTitleTextAttributes(hightLightedStateAttrib, for: .selected)

NB: I googled it for a long time, thats why i'm posted here.

注意：我在谷歌上搜索了很长时间，这就是我发布在这里的原因。

Source: CodeMentor

资料来源：CodeMentor

回答by Honey

• The accepted answer works for getting rid of the border.
• The solution mentioned herealso works for disabling the segmented Control.

• 接受的答案适用于摆脱边界。
• 这里提到的解决方案也适用于禁用分段控件。

Yet putting the two solutions together, I wasn't able to get the correct selectedsegment in a disabledstate.

然而，将这两个解决方案放在一起，我无法在某个状态下获得正确的选定段disabled。

What I wanted was that upon selecting a segment and making a network call, I wanted to disable the segmented control.

我想要的是在选择一个段并进行网络呼叫时，我想禁用分段控制。

The outcome was like this:

结果是这样的：

What was desired was this:

想要的是这样的：

The only addition to Sohil's solutionis:

Sohil 解决方案的唯一补充是：

setBackgroundImage(imageWithColor(color: imageWithColor(color: tintColor)), for: [.selected, .disabled], barMetrics: .default)

After the selected && disabledsegment will have the right color.

选中 && 禁用后的段将具有正确的颜色。

回答by Alessandro Ornano

Swift 5.x:

斯威夫特 5.x：

This solution remove only the external border and preserve the round corner on each button

此解决方案仅删除外部边框并保留每个按钮上的圆角

extension UISegmentedControl {
    func removeBorders(andBackground:Bool=false) {
        setBackgroundImage(imageWithColor(color: backgroundColor ?? .clear), for: .normal, barMetrics: .default)
        setBackgroundImage(imageWithColor(color: tintColor!), for: .selected, barMetrics: .default)
        setDividerImage(imageWithColor(color: UIColor.clear), forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)

        _ = self.subviews.compactMap {
            if (
mySegmentedControl.removeBorders()
.frame.width>0) {
                ##代码##.layer.cornerRadius = 8
                ##代码##.layer.borderColor = UIColor.clear.cgColor
                ##代码##.clipsToBounds = true
                ##代码##.layer.borderWidth = andBackground ? 1.0 : 0.0
                ##代码##.layer.borderColor = andBackground ? tintColor?.cgColor : UIColor.clear.cgColor
                andBackground ? ##代码##.layer.backgroundColor = UIColor.clear.cgColor : nil
            }
        }
    }

    // create a 1x1 image with this color
    private func imageWithColor(color: UIColor) -> UIImage {
        let rect = CGRect(x: 0.0, y: 0.0, width:  1.0, height: 1.0)
        UIGraphicsBeginImageContext(rect.size)
        let context = UIGraphicsGetCurrentContext()
        context!.setFillColor(color.cgColor);
        context!.fill(rect);
        let image = UIGraphicsGetImageFromCurrentImageContext();
        UIGraphicsEndImageContext();
        return image!
    }
}

Usage:

用法：

##代码##