Adding a progress bar to the navigation bar

I am new to iOS development.

I would like to know if, in iOS 7, when sending a message to the UINavigationBar , which has a header called: Sending, there is a progress bar that loads until the message is sent successfully.

My question is:

  • Is this panel a progress bar?

  • On iOS 6, the progress bar is inside the UINavigationBar ?

Can someone give me some ideas on how to create this on iOS 7 and iOS6?

I have not tried anything yet. I would like to read some tutorials or examples with this type of problem.

Here is my code:

int progress = 50;

  CGRect navframe = [[self.navigationController navigationBar] frame]; int height= navframe.size.height; sendView = [[UIView alloc] init]; sendView.frame = CGRectMake(0, 0, 200, 30); sendView.backgroundColor = [UIColor clearColor]; UILabel* lbl = [[UILabel alloc] init]; lbl.frame = CGRectMake(0,0, 200, 15); lbl.backgroundColor = [UIColor clearColor]; lbl.textColor = [UIColor whiteColor]; lbl.shadowColor = [UIColor colorWithWhite:0 alpha:0.3]; lbl.shadowOffset = CGSizeMake(0, -1); lbl.font = [UIFont boldSystemFontOfSize:12]; lbl.text = @""; lbl.textAlignment = UITextAlignmentCenter; [sendView addSubview:lbl]; UIProgressView* pv = [[UIProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleBar]; pv.frame = CGRectMake(0, 30-pv.frame.size.height, 200, pv.frame.size.height); pv.progress = progress/100.0; [sendView addSubview:pv]; [self.navigationController.navigationBar addSubview:sendView]; 

Unfortunately, the progress bar is not under the navigation controller. Why?

+5
ios uinavigationbar uiprogressview
source share
4 answers

What I am doing in my iOS application is to create and add a UIProgressBar as a subset of the navigation bar, telling it [progressBar setTranslatesAutoresizingMaskIntoConstraints:NO] and adding restrictions to attach it to the left and right of the panel, and its lower part is at the bottom parts of the navigation bar. The navigation controller supports ivar and offers public methods to show / hide it and set its value. It looks the same as in Safari, as the content is loading.

EDIT: here is the code to create and add it to the navigation bar:

 // in UINavigationController subclass - (void)viewDidLoad { [super viewDidLoad]; // Do any additional setup after loading the view. UIProgressView *progress = [[UIProgressView alloc] initWithProgressViewStyle:UIProgressViewStyleBar]; progress.tag = DISPLAY_PROGRESS_VIEW; [self.view addSubview:progress]; UINavigationBar *navBar = [self navigationBar]; NSLayoutConstraint *constraint; constraint = [NSLayoutConstraint constraintWithItem:progress attribute:NSLayoutAttributeBottom relatedBy:NSLayoutRelationEqual toItem:navBar attribute:NSLayoutAttributeBottom multiplier:1 constant:-0.5]; [self.view addConstraint:constraint]; constraint = [NSLayoutConstraint constraintWithItem:progress attribute:NSLayoutAttributeLeft relatedBy:NSLayoutRelationEqual toItem:navBar attribute:NSLayoutAttributeLeft multiplier:1 constant:0]; [self.view addConstraint:constraint]; constraint = [NSLayoutConstraint constraintWithItem:progress attribute:NSLayoutAttributeRight relatedBy:NSLayoutRelationEqual toItem:navBar attribute:NSLayoutAttributeRight multiplier:1 constant:0]; [self.view addConstraint:constraint]; [progress setTranslatesAutoresizingMaskIntoConstraints:NO]; progress.hidden = YES; } 
+11
source share

I created this simple UINavigationBar category for iOS 9 and later that will do what you want:

UINavigationBar + MH.h

 #import <UIKit/UIKit.h> @interface UINavigationBar (MH) @property (strong, nonatomic, readonly) UIProgressView *mh_progressView; @end 

UINavigationBar + MH.m

 #import "UINavigationBar+MH.h" #import <objc/runtime.h> @implementation UINavigationBar (MH) - (UIProgressView *)mh_progressView{ // find prev instance UIProgressView *progress = objc_getAssociatedObject(self, "mh_progressView"); if(!progress){ progress = [UIProgressView.alloc initWithProgressViewStyle:UIProgressViewStyleBar]; [self addSubview:progress]; // pin to bottom [progress.leadingAnchor constraintEqualToAnchor:self.leadingAnchor].active = YES; [progress.trailingAnchor constraintEqualToAnchor:self.trailingAnchor].active = YES; [progress.bottomAnchor constraintEqualToAnchor:self.bottomAnchor].active = YES; progress.translatesAutoresizingMaskIntoConstraints = NO; // remember it objc_setAssociatedObject(self, "mh_progressView", progress, OBJC_ASSOCIATION_RETAIN_NONATOMIC); } return progress; } @end 

In your view, the controller in viewDidLoad or later just do:

 self.navigationController.navigationBar.mh_progressView.value = 0.5; 

And it will appear just like in Safari. Since it is in the navigation panel, it will continue to be displayed even if the user switches to another screen, which is great for a global task such as downloading or synchronizing files.

+4
source share

it may be late, but I hope this helps others ...

I used M13ProgressSuite for the same purpose.

+3
source share

For iOS 6: Create a custom UIView with a progress bar and UIlabel, and then set it as the titleView property of the navigation item of the view controller.

For iOS 7: Add a UIProgressBar just below the navigation bar.

+1
source share

All Articles