CODEWITHSUNDEEP
iosxcodeuinavigationcontrolleruibarbuttonitemuiactivityindicatorview
Lee
Lee

Reputation: 1662

UINavigationController Toolbar - Adding status text with UIActivityIndicatorView

I would like to add a loading activity indicator to my app similar to the one in the mail app with status text to the right. I am using a UINavigationController, so I know I need to set the toolbarItems array on each view where I want it to be displayed. I can add the activity indicator and it does show up, but when I try to add the text field using the code below the text does not show. Is there a way to create a container programmatically that has both the status text and the UIActivityIndicatorView that will show up if added to the toolbarItems array. 

UIBarButtonItem *textFieldItem = [[[UIBarButtonItem alloc] initWithCustomView:textField] autorelease];
self.toolbarItems = [NSArray arrayWithObject:textFieldItem];

UPDATE: I created a class derived from UIView based on the code from pdriegen.
I also added this code to viewDidLoad in my controller 

UIProgressViewWithLabel * pv = [[UIProgressViewWithLabel alloc] init];

UIBarButtonItem * pvItem = [[UIBarButtonItem alloc] initWithCustomView:pv];

[self setToolbarItems:[NSMutableArray arrayWithObject:pvItem]];

Currently nothing shows up in the toolbar. What am I missing?

Upvotes: 3

Views: 10979

Answers (1)

pdriegen
pdriegen

Reputation: 2039

Instead of adding the activityindicator and the label as separate views, create a single composite view that contains both of them and add that composite view to your toolbar.

Create a class that derives from UIView, override initWithFrame and add this code:

- (id)initWithFrame:(CGRect)frame
{
    self = [super initWithFrame:frame];
    if (self) {
        // Initialization code
        [self configureView];
    }
    return self;
}

-(void)configureView{

    self.backgroundColor = [UIColor clearColor];

    UIActivityIndicatorView* activityIndicator = [[UIActivityIndicatorView alloc] initWithActivityIndicatorStyle:UIActivityIndicatorViewStyleWhite];        
    activityIndicator.frame = CGRectMake(0, 0, self.frame.size.height, self.frame.size.height );
    activityIndicator.autoresizingMask = UIViewAutoresizingFlexibleHeight | UIViewAutoresizingFlexibleWidth;
    activityIndicator.backgroundColor = [UIColor clearColor];

    [self addSubview:activityIndicator];

    CGFloat labelX = activityIndicator.bounds.size.width + 2;

    UILabel* label = [[UILabel alloc] initWithFrame:CGRectMake(labelX, 0.0f, self.bounds.size.width - (labelX + 2), self.frame.size.height)];
    label.autoresizingMask = UIViewAutoresizingFlexibleWidth;
    label.font = [UIFont boldSystemFontOfSize:12.0f];
    label.numberOfLines = 1;

    label.backgroundColor = [UIColor clearColor];
    label.textColor = [UIColor whiteColor];
    label.text = @"Loading..";

    [self addSubview:label];
}

You'll also have to expose methods for startAnimating, stopAnimating and one to set the text of the label, but hopefully you get the idea.

To add it to your toolbar, initialize with the following:

UIProgressViewWithLabel * pv = [[UIProgressViewWithLabel alloc] initWithFrame:CGRectMake(0,0,150,25)];

Play around with the width to make it fit..

Upvotes: 10

Related Questions