1

I've been searching around cocoa controls and haven't been able to find a progress view that can give me a background image and it puts highlights the image with a color as the progress continues.

For reference I am talking about something as such:

enter image description here

I've only found things that highlight the image but you control the placement with a UISlider below it. Does anything like this exist somewhere? Or is there a simple solution for assigning properties to the UIProgressView to do this?

UPDATE:

So I am using a UIImageView behind a UISlider, that currently looks like this:

enter image description here

Here is the code for adding the UISlider:

-(void)addBottomMostHiddenView{
    _myToolbarHiddenView = [[UIView alloc]initWithFrame:
                            CGRectMake(0, self.view.frame.size.height - 40, self.view.frame.size.width, 50)];
    [_myToolbarHiddenView setBackgroundColor:[UIColor colorWithWhite:0.2 alpha:0.8]];

    [_slider addTarget:self action:@selector(sliderAction) forControlEvents:UIControlEventValueChanged];
    [_slider setBackgroundColor:[UIColor clearColor]];
    _slider.minimumValue = 0.0;
    _slider.maximumValue = 320.0;
    _slider.continuous = YES;
    _slider.value = 25.0;
    _slider.thumbTintColor = [UIColor redColor];
    [_myToolbarHiddenView addSubview:_slider];

    [self.view addSubview:_myToolbarHiddenView];
}

The waveform Image is added elsewhere with:

UIImageView *image = [[UIImageView alloc] initWithImage:responseObject];
            image.frame = CGRectMake(0, 0, self.view.frame.size.width, 40);
            [_myToolbarHiddenView addSubview:image];

Now I just need to get rid of the "thumbImage" ("read only" property it seems) and the bar, and add highlighting over everything. Any thoughts? It doesn't seem that I can get rid of the bar. Also I can adjust the height of the bar to overlay the whole image either it seems.

tshepang
  • 12,111
  • 21
  • 91
  • 136
Paulius Dragunas
  • 1,702
  • 3
  • 19
  • 29
  • It's not clear to me what you're looking for. Are you looking for a progress bar that uses separate images on the left and right portions? – David Berry May 13 '14 at 20:11
  • If that's what you're looking for, the default `UIProgressBar` does that. `progressImage` is used for the portion on the left (the red part in your image) while `trackImage` is used for the portion on the right (the dark portion in your image) – David Berry May 13 '14 at 20:13
  • I am looking for a progress bar that has a background image, and then as time progresses that image is highlighted by a another color. In the image shown, theres a waveform as the background image, and the orange overlay progresses as the song continues. – Paulius Dragunas May 13 '14 at 20:15
  • That's more or less how `UIProgressBar` works if you use `progressImage` and `trackImage` unless you need them to be dynamic images (e.g. showing average amplitude of some wave form) then you'll need to roll your own. – David Berry May 13 '14 at 20:17
  • And when I would click, let say in the middle of the image, everything to the left would be highlighted? – Paulius Dragunas May 13 '14 at 20:19
  • UIProgressView is an output only view. If you're looking for a Control (providing input) the analog would be `UISlider` It also allows you to specify images to be used on the left and right halves of the control (and the thumb, which looks to be empty in your pic) – David Berry May 13 '14 at 20:22
  • All things considered, for the look and functionality you're trying to get, I think you'll be best off just creating a custom control. It'll probably be quicker than you think :) – David Berry May 13 '14 at 22:01
  • I guess it'll be fun learning how to make a modular control – Paulius Dragunas May 13 '14 at 23:48

0 Answers0