CODEWITHSUNDEEP
iosios7uiprogressview
matt
matt

Reputation: 535306

increase UIProgressView height when using it as titleView in navigation bar

I'm using a progress view (UIProgressView) as the titleView in a navigation item, so that it appears in my navigation bar. No matter what I do, it appears very narrow in iOS 7.1:

enter image description here

I hate this version of the progress view. How can make it fatter / thicker / taller? I've tried everything suggested here and here. I've tried changing the frame, adding a transform, using a custom subclass, adding constraints (these just cause a crash). And the trick I used to use, adding a progressImage and trackImage, is broken in iOS 7.1!

Here's my code (the whole thing is happening in code; I have no nibs or storyboards in this project):

UIProgressView* prog = [[UIProgressView alloc] init];
self.prog = prog;
self.prog.progressTintColor = [UIColor colorWithRed:1.000 green:0.869 blue:0.275 alpha:1.000];
self.prog.trackTintColor = [UIColor darkGrayColor];
self.navigationItem.titleView = prog;

Upvotes: 3

Views: 3517

Answers (1)

matt
matt

Reputation: 535306

I solved this in a peculiarly tricky way. We already know that providing a height constraint should work. But simply doing that crashed my app. In the end I had a brainstorm. I used another view as my titleView, and put the progress view inside of that. Now I was able to apply appropriate constraints:

UIProgressView* prog = [[UIProgressView alloc] init];
self.prog = prog;
self.prog.progressTintColor = [UIColor colorWithRed:1.000 green:0.869 blue:0.275 alpha:1.000];
self.prog.trackTintColor = [UIColor darkGrayColor];
self.prog.translatesAutoresizingMaskIntoConstraints = NO;
CGFloat w = 150;
CGFloat h = 10;
[self.prog addConstraint:[NSLayoutConstraint constraintWithItem:self.prog attribute:NSLayoutAttributeWidth relatedBy:0 toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:w]];
[self.prog addConstraint:[NSLayoutConstraint constraintWithItem:self.prog attribute:NSLayoutAttributeHeight relatedBy:0 toItem:nil attribute:NSLayoutAttributeNotAnAttribute multiplier:1 constant:h]];
UIView* v = [[UIView alloc] initWithFrame:CGRectMake(0,0,w,h)];
[v addSubview:self.prog];
[v addConstraint:[NSLayoutConstraint constraintWithItem:self.prog attribute:NSLayoutAttributeCenterX relatedBy:0 toItem:v attribute:NSLayoutAttributeCenterX multiplier:1 constant:0]];
[v addConstraint:[NSLayoutConstraint constraintWithItem:self.prog attribute:NSLayoutAttributeCenterY relatedBy:0 toItem:v attribute:NSLayoutAttributeCenterY multiplier:1 constant:0]];
v.clipsToBounds = YES;
v.layer.cornerRadius = 4;
self.navigationItem.titleView = v;

As you can see, I also took advantage of this to add some rounding to the corners. I think the result is quite nice-looking.

enter image description here

Upvotes: 10

Related Questions