Text Label in Progress Indicator?


#1

Greetings Programs!

I was hoping that the progress indicator would have a text label but it doesn’t look like it has one unless I’m overlooking it?

If not, it would be a handy thing to have right out of box instead of subclassing it or adding it as below (using the IndicatorsGettingStarted sample project):

//Create our indicator inside the placeholder
    SEssentialsProgressIndicator *progIndicator = [SEssentialsProgressIndicator
                                                   progressIndicatorOfType:SEssentialsIndicatorTypeLinearContinuous
                                                                 withFrame:self.progressPlaceholder.bounds];
    progIndicator.style.theme.primaryTintColor = [UIColor colorWithWhite:0.1 alpha:1];
    [self.progressPlaceholder addSubview:progIndicator];

    self.progressLabel = [[UILabel alloc] initWithFrame:progIndicator.bounds];
    self.progressLabel.backgroundColor = [UIColor clearColor];
    self.progressLabel.textColor = [UIColor whiteColor];
    self.progressLabel.textAlignment = NSTextAlignmentCenter;
    [progIndicator addSubview:self.progressLabel];

- (void)updateProgressByStep:(SEssentialsProgressIndicator*)progIndicator
{
    progIndicator.progress += 0.01;
    self.progressLabel.text = [NSString stringWithFormat:@"%i of 100 (%i%%)", (int)(progIndicator.progress * 100), (int)(progIndicator.progress * 100)];
}

Wg


#2

While the Linear Indicator doesn’t have a progress label, you may want to try the Radial indicator and the “showProgressLabel” property on the SEssentialsProgressIndicatorStyle.

Besides that, from a glance at your code, you may need to check what self.progressLabel.bounds is in the updateProgressByStep:, and potentially call [self.progressLabel sizeToFit] after setting the text.


#3

With Tom’s suggestion on using composition instead of inheritance, I am trying this but when I go and add it to the view in my view controller, the progress indicator doesn’t show. Anyone know what I might be doing wrong?

EDIT: Figured it out. Where I had withFrame:frame

[SEssentialsProgressIndicator progressIndicatorOfType:indicatorType withFrame:frame];

it should have been:

[SEssentialsProgressIndicator progressIndicatorOfType:indicatorType withFrame:self.bounds];

and I also had to get rid of the:

[_progressLabel sizeToFit];

So here’s the working code (please let me know if there is any way I can optimize it):

@interface WGProgressIndicator : UIView
{
	SEssentialsProgressIndicator *progressIndicator;
	UILabel *progressLabel;
	NSString *text;
	float progress;
}

@property (nonatomic, retain) SEssentialsProgressIndicator *progressIndicator;
@property (nonatomic, retain) UILabel *progressLabel;
@property (nonatomic, retain) NSString *text;
@property (nonatomic) float progress;

- (id)initWithProgressIndicatorOfType:(SEssentialsIndicatorType)indicatorType withFrame:(CGRect)frame tintColor:(UIColor *)tintColor hidden:(BOOL)hidden;
- (void)addLabelToProgressIndicator;
- (void)updateProgressWithAction:(NSString *)action currentItem:(int)currentItem totalItems:(int)totalItems;
- (void)updateProgressWithAction:(NSString *)action currentItem:(int)currentItem totalItems:(int)totalItems hidden:(BOOL)hidden;
- (void)setText:(NSString *)text;
- (void)setProgress:(float)progress;
- (void)clear:(BOOL)clear hide:(BOOL)hide;

@end



#import "WGProgressIndicator.h"

@implementation WGProgressIndicator

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

- (id)initWithCoder:(NSCoder *)aDecoder
{
	self = [super initWithCoder:aDecoder];
	if (self) {
	}
	
	return self;
}

- (id)initWithProgressIndicatorOfType:(SEssentialsIndicatorType)indicatorType withFrame:(CGRect)frame tintColor:(UIColor *)tintColor hidden:(BOOL)hidden
{
	self = [super initWithFrame:frame];
	if (self) {
		_progressIndicator = [SEssentialsProgressIndicator progressIndicatorOfType:indicatorType withFrame:self.bounds];
		_progressIndicator.style.tintColor = tintColor;
		[self addSubview:_progressIndicator];

		[self addLabelToProgressIndicator];

		[self setHidden:hidden];
	}
	
	return self;
}

- (void)addLabelToProgressIndicator
{
	_progressLabel = [[UILabel alloc] initWithFrame:_progressIndicator.bounds];
	_progressLabel.backgroundColor = [UIColor clearColor];
	_progressLabel.textColor = [UIColor whiteColor];
	_progressLabel.textAlignment = NSTextAlignmentCenter;
	_progressLabel.font = [UIFont fontWithName:@"Helvetica-Bold" size:12.0f];
	[_progressIndicator addSubview:_progressLabel];
}

- (void)setProgress:(float)value
{
	_progress = value;
	
	_progressIndicator.progress = (_progress <= 1.0f ? _progress : 0);
}

- (void)setText:(NSString *)value
{
	_text = value;
	
	if (_progressLabel == nil) return;
	
	_progressLabel.text = (_text == nil ? @"" : _text);
}

- (void)updateProgressWithAction:(NSString *)action currentItem:(int)currentItem totalItems:(int)totalItems
{
	[self updateProgressWithAction:action currentItem:currentItem totalItems:totalItems hidden:self.hidden];
}

- (void)updateProgressWithAction:(NSString *)action currentItem:(int)currentItem totalItems:(int)totalItems hidden:(BOOL)hidden;
{
	if (totalItems == 0) return;

	self.hidden = hidden;
	
	float percentComplete = currentItem / (float)totalItems;
	action = (action != nil && action.length > 0 ? [NSString stringWithFormat:@"%@ ", action] : @"");
	
	[self setProgress:percentComplete];
	[self setText:[NSString stringWithFormat:@"%@%i of %i (%i%%)", action, currentItem, totalItems, (int)(percentComplete * 100)]];
}

- (void)clear:(BOOL)clear hide:(BOOL)hide;
{
	self.hidden = hide;
	
	if (clear) {
		self.progressIndicator.progress = 0;
		[self setText:@""];
	}
}

@end

 And instantiate it as such:

self.progressIndicator = [[WGProgressIndicator alloc] initWithProgressIndicatorOfType:SEssentialsIndicatorTypeLinearContinuous withFrame:CGRectMake((self.view.frame.size.width / 2) - 200, 522, 400, 29) tintColor:[UIColor blueColor] hidden:NO];
[self.view addSubview:self.progressIndicator];

And then update it as such:

// Set straight text.
self.progressIndicator.text = @"any text";
		
// Or let the method create the progress text. I use it in the following manner:
// Inserting 10 of 100 (10%) or 10 of 100 (10%) if the action is nil.
[self.progressIndicator updateProgressWithAction:action currentItem:currentItem totalItems:totalItems];

Wg


#4

Thanks for sharing this Wg!