I want to remove border of UISegmentController. If it is possible. otherwise change it in the custom border color.
Asked
Active
Viewed 6,493 times
7
-
Do you want to give custom border to it ?? – Anil solanki Dec 17 '15 at 12:47
-
if u remove border then it will show only text? – vaibby Dec 17 '15 at 12:48
-
http://www.code4app.net/ios/Customizable-control-based-on-UISwitch-and-UISegmentedControl-written-in-Objecti/54460e6be24741786a848c02 – vaibby Dec 17 '15 at 12:49
-
do you want to remove border or want it to customize ?? – Anil solanki Dec 17 '15 at 12:50
-
Yes, I want to remove border. If it is possible. – Abdul Hameed Dec 17 '15 at 12:50
-
@Anilsolanki, I want to add a custom border in uisegmentcontroller. – Abdul Hameed Dec 17 '15 at 12:51
-
if you just want to change the color then use tint color to do it . . . .if you want to give border round then use segmentcontroller.layer.cornerRadius and provide border width with layer property of segment – Anil solanki Dec 17 '15 at 12:52
-
if you want me to post code then let me know – Anil solanki Dec 17 '15 at 12:53
-
@Anilsolanki, Thanks for support, Actually "njuri" code will work for me. – Abdul Hameed Dec 17 '15 at 13:04
2 Answers
5
Update
Case 1 - Customizing borderColor of each element in segmentedControl
Code
extension UIView {
///Add border color with corners
func addBorderWithColor(color: UIColor, roundingCorners: UIRectCorner) {
self.layer.borderWidth = 1
self.layer.borderColor = color.CGColor
self.addRoundingCorners(roundingCorners)
}
///Use corner radius depending on UIRectCorner
private func addRoundingCorners(roundingCorners: UIRectCorner) {
let path = UIBezierPath(roundedRect:self.bounds, byRoundingCorners:roundingCorners, cornerRadii: CGSizeMake(4, 4))
let maskLayer = CAShapeLayer()
maskLayer.path = path.CGPath
self.layer.mask = maskLayer
}
}
let segmentedControl = UISegmentedControl(items: ["Red", "Green", "Blue"])
segmentedControl.subviews[0].addBorderWithColor(UIColor.blueColor(), roundingCorners: [.TopRight, .BottomRight])
segmentedControl.subviews[1].addBorderWithColor(UIColor.greenColor(), roundingCorners: [])
segmentedControl.subviews[2].addBorderWithColor(UIColor.redColor(), roundingCorners: [.TopLeft, .BottomLeft])
segmentedControl.setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.blackColor()], forState: UIControlState.Normal)
Playground
Case 2 - Get rid of borders
Code
let segmentedControl = UISegmentedControl(items: ["Red", "Green", "Blue"])
//Change Text Attributes (Changing textColor to black)
//**Be sure to manage all the UIControlState for these attributes if you need to customize this for other states
segmentedControl.setTitleTextAttributes([NSForegroundColorAttributeName: UIColor.blackColor()], forState: UIControlState.Normal)
//Change tintColor to clear, in order to set border invisible
segmentedControl.tintColor = UIColor.clearColor()
Playground
Original Answer
The answer is NO
You can't remove the border of the UISegmentedControl
You can create a custom control by using UIButton
s to achieve what you are looking for.
In the state of UISegmentedControl
, you can remove the dividers between items in the UISegmentedControl
, or you can change the tintColor (borderColor)
-
-
that is actually totally __not__ true at all, as the segmented control's appearance fully customisable via the `UIAppearanceProtocol` – including removing the outer edges. – holex Dec 17 '15 at 15:41
-
@holex No you can't "remove" it. You can customize it by setting tintColor to clearColor, which will set it to invisible along with text, and then setting textAttributes you can change the textColor of items in the segmentedControl. If this is what OP means, then I will edit the asnwer. :) – E-Riddie Dec 17 '15 at 16:12
-
@EridB, I'm not sure what you are talking about, the OP's question was how to remove the border, not about requesting explanations about _how you cannot do so_; the task can be completed via `UIAppearanceProtocol` – if you want to update your answer, please do it and show him how that works actually via that, but the OP has not raised this question because he wanted to get answer from whom _don't know_ how to commit that. – holex Dec 17 '15 at 16:21
-
@holex you are right on this context as it does the trick but however using `UIApperanceProtocol` requires `UI_APPEARANCE_SELECTOR` option, which on earlier versions of iOS has been a popular issue. So before saying `UIAppearanceProtocol` conformance you need to check the option. I always tend to follow up with public properties and methods of the Class, rather than doing customizations which can lead to bugs or unexpected behaviors. Anyway thanks for your points, I have edited the answer to match with the OP's intention :) – E-Riddie Dec 17 '15 at 17:28
-
@EridB, `UIAppearanceProtocol` is supported since iOS5, but at least you have updated your answer. – holex Dec 17 '15 at 17:44
-
@holex If you take a good look at my answer I did not mention anywhere for a lack of support for `UIAppearanceProtocol`. I was meaning that the public methods and properties of the class are the official support from Apple for iOS SDK and for UIAppearance too. Using the scripts [here](https://gist.github.com/mattt/5135521), you can see what I am pointing out. P.S I am broadcasting what I have read, if you prove me wrong, I welcome you :) – E-Riddie Dec 17 '15 at 18:02
-
@EridB, you have been stuck at here a little bit, you are still _wrong_ about making such statement which indicates the border cannot be removed at all; maybe you don't understand the weight of your words, but what you are saying is _wrong_. the correct statement is: __we, developers, are granted to remove the border around a `UISegmentedControl`__, maybe the way how the procedure can be done does not match your expectations or even you personally hate the way how it can be done, but your personal feelings won't change the pure fact which is __we. can. remove. it.__ – holex Dec 17 '15 at 18:47
-
@holex I just proved that I can **make** it, you have the update, but it is not on recommended terms as it is not supported specifically for `UISegmentedControl`, it is not just my personal taste. It is pointless to mention again that you are confusing the term remove with invisible. Anyway I was responding to you on behalf of "lack of support" for `UIAppearanceProtocol`, but you got yourself in. You keep talking about my personal thoughts and it is weird as I am just citing words from WWDC. – E-Riddie Dec 17 '15 at 19:31
3
To change color and text of segmented control try that:
Objective-C:
NSArray *array = [segmentedControl subviews];
[[array objectAtIndex:2] setTintColor:[UIColor redColor]];
[[array objectAtIndex:1] setTintColor:[UIColor greenColor]];
[[array objectAtIndex:0] setTintColor:[UIColor blueColor]];
Swift:
let array = segmentedControl.subviews
array[2].tintColor = UIColor.redColor()
array[1].tintColor = UIColor.greenColor()
array[0].tintColor = UIColor.blueColor()
Note that subviews
are in reverse order relatively to user interface.
You can customize border in the same way:
let array = segmentedControl.subviews
array[0].layer.borderWidth = 5 // change thickness of border
array[0].layer.cornerRadius = 4 //change corner radius

Juri Noga
- 4,363
- 7
- 38
- 51
-
1on last line, you have made a typo. `objectAtIndex:1` should be `objectAtIndex:2` – NSNoob Dec 17 '15 at 12:54
-
Thank You "njuri". You have given the best solution. thanks again – Abdul Hameed Dec 17 '15 at 13:05