FredFlinstone :
XCODE 11.1 & iOS 13\n\nBased on @Jigar Darji 's answer but a safer implementation.\n\nWe first create a failable convenience initialiser:\n\nextension UIImage {\n\nconvenience init?(color: UIColor, size: CGSize) {\n UIGraphicsBeginImageContextWithOptions(size, false, 1)\n color.set()\n guard let ctx = UIGraphicsGetCurrentContext() else { return nil }\n ctx.fill(CGRect(origin: .zero, size: size))\n guard\n let image = UIGraphicsGetImageFromCurrentImageContext(),\n let imagePNGData = image.pngData()\n else { return nil }\n UIGraphicsEndImageContext()\n\n self.init(data: imagePNGData)\n }\n}\n\n\nThen we extend UISegmentedControl:\n\nextension UISegmentedControl {\n\nfunc fallBackToPreIOS13Layout(using tintColor: UIColor) {\n if #available(iOS 13, *) {\n let backGroundImage = UIImage(color: .clear, size: CGSize(width: 1, height: 32))\n let dividerImage = UIImage(color: tintColor, size: CGSize(width: 1, height: 32))\n\n setBackgroundImage(backGroundImage, for: .normal, barMetrics: .default)\n setBackgroundImage(dividerImage, for: .selected, barMetrics: .default)\n\n setDividerImage(dividerImage,\n forLeftSegmentState: .normal,\n rightSegmentState: .normal, barMetrics: .default)\n\n layer.borderWidth = 1\n layer.borderColor = tintColor.cgColor\n\n setTitleTextAttributes([.foregroundColor: tintColor], for: .normal)\n setTitleTextAttributes([.foregroundColor: UIColor.white], for: .selected)\n } else {\n self.tintColor = tintColor\n }\n }\n}\n",
2019-10-14T13:25:19
t9mike :
Here is my take on Jonathan.'s answer for Xamarin.iOS (C#), but with fixes for image sizing. As with Cœur's comment on Colin Blake's answer, I made all images except the divider the size of the segmented control. The divider is 1xheight of the segment. \n\npublic static UIImage ImageWithColor(UIColor color, CGSize size)\n{\n var rect = new CGRect(0, 0, size.Width, size.Height);\n UIGraphics.BeginImageContext(rect.Size);\n var context = UIGraphics.GetCurrentContext();\n context.SetFillColor(color.CGColor);\n context.FillRect(rect);\n var image = UIGraphics.GetImageFromCurrentImageContext();\n UIGraphics.EndImageContext();\n return image;\n}\n\n// https://stackoverflow.com/a/56465501/420175\npublic static void ColorSegmentiOS13(UISegmentedControl uis, UIColor tintColor, UIColor textSelectedColor, UIColor textDeselectedColor)\n{\n if (!UIDevice.CurrentDevice.CheckSystemVersion(13, 0))\n {\n return;\n }\n\n UIImage image(UIColor color)\n {\n return ImageWithColor(color, uis.Frame.Size);\n }\n\n UIImage imageDivider(UIColor color)\n {\n return ImageWithColor(color, 1, uis.Frame.Height);\n }\n\n // Must set the background image for normal to something (even clear) else the rest won't work\n //setBackgroundImage(UIImage(color: backgroundColor ?? .clear), for: .normal, barMetrics: .default)\n uis.SetBackgroundImage(image(UIColor.Clear), UIControlState.Normal, UIBarMetrics.Default);\n\n // setBackgroundImage(tintColorImage, for: .selected, barMetrics: .default)\n uis.SetBackgroundImage(image(tintColor), UIControlState.Selected, UIBarMetrics.Default);\n\n // setBackgroundImage(UIImage(color: tintColor.withAlphaComponent(0.2)), for: .highlighted, barMetrics: .default)\n uis.SetBackgroundImage(image(tintColor.ColorWithAlpha(0.2f)), UIControlState.Highlighted, UIBarMetrics.Default);\n\n // setBackgroundImage(tintColorImage, for: [.highlighted, .selected], barMetrics: .default)\n uis.SetBackgroundImage(image(tintColor), UIControlState.Highlighted | UIControlState.Selected, UIBarMetrics.Default);\n\n // setTitleTextAttributes([.foregroundColor: tintColor, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 13, weight: .regular)], for: .normal)\n // Change: support distinct color for selected/de-selected; keep original font\n uis.SetTitleTextAttributes(new UITextAttributes() { TextColor = textDeselectedColor }, UIControlState.Normal); //Font = UIFont.SystemFontOfSize(13, UIFontWeight.Regular)\n uis.SetTitleTextAttributes(new UITextAttributes() { TextColor = textSelectedColor, }, UIControlState.Selected); //Font = UIFont.SystemFontOfSize(13, UIFontWeight.Regular)\n\n // setDividerImage(tintColorImage, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)\n uis.SetDividerImage(imageDivider(tintColor), UIControlState.Normal, UIControlState.Normal, UIBarMetrics.Default);\n\n //layer.borderWidth = 1\n uis.Layer.BorderWidth = 1;\n\n //layer.borderColor = tintColor.cgColor\n uis.Layer.BorderColor = tintColor.CGColor;\n}\n",
2019-06-23T20:15:01
rmaddy :
As of iOS 13b3, there is now a selectedSegmentTintColor on UISegmentedControl.\n\nTo change the overall color of the segmented control use its backgroundColor.\n\nTo change the color of the selected segment use selectedSegmentTintColor.\n\nTo change the color/font of the unselected segment titles, use setTitleTextAttributes with a state of .normal/UIControlStateNormal.\n\nTo change the color/font of the selected segment titles, use setTitleTextAttributes with a state of .selected/UIControlStateSelected.\n\nIf you create a segmented control with images, if the images are created as template images, then the segmented control's tintColor will be used to color the images. But this has a problem. If you set the tintColor to the same color as selectedSegmentTintColor then the image won't be visible in the selected segment. If you set the tintColor to the same color as backgroundColor, then the images on the unselected segments won't be visible. This means your segmented control with images must use 3 different colors for everything to be visible. Or you can use non-template images and not set the tintColor.\n\nUnder iOS 12 or earlier, simply set the segmented control's tintColor or rely on the app's overall tint color.",
2019-07-03T16:24:43
Zain Anjum :
You can implement following method\n\nextension UISegmentedControl{\n func selectedSegmentTintColor(_ color: UIColor) {\n self.setTitleTextAttributes([.foregroundColor: color], for: .selected)\n }\n func unselectedSegmentTintColor(_ color: UIColor) {\n self.setTitleTextAttributes([.foregroundColor: color], for: .normal)\n }\n}\n\n\nUsage code\n\nsegmentControl.unselectedSegmentTintColor(.white)\nsegmentControl.selectedSegmentTintColor(.black)\n",
2019-09-24T10:58:31
Maulik Patel :
IOS 13 and Swift 5.0 (Xcode 11.0)Segment Control 100% Working\n\n\n\n\n\n if #available(iOS 13.0, *) {\n yoursegmentedControl.backgroundColor = UIColor.black\n yoursegmentedControl.layer.borderColor = UIColor.white.cgColor\n yoursegmentedControl.selectedSegmentTintColor = UIColor.white\n yoursegmentedControl.layer.borderWidth = 1\n\n let titleTextAttributes = [NSAttributedString.Key.foregroundColor: UIColor.white] \n yoursegmentedControl.setTitleTextAttributes(titleTextAttributes, for:.normal)\n\n let titleTextAttributes1 = [NSAttributedString.Key.foregroundColor: UIColor.black]\n yoursegmentedControl.setTitleTextAttributes(titleTextAttributes1, for:.selected)\n } else {\n // Fallback on earlier versions\n}\n",
2019-10-23T11:17:57
Adam :
While answers above are great, most of them get the color of text inside selected segment wrong. I've created UISegmentedControl subclass which you can use on iOS 13 and pre-iOS 13 devices and use the tintColor property as you would on pre iOS 13 devices.\n\n class LegacySegmentedControl: UISegmentedControl {\n private func stylize() {\n if #available(iOS 13.0, *) {\n selectedSegmentTintColor = tintColor\n let tintColorImage = UIImage(color: tintColor)\n setBackgroundImage(UIImage(color: backgroundColor ?? .clear), for: .normal, barMetrics: .default)\n setBackgroundImage(tintColorImage, for: .selected, barMetrics: .default)\n setBackgroundImage(UIImage(color: tintColor.withAlphaComponent(0.2)), for: .highlighted, barMetrics: .default)\n setBackgroundImage(tintColorImage, for: [.highlighted, .selected], barMetrics: .default)\n setTitleTextAttributes([.foregroundColor: tintColor!, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 13, weight: .regular)], for: .normal)\n\n setDividerImage(tintColorImage, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)\n layer.borderWidth = 1\n layer.borderColor = tintColor.cgColor\n\n// Detect underlying backgroundColor so the text color will be properly matched\n\n if let background = backgroundColor {\n self.setTitleTextAttributes([.foregroundColor: background, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 13, weight: .regular)], for: .selected)\n } else {\n func detectBackgroundColor(of view: UIView?) -> UIColor? {\n guard let view = view else {\n return nil\n }\n if let color = view.backgroundColor, color != .clear {\n return color\n }\n return detectBackgroundColor(of: view.superview)\n }\n let textColor = detectBackgroundColor(of: self) ?? .black\n\n self.setTitleTextAttributes([.foregroundColor: textColor, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 13, weight: .regular)], for: .selected)\n }\n }\n }\n\n override func tintColorDidChange() {\n super.tintColorDidChange()\n stylize()\n }\n }\n\n fileprivate extension UIImage {\n public convenience init?(color: UIColor, size: CGSize = CGSize(width: 1, height: 1)) {\n let rect = CGRect(origin: .zero, size: size)\n UIGraphicsBeginImageContextWithOptions(rect.size, false, 0.0)\n color.setFill()\n UIRectFill(rect)\n let image = UIGraphicsGetImageFromCurrentImageContext()\n UIGraphicsEndImageContext()\n\n guard let cgImage = image?.cgImage else { return nil }\n self.init(cgImage: cgImage)\n }\n }\n\n\nUsing tintColorDidChange method we ensure that the stylize method will be called every time the tintColor property changes on the segment view, or any of the underlying views, which is preferred behaviour on iOS.\n\nResult:\n",
2020-05-29T20:25:56
Jonathan. :
As of Xcode 11 beta 3\n\n\n There is now the selectedSegmentTintColor property on UISegmentedControl.\n\n\nSee rmaddy's answer\n\n\n\nTo get back iOS 12 appearance\n\nI wasn't able to tint the color of the selected segment, hopefully it will be fixed in an upcoming beta.\n\nSetting the background image of the selected state doesn't work without setting the background image of the normal state (which removes all the iOS 13 styling)\n\nBut I was able to get it back to the iOS 12 appearance (or near enough, I wasn't able to return the corner radius to its smaller size). \n\nIt's not ideal, but a bright white segmented control looks a bit out of place in our app.\n\n(Didn't realise UIImage(color:) was an extension method in our codebase. But the code to implement it is around the web)\n\nextension UISegmentedControl {\n /// Tint color doesn't have any effect on iOS 13.\n func ensureiOS12Style() {\n if #available(iOS 13, *) {\n let tintColorImage = UIImage(color: tintColor)\n // Must set the background image for normal to something (even clear) else the rest won't work\n setBackgroundImage(UIImage(color: backgroundColor ?? .clear), for: .normal, barMetrics: .default)\n setBackgroundImage(tintColorImage, for: .selected, barMetrics: .default)\n setBackgroundImage(UIImage(color: tintColor.withAlphaComponent(0.2)), for: .highlighted, barMetrics: .default)\n setBackgroundImage(tintColorImage, for: [.highlighted, .selected], barMetrics: .default)\n setTitleTextAttributes([.foregroundColor: tintColor, NSAttributedString.Key.font: UIFont.systemFont(ofSize: 13, weight: .regular)], for: .normal)\n setDividerImage(tintColorImage, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)\n layer.borderWidth = 1\n layer.borderColor = tintColor.cgColor\n }\n }\n}\n\n\n",
2019-06-05T10:34:41
user1248465 :
The SwiftUI Picker lacks some basic options. For people trying to customize a Picker with SegmentedPickerStyle() in SwiftUI in iOS 13 or 14, the simplest option is to use UISegmentedControl.appearance() to set the appearance globally. Here is an example function that could be called to set the appearance.\nfunc setUISegmentControlAppearance() {\n UISegmentedControl.appearance().selectedSegmentTintColor = .white\n UISegmentedControl.appearance().backgroundColor = UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.1)\n UISegmentedControl.appearance().setTitleTextAttributes([.foregroundColor: UIColor.black], for: .normal)\n UISegmentedControl.appearance().setTitleTextAttributes([.foregroundColor: UIColor.white], for: .selected)\n}\n\nHowever, globally setting appearance options with UISegmentedControl.appearance() is not great if you want multiple controls with different settings. Another option is to implement UIViewRepresentable for UISegmentedControl. Here is an example that sets the properties asked about in the the original question and sets .apportionsSegmentWidthsByContent = true as a bonus. Hopefully this will save you some time...\nstruct MyPicker: UIViewRepresentable {\n\n @Binding var selection: Int // The type of selection may vary depending on your use case\n var items: [Any]?\n\n class Coordinator: NSObject {\n let parent: MyPicker\n init(parent: MyPicker) {\n self.parent = parent\n }\n\n @objc func valueChanged(_ sender: UISegmentedControl) {\n self.parent.selection = Int(sender.selectedSegmentIndex)\n }\n }\n\n func makeCoordinator() -> MyPicker.Coordinator {\n Coordinator(parent: self)\n }\n\n func makeUIView(context: Context) -> UISegmentedControl {\n let picker = UISegmentedControl(items: self.items)\n\n // Any number of other UISegmentedControl settings can go here\n picker.selectedSegmentTintColor = .white\n picker.backgroundColor = UIColor(red: 1.0, green: 1.0, blue: 1.0, alpha: 0.1)\n picker.setTitleTextAttributes([.foregroundColor: UIColor.black], for: .normal)\n picker.setTitleTextAttributes([.foregroundColor: UIColor.white], for: .selected)\n picker.apportionsSegmentWidthsByContent = true\n\n // Make sure the coordinator updates the picker when the value changes\n picker.addTarget(context.coordinator, action: #selector(Coordinator.valueChanged(_:)), for: .valueChanged)\n\n return picker\n }\n\n func updateUIView(_ uiView: UISegmentedControl, context: Context) {\n uiView.selectedSegmentIndex = self.selection\n }\n }\n",
2021-03-14T16:30:41
Vignan Sankati :
Swift version of @Ilahi Charfeddine answer:\n\nif #available(iOS 13.0, *) {\n segmentedControl.setTitleTextAttributes([.foregroundColor: UIColor.white], for: .selected)\n segmentedControl.selectedSegmentTintColor = UIColor.blue\n} else {\n segmentedControl.tintColor = UIColor.blue\n}\n",
2019-09-24T17:56:52
CyberMew :
In iOS 13 and above, when I accessed the segmented control's subviews in viewDidLoad, it has 1 UIImageView. Once I inserted more segments, it increases respectively, so 3 segments means 3 UIImageView as the segmented control's subviews.\nInterestingly, by the time it reaches viewDidAppear, the segmented control's subviews became 3 UISegment (each contained a UISegmentLabel as its subview; this is your text) and 4 UIImageView as shown below:\n\nThose 3 UIImageView in viewDidLoad somehow become UISegment, and we don't want to touch them (but you can try to set their image or isHidden just to see how it affects the UI). Let's ignore these private classes.\nThose 4 UIImageView are actually 3 "normal" UIImageView (together with 1 UIImageView subview as the vertical separator) and 1 "selected" UIImageView (i.e. this is actually your selectedSegmentTintColor image, notice in the screenshot above there are no subviews under it).\nIn my case, I needed a white background, so I had to hide the greyish background images (see: https://medium.com/flawless-app-stories/ios-13-uisegmentedcontrol-3-important-changes-d3a94fdd6763). I also wanted to remove/hide the vertical separators between the segments.\nHence the simple solution in viewDidAppear, without needed to set divider image or background image (in my case), is to simply hide those first 3 UIImageView:\n// This method might be a bit 'risky' since we are not guaranteed of the internal sequence ordering, but so far it seems ok.\nif #available(iOS 13.0, *) {\n for i in 0...(segmentedControl.numberOfSegments - 1) {\n segmentedControl.subviews[i].isHidden = true\n }\n}\n\nor\n// This does not depend on the ordering sequence like the above, but this is also risky in the sense that if the UISegment becomes UIImageView one day, this will break.\nif #available(iOS 13.0, *) {\n for subview in segmentedControl.subviews {\n if String(describing: subview).contains("UIImageView"),\n subview.subviews.count > 0 {\n subview.isHidden = true\n }\n }\n}\n\nPick your poison...",
2021-11-08T10:17:09
Colin Blake :
I've tried the workaround and it works great for me. Here's the Objective-C version:\n\n@interface UISegmentedControl (Common)\n- (void)ensureiOS12Style;\n@end\n\n\n@implementation UISegmentedControl (Common)\n- (void)ensureiOS12Style {\n // UISegmentedControl has changed in iOS 13 and setting the tint\n // color now has no effect.\n if (@available(iOS 13, *)) {\n UIColor *tintColor = [self tintColor];\n UIImage *tintColorImage = [self imageWithColor:tintColor];\n // Must set the background image for normal to something (even clear) else the rest won't work\n [self setBackgroundImage:[self imageWithColor:self.backgroundColor ? self.backgroundColor : [UIColor clearColor]] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];\n [self setBackgroundImage:tintColorImage forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];\n [self setBackgroundImage:[self imageWithColor:[tintColor colorWithAlphaComponent:0.2]] forState:UIControlStateHighlighted barMetrics:UIBarMetricsDefault];\n [self setBackgroundImage:tintColorImage forState:UIControlStateSelected|UIControlStateSelected barMetrics:UIBarMetricsDefault];\n [self setTitleTextAttributes:@{NSForegroundColorAttributeName: tintColor, NSFontAttributeName: [UIFont systemFontOfSize:13]} forState:UIControlStateNormal];\n [self setDividerImage:tintColorImage forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];\n self.layer.borderWidth = 1;\n self.layer.borderColor = [tintColor CGColor];\n }\n}\n\n- (UIImage *)imageWithColor: (UIColor *)color {\n CGRect rect = CGRectMake(0.0f, 0.0f, 1.0f, 1.0f);\n UIGraphicsBeginImageContext(rect.size);\n CGContextRef context = UIGraphicsGetCurrentContext();\n CGContextSetFillColorWithColor(context, [color CGColor]);\n CGContextFillRect(context, rect);\n UIImage *theImage = UIGraphicsGetImageFromCurrentImageContext();\n UIGraphicsEndImageContext();\n return theImage;\n}\n@end\n",
2019-06-05T17:41:54
lukszar :
Gray background in iOS 13+ solution\nSince iOS 13 there is introduced updated UISegmentedControl. Unfortunately there is no simple way to setup background to white, as framework is adding semitransparent gray background. In the result, background of UISegmentedControl remains gray. There is workaround for it (ugly, but working):\nfunc fixBackgroundColorWorkaround() {\n DispatchQueue.main.asyncAfter(deadline: .now() + 0.1) {\n for i in 0 ... (self.numberOfSegments-1) {\n let bg = self.subviews[i]\n bg.isHidden = true\n }\n }\n}\n",
2022-10-04T12:43:39
Cœur :
As of Xcode 11 beta 3\n\n\n There is now the selectedSegmentTintColor property on UISegmentedControl.\n\n\nThank you @rmaddy!\n\n\n\nOriginal answer, for Xcode 11 beta and beta 2\n\n\n Is there a proper solution, using public APIs, that doesn't require digging into the private subview structure?\n\n\nWith Xcode 11.0 beta, it seems to be a challenge to do it by-the-rules, because it basically requires to redraw all the background images for every states by yourself, with round corners, transparency and resizableImage(withCapInsets:). For instance, you would need to generate a colored image similar to:\n\n\nSo for now, the let's-dig-into-the-subviews way seems much easier:\n\nclass TintedSegmentedControl: UISegmentedControl {\n\n override func layoutSubviews() {\n super.layoutSubviews()\n\n if #available(iOS 13.0, *) {\n for subview in subviews {\n if let selectedImageView = subview.subviews.last(where: { $0 is UIImageView }) as? UIImageView,\n let image = selectedImageView.image {\n selectedImageView.image = image.withRenderingMode(.alwaysTemplate)\n break\n }\n }\n }\n }\n}\n\n\nThis solution will correctly apply the tint color to the selection, as in:\n",
2019-06-16T16:54:01
Kedar Sukerkar :
iOS 12+\nI struggled a lot for background color. Setting .clear color as background color always added default grey color. Here is how i fixed\nself.yourSegmentControl.backgroundColor = .clear //Any Color of your choice\n\nself.yourSegmentControl.setBackgroundImage(UIImage(), for: .normal, barMetrics: .default) //This does the magic\n\nAdditionally for Divider Color\nself.yourSegmentControl.setDividerImage(UIImage(), forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default) // This will remove the divider image.\n",
2021-09-23T21:51:15
Jigar :
iOS13 UISegmentController \n\nhow to use:\n\nsegment.setOldLayout(tintColor: .green)\n\nextension UISegmentedControl\n{\n func setOldLayout(tintColor: UIColor)\n {\n if #available(iOS 13, *)\n {\n let bg = UIImage(color: .clear, size: CGSize(width: 1, height: 32))\n let devider = UIImage(color: tintColor, size: CGSize(width: 1, height: 32))\n\n //set background images\n self.setBackgroundImage(bg, for: .normal, barMetrics: .default)\n self.setBackgroundImage(devider, for: .selected, barMetrics: .default)\n\n //set divider color\n self.setDividerImage(devider, forLeftSegmentState: .normal, rightSegmentState: .normal, barMetrics: .default)\n\n //set border\n self.layer.borderWidth = 1\n self.layer.borderColor = tintColor.cgColor\n\n //set label color\n self.setTitleTextAttributes([.foregroundColor: tintColor], for: .normal)\n self.setTitleTextAttributes([.foregroundColor: UIColor.white], for: .selected)\n }\n else\n {\n self.tintColor = tintColor\n }\n }\n}\nextension UIImage {\n convenience init(color: UIColor, size: CGSize) {\n UIGraphicsBeginImageContextWithOptions(size, false, 1)\n color.set()\n let ctx = UIGraphicsGetCurrentContext()!\n ctx.fill(CGRect(origin: .zero, size: size))\n let image = UIGraphicsGetImageFromCurrentImageContext()!\n UIGraphicsEndImageContext()\n\n self.init(data: image.pngData()!)!\n }\n}\n",
2019-10-10T09:22:57
Ilahi Charfeddine :
if (@available(iOS 13.0, *)) {\n\n [self.segmentedControl setTitleTextAttributes:@{NSForegroundColorAttributeName: [UIColor whiteColor], NSFontAttributeName: [UIFont systemFontOfSize:13]} forState:UIControlStateSelected];\n [self.segmentedControl setSelectedSegmentTintColor:[UIColor blueColor]];\n\n} else {\n\n[self.segmentedControl setTintColor:[UIColor blueColor]];}\n",
2019-08-19T10:50:52