Draw an image on-top of Progress View

Question

I'm trying to create a custom UIProgressView and I want it to look like this:

But everything that I'm trying is not working (iOS7). I want it to support iOS5+ and also in iOS7. Finally I did something and I almost there, but I have few problems.

This is how it looks now:

How can I put the image behind the progress view it self, also, how can I change the color of the progress bar it self and how can I force it to stay on the margins of the image?

How can I change the frame of the progress view?

This is my code:

- (void)createProgressView
{
    //   NOT CHANGING THE FRAME
    self.packageUtilizingCellProgressView.frame = CGRectMake(105, 20, 91, 14);
    self.packageUtilizingCellProgressView.progressViewStyle = UIProgressViewStyleBar;

    //   CHANGING THE FRAME
    [[UIProgressView appearance] setFrame:CGRectMake(105, 20, 91, 14)];
}

I've also created a subclass of UIProgressView called MYProgressView and in drawRect I've added those lines:

- (void)drawRect:(CGRect)rect
{
    UIImageView *background = [[UIImageView alloc] initWithImage:[UIImage imageNamed:@"progress_view_transparent_background.png"]];
    [background.image drawInRect:rect];
    [self bringSubviewToFront:background];
}

Please tell me what am I doing wrong and how can I do it the right way?

Thanks in advance!

Answer 1

A solution could be to use a custom Progress View using ImageProgressBar.
Create your custom progress bar and add a UILabel on top of it.

It support iOS5+ and iOS7