Why does one of the segments appear disabled on segmented control? - ios

I have a segmented control with custom images for segments. I have created it as follows
[repaymetSegmentedControl setBackgroundImage:[UIImage imageNamed:#"-SingleJointOffState"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setBackgroundImage:[UIImage imageNamed:#"-SingleJointOnState"] forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"on_div"] forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"off_div"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
CGRect frameSeg= repaymetSegmentedControl.frame;
[repaymetSegmentedControl setFrame:CGRectMake(frameSeg.origin.x, frameSeg.origin.y-5, frameSeg.size.width, frameSeg.size.height + 15)];
Here when I run the app I am selecting one of the segments based on preferences. It appears as shown in image. Not sure what's wrong with it.
The images being used are as follows

Using this code in viewDidLoad gave me the result that I think you are looking for (I renamed your images to make things a bit clearer for me).
[repaymetSegmentedControl setBackgroundImage:[UIImage imageNamed:#"whiteBG"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControll setBackgroundImage:[UIImage imageNamed:#"pinkBG"] forState:UIControlStateHighlighted barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setBackgroundImage:[UIImage imageNamed:#"pinkBG"] forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setTitleTextAttributes:#{NSForegroundColorAttributeName:[UIColor blackColor]} forState:UIControlStateNormal ];
[repaymetSegmentedControll setTitleTextAttributes:#{NSForegroundColorAttributeName:[UIColor whiteColor]} forState:UIControlStateHighlighted ];
[repaymetSegmentedControl setTitleTextAttributes:#{NSForegroundColorAttributeName:[UIColor whiteColor]} forState:UIControlStateSelected ];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"pinkDivider"] forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"pinkDivider"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"pinkDivider"] forLeftSegmentState:UIControlStateHighlighted rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"pinkDivider"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateHighlighted barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"whiteDivider"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
Using this code, the result is like this . Attached Image:

My guess is that the text color for selected segments is set to black and white for the other. So in your screenshot the middle segment is selected.
The problem could be somewhere else:
[repaymetSegmentedControl setBackgroundImage:[UIImage imageNamed:#"-SingleJointOffState"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setBackgroundImage:[UIImage imageNamed:#"-SingleJointOnState"] forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
It seems weird to have image names starting with -.
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"on_div"] forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[repaymetSegmentedControl setDividerImage:[UIImage imageNamed:#"off_div"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
You seem to be missing right selected/left normal option.
Also as your design seems pretty flat, I'm not sure you need any of those.
Finally could you attach all the images to the question?

Your segment divider image should be the same height as the background images.

Related

UISegmentedControll appearance no border sharp edges

I'm therribly upset. I've spent lot of time and no suitable result.
I want to redesign (AS APPEARANCE) this
to this
Or in programmatic words... from this:
+(void)configureSegmentedControls {
[[UISegmentedControl appearance] setTintColor:[COLOR_PROXY highlightColor]];
[[UISegmentedControl appearance] setBackgroundColor:[COLOR_PROXY darkBackgroundColor]];
[[UISegmentedControl appearance] setDividerImage:[UIImage new] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
NSDictionary *selectedAttributes = #{NSFontAttributeName:[FONT_PROXY fontNormalOfSizeSmall],
NSForegroundColorAttributeName:[UIColor whiteColor]};
[[UISegmentedControl appearance] setTitleTextAttributes:selectedAttributes
forState:UIControlStateSelected];
NSDictionary *normalAttributes = #{NSFontAttributeName:[FONT_PROXY fontNormalOfSizeSmall],
NSForegroundColorAttributeName:[COLOR_PROXY highlightColor]};
[UISegmentedControl appearance] setTitleTextAttributes:normalAttributes
forState:UIControlStateNormal];
NSDictionary *disabledAttributes = #{NSFontAttributeName:[FONT_PROXY fontNormalOfSizeSmall],
NSForegroundColorAttributeName:[COLOR_PROXY lightGrayTextColor]};
[[UISegmentedControl appearance] setTitleTextAttributes:disabledAttributes forState:UIControlStateDisabled];
}
to this:
???
You can achieve this appearance like this:
self.segmentedControl.layer.cornerRadius = 0;
self.segmentedControl.layer.borderColor = [UIColor whiteColor].CGColor;
self.segmentedControl.layer.borderWidth = 1.5;
Replace [UIColor whiteColor] with the background color of the segmented control's superview.
You can set the width of the segments (using setWidth:forSegmentAtIndex:) so you can easily make the left and right end segments larger (say 10px larger) than the others and then you can crop off 10px from either end and have square corners. You don't have to make it larger than the screen width, instead put it inside a UIView and use it to crop the ends.
On the other hand just could just make your own segmented control using a set of custom UIButtons inside a UIControl.
segmentControl.layer.borderColor = [UIColor clearColor].CGColor;
segmentControl.layer.borderWidth = 1.5;
segmentControl.tintColor = [UIColor clearColor];
if background color is white then
segmentControl.layer.borderColor = [UIColor whiteColor].CGColor;
segmentControl.layer.borderWidth = 1.5;
segmentControl.tintColor = [UIColor whiteColor];
using images this may be achieved.
[segmented setImage:nil forSegmentAtIndex:0];
[segmented setImage:nil forSegmentAtIndex:1];
[segmented setTintColor:[UIColor darkGrayColor]];
[segmented setTitle:#"1" forSegmentAtIndex:0];
[segmented setTitle:#"2" forSegmentAtIndex:1];
[segmented setDividerImage:[self imageFromColor2:[UIColor darkGrayColor] withFrame:CGRectMake(0, 0, 1, segmented.frame.size.height)]
forLeftSegmentState:(UIControlStateNormal | UIControlStateSelected | UIControlStateHighlighted)
rightSegmentState:(UIControlStateNormal | UIControlStateSelected | UIControlStateHighlighted)
barMetrics:UIBarMetricsDefault];
[segmented setBackgroundImage:[self imageFromColor2:[UIColor lightGrayColor] withFrame:CGRectMake(0, 0, segmented.bounds.size.width/2.0+1, segmented.frame.size.height)]
forState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
to create color images:
- (UIImage *)imageFromColor2:(UIColor *)color withFrame:(CGRect)frame{
CGRect rect = frame;
UIGraphicsBeginImageContext(rect.size);
CGContextRef context = UIGraphicsGetCurrentContext();
CGContextSetFillColorWithColor(context, [color CGColor]);
CGContextFillRect(context, rect);
UIImage *image = UIGraphicsGetImageFromCurrentImageContext();
UIGraphicsEndImageContext();
return image;
}
and as a result i had this segmented control. you can play with the colors and get what you want.
only solution (for appearance) I've found is using images only...
UIImage *activeImage = [[UIImage imageNamed:#"btn_bg_active"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
UIImage *inactiveImage = [[UIImage imageNamed:#"btn_bg_inactive"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
[[UISegmentedControl appearance] setBackgroundImage:inactiveImage forState:UIControlStateDisabled barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setBackgroundImage:inactiveImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setBackgroundImage:activeImage forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setBackgroundImage:inactiveImage forState:UIControlStateHighlighted barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:[UIImage new] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:[UIImage new] forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:[UIImage new] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];

UISegmentedControl image highlighting bug in iOS?

I have an application in which I wanted to customize the segment control using buttons like in Instagram. I had done like this
[[UISegmentedControl appearanceWhenContainedIn:[UISearchBar class], nil] setSegmentedControlStyle:UISegmentedControlStyleBar];
[[UISegmentedControl appearanceWhenContainedIn:[UISearchBar class], nil] setTintColor:[UIColor clearColor]];
[[UISegmentedControl appearance] setBackgroundImage:[UIImage imageNamed:#"back_bg.png"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setBackgroundImage:[UIImage imageNamed:#"white_btn.png"]
forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:[UIImage imageNamed:#"segcontrol_uns-sel.png"]
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateSelected
barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:[UIImage imageNamed:#"segcontrol_sel-uns.png"]
forLeftSegmentState:UIControlStateSelected
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
But when I am selecting the button it is highlighting except the division image. So its looking wired. Can anybody help me on this?
Try with this:
UIImage *defaultBgImage,*selectedBgImage,*segcontrol_uns,*segcontrol_sel;
if ([UIImage instancesRespondToSelector:#selector(imageWithRenderingMode:)])
{
defaultBgImage = [[UIImage imageNamed:#"back_bg.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
selectedBgImage = [[UIImage imageNamed:#"white_btn.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
segcontrol_uns = [[UIImage imageNamed:#"segcontrol_uns-sel.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
segcontrol_sel = [[UIImage imageNamed:#"segcontrol_sel-uns.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal];
}
else
{
defaultBgImage = [UIImage imageNamed:#"back_bg.png"];
selectedBgImage = [UIImage imageNamed:#"white_btn.png"];
segcontrol_uns = [UIImage imageNamed:#"segcontrol_uns-sel.png"];
segcontrol_sel = [UIImage imageNamed:#"segcontrol_sel-uns.png"];
}
[[UISegmentedControl appearance] setBackgroundImage:defaultBgImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setBackgroundImage:selectedBgImage
forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:segcontrol_uns forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateSelected
barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:segcontrol_sel forLeftSegmentState: UIControlStateSelected rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
You need to do "setBackgroundImage" for four different states.
UIControlStateNormal
UIControlStateSelected
UIControlStateHighlighted
UIControlStateSelected | UIControlStateHighlighted (When pressing already selected segment)
And do "setDividerImage" for seven different states.
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateSelected
forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal
forLeftSegmentState:UIControlStateHighlighted rightSegmentState:UIControlStateSelected
forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateHighlighted
forLeftSegmentState:UIControlStateSelected | UIControlStateHighlighted rightSegmentState:UIControlStateNormal
forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateSelected | UIControlStateHighlighted
forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal
You need the following images for three segments
1. segment bg selected
2. segment bg unselected
3. segment middle, left selected, right unselected
4. segment middle, left unselected, right selected
5. segment middle, both left & right selected
6. segment middle, both left & right unselected
I had written this code for a 3 Segment control. However you can tweak it as per your needs.
/* Unselected background */
UIImage *unselectedBackgroundImage = [[UIImage imageNamed:#"segment_background_unselected"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];
[[UISegmentedControl appearance] setBackgroundImage:unselectedBackgroundImage
forState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
/* Selected background */
UIImage *selectedBackgroundImage = [[UIImage imageNamed:#"segment_background_selected"] resizableImageWithCapInsets:UIEdgeInsetsMake(10, 10, 10, 10)];
[[UISegmentedControl appearance] setBackgroundImage:selectedBackgroundImage
forState:UIControlStateSelected
barMetrics:UIBarMetricsDefault];
/* Image between two unselected segments */
UIImage *bothUnselectedImage = [[UIImage imageNamed:#"segment_middle_unselected"] resizableImageWithCapInsets:UIEdgeInsetsMake(15, 0, 15, 0)];
[[UISegmentedControl appearance] setDividerImage:bothUnselectedImage
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
/* Image between segment selected on the left and unselected on the right */
UIImage *leftSelectedImage = [[UIImage imageNamed:#"segment_middle_left_selected"] resizableImageWithCapInsets:UIEdgeInsetsMake(15, 0, 15, 0)];
[[UISegmentedControl appearance] setDividerImage:leftSelectedImage
forLeftSegmentState:UIControlStateSelected
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
/* Image between segment selected on the right and unselected on the left */
UIImage *rightSelectedImage = [[UIImage imageNamed:#"segment_middle_right_selected"] resizableImageWithCapInsets:UIEdgeInsetsMake(15, 0, 15, 0)];
[[UISegmentedControl appearance] setDividerImage:rightSelectedImage
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateSelected
barMetrics:UIBarMetricsDefault];
Following code fixed it for me:
[[UISegmentedControl appearanceWhenContainedIn:[InboxViewController class], nil] setBackgroundImage:[UIImage imageNamed:#"btn-gray"] forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearanceWhenContainedIn:[InboxViewController class], nil] setBackgroundImage:[UIImage imageNamed:#"btn-gray"] forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearanceWhenContainedIn:[InboxViewController class], nil] setBackgroundImage:[UIImage imageNamed:#"btn-gray"] forState:UIControlStateSelected | UIControlStateHighlighted barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearanceWhenContainedIn:[InboxViewController class], nil] setBackgroundImage:[UIImage imageNamed:#"btn-gray"] forState:UIControlStateHighlighted barMetrics:UIBarMetricsDefault];

Segment control white line between segmentAtIndex and dividerImage

My question is the following. Actually, I use segment control with images instead of text.
So, for images I write this code:
[self.segmentedControl setDividerImage:[UIImage imageNamed:#"DividerImageLeft.png"] forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[self.segmentedControl setDividerImage:[UIImage imageNamed:#"DividerImageRight.png"] forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[self.segmentedControl setImage:[­[UIImage imageNamed:#"segment_left.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] forSegmentAtIndex:1];
[self.segmentedControl setImage:[­[UIImage imageNamed:#"segment_right.png"] imageWithRenderingMode:UIImageRenderingModeAlwaysOriginal] forSegmentAtIndex:0];
As the result, there is a white line between divider and segments (It is only for iOS 7.0+, because it works fine without divider image on iOS 6.1.3 and lower). How can I remove it?
https://www.evernote.com/shard/s305/sh/cda3f2b3-74e6-4268-9d0d-278be9f9e95f/d4110a56f9fe38311cfbe7001d6f9825

UISegmentedControl wrong dividerImage

I am custumizing all segmented controls in my app with the following code.Initially I set the selected segment to index 2.
Everything works perfect in IOS 6.While I was testing the app on IOS5, I realised that the initial setting of segmented control had a bug.The separation image between selected and unselected state is not set right.Due to that it looks like this.
If i change the selected segments by tapping the segmentedcontrol behaves normal.It is very weird.What elsse shall i do to prevent this strange behaviour?
UISegmentedControl *localSegmentedControl = [[UISegmentedControl alloc] init];
if ([localSegmentedControl respondsToSelector:#selector(setBackgroundImage:forState:barMetrics:)]) {
UIImage *segmentUnselectedSelectedDivider = [UIImage imageNamed:#"segmentedControlSeperatorNS.png"];
UIImage *segmentSelectedUnselectedDivider = [UIImage imageNamed:#"segmentedControlSeperatorSN.png"];
UIImage *segmentUnselectedUnselectedDivider = [UIImage imageNamed:#"segmentedControlSeperatorNN.png"];
UIImage *segmentUnselected = [[UIImage imageNamed:#"barButtonPlain.png"] stretchableImageWithLeftCapWidth:7 topCapHeight:0];
UIImage *segmentSelected = [[UIImage imageNamed:#"doneButton.png"] stretchableImageWithLeftCapWidth:7 topCapHeight:0];
[[UISegmentedControl appearance] setBackgroundImage:segmentUnselected
forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setBackgroundImage:segmentSelected
forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:segmentUnselectedUnselectedDivider
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:segmentSelectedUnselectedDivider
forLeftSegmentState:UIControlStateSelected
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
[[UISegmentedControl appearance] setDividerImage:segmentUnselectedSelectedDivider
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateSelected
barMetrics:UIBarMetricsDefault];
}
After trying all relevant approached explained in Customizing UISegmentedControl in iOS 5
i figured out that the problem is related with the width of the separation line.The tutorial about segmented control customisation in http://www.raywenderlich.com/4344/user-interface-customization-in-ios-5 assumes that the separation images are wider than 2px (in Retina).
I made them exactly 2px wide and the problem is resolved.
I think it is a known bug.
It is the same here with a workaround, may work for you.
Customizing UISegmentedControl in iOS 5
When i use segment control I was very tired the same problem. I solved that code
UIImage *segmentSelected =
[[UIImage imageNamed:#"ikisiSecildiKirmizi.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 15, 5, 15)];
UIImage *segmentUnselected =
[[UIImage imageNamed:#"ikisiSecilmediGri.png"]
resizableImageWithCapInsets:UIEdgeInsetsMake(0, 15, 5, 15)];
UIImage *segmentSelectedUnselected =
[[UIImage imageNamed:#"solSecili.png"]resizableImageWithCapInsets:UIEdgeInsetsMake(0, 15, 5, 15)];
UIImage *segUnselectedSelected =
[[UIImage imageNamed:#"sagSecili.png"]resizableImageWithCapInsets:UIEdgeInsetsMake(0, 15, 5, 15)];
UIImage *segmentUnselectedUnselected =
[[UIImage imageNamed:#"ikisideSecilmemis.png"]resizableImageWithCapInsets:UIEdgeInsetsMake(0, 15, 5, 15)];
[fiyatSaat setBackgroundImage:segmentUnselected
forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[fiyatSaat setBackgroundImage:segmentSelected
forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[fiyatSaat setDividerImage:segmentUnselectedUnselected
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
[fiyatSaat setDividerImage:segmentSelectedUnselected
forLeftSegmentState:UIControlStateSelected
rightSegmentState:UIControlStateNormal
barMetrics:UIBarMetricsDefault];
[fiyatSaat setDividerImage:segUnselectedSelected
forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateSelected
barMetrics:UIBarMetricsDefault];
NSDictionary *attributes = [NSDictionary dictionaryWithObject:[UIColor blackColor]
forKey:UITextAttributeTextColor];
[fiyatSaat setTitleTextAttributes:attributes
forState:UIControlStateNormal];
NSDictionary *attributes2 = [NSDictionary dictionaryWithObject:[UIColor whiteColor]
forKey:UITextAttributeTextColor];
[fiyatSaat setTitleTextAttributes:attributes2
forState:UIControlStateHighlighted];

Multiple uisegmentedcontrol in 1 view not working

I have a view with 2 uisegmentedcontrols, one along the bottom and one in the nav bar. The bottom one is working fine, the one in the nav bar appears, but does not pick up any touch events. Code for the bottom segment (working) is:
footerSegment = [[UISegmentedControl alloc] initWithItems:[NSArray arrayWithObjects:#"1", #"2", nil]];
[footerSegment setFrame:CGRectMake(5, 6, 310, 30)];
[footerSegment setSegmentedControlStyle:UISegmentedControlStyleBar];
footerSegment.selectedSegmentIndex = 0;
//segmentFiltering.tintColor = [UIColor colorWithWhite:80.0/255.0 alpha:1.0];
[footerSegment addTarget:self action:#selector(segmentAction:) forControlEvents:UIControlEventValueChanged];
[footerSegment setTag:0];
[footerSegment setBackgroundColor:[UIColor clearColor]];
UIImage *segSelected = [[UIImage imageNamed:#"segment_sel.png"] stretchableImageWithLeftCapWidth:5.0 topCapHeight:0];
UIImage* menuRightImage = [[UIImage imageNamed:#"button.png"] stretchableImageWithLeftCapWidth:5.0 topCapHeight:0.0];
[footerSegment setBackgroundImage:menuRightImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[footerSegment setBackgroundImage:segSelected
forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
UIImage *segmentDividerImg = [[UIImage imageNamed:#"div.png"] stretchableImageWithLeftCapWidth:0 topCapHeight:0];
// Image between two unselected segments.
[footerSegment setDividerImage:segmentDividerImg forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
// Image between segment selected on the left and unselected on the right.
[footerSegment setDividerImage:segmentDividerImg forLeftSegmentState:UIControlStateSelected
rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
// Image between segment selected on the right and unselected on the right.
[footerSegment setDividerImage:segmentDividerImg forLeftSegmentState:UIControlStateNormal
rightSegmentState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[footerToolBar addSubview:footerSegment];
Code for the navbar one is below (visable but doesn't work):
headSegment = [[UISegmentedControl alloc]
initWithItems:[NSArray arrayWithObjects:#"A", #"B", nil]];
[headSegment setFrame:CGRectMake(50, 7, 200, 29)];
[headSegment setSegmentedControlStyle:UISegmentedControlStyleBar];
headSegment.selectedSegmentIndex = 0;
[headSegment addTarget:self action:#selector(segmentAction:) forControlEvents:UIControlEventValueChanged];
[headSegment setBackgroundColor:[UIColor clearColor]];
[headSegment setBackgroundImage:menuRightImage forState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[headSegment setBackgroundImage:segSelected forState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[headSegment setDividerImage:segmentDividerImg forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[headSegment setDividerImage:segmentDividerImg forLeftSegmentState:UIControlStateSelected rightSegmentState:UIControlStateNormal barMetrics:UIBarMetricsDefault];
[headSegment setDividerImage:segmentDividerImg forLeftSegmentState:UIControlStateNormal rightSegmentState:UIControlStateSelected barMetrics:UIBarMetricsDefault];
[headSegment setTag:1];
[self.navigationController.navigationBar addSubview:headSegment];
Code for the action:
-(void)segmentAction:(UISegmentedControl*)sender
{
if(sender.tag == 0){
NSLog(#"Selected index: %d", sender.selectedSegmentIndex);
}
else{
if (sender.selectedSegmentIndex = 1) {
NSLog(#"Selected HEAD index: %d", sender.selectedSegmentIndex);
}
}
[self.navigationController.navigationBar addSubview:headSegment];
That is not how you add things to a navigation bar. You must work by way of your navigation controller's navigationItem. You can make the segmented control its titleView or you can wrap it in a bar button item and make that one of the right or left buttons.

Resources