Geek asks and answers

Create a custom execution bar with images

Basically, what I'm trying to do is create the following image: enter image description here

So, this is an indicator of progress, which will show how many votes the client will receive in this option. How can i do this? I was wondering if I can use a mask (as in flex), but all the masking implementations that I found on the Internet perform masks for UIImages, not for UIImageView. I can not make the mask in UIImage, because the two images are the same size. Should I use X and Y images to crop them ?! So, any suggestions?

Here are two images I have to create for this progress bar:

enter image description hereenter image description here

Greetings.

+3
source share
2

. - :

- (void)viewDidLoad
{
    [super viewDidLoad];
    [self addProgressBarInFrame:CGRectMake(20.f, 20.f, 280.f, 50.f) withProgress:.9f];
    [self addProgressBarInFrame:CGRectMake(20.f, 100.f, 200.f, 25.f) withProgress:.1f];
}

-(void)addProgressBarInFrame:(CGRect)frame withProgress:(CGFloat)progress
{
    float widthOfJaggedBit = 4.0f;
    UIImage * imageA= [[UIImage imageNamed:@"imageA"] stretchableImageWithLeftCapWidth:widthOfJaggedBit topCapHeight:0.0f];
    UIImage * imageB= [[UIImage imageNamed:@"imageB"] stretchableImageWithLeftCapWidth:widthOfJaggedBit topCapHeight:0.0f];
    UIView * progressBar = [[UIView alloc] initWithFrame:frame];
    progressBar.backgroundColor = [UIColor whiteColor];
    UIImageView * imageViewA = [[UIImageView alloc] initWithFrame:CGRectMake(0.0f, 0.0f, frame.size.width*progress, frame.size.height)];
    UIImageView * imageViewB = [[UIImageView alloc] initWithFrame:CGRectMake(frame.size.width*progress, 0.f, frame.size.width - (frame.size.width*progress), frame.size.height)];
    imageViewA.image = imageA;
    imageViewB.image = imageB;
   // imageViewA.contentStretch = CGRectMake(widthOfJaggedBit, 0, imageA.size.width - 2*widthOfJaggedBit, imageA.size.height) ;
   // imageViewB.contentStretch = CGRectMake(widthOfJaggedBit, 0, imageB.size.width - 2*widthOfJaggedBit, imageB.size.height) ;
    [self.view addSubview:progressBar];
    [progressBar addSubview:imageViewA];
    [progressBar addSubview:imageViewB];
}

imageAimageB

+11

Grady Player . , , . UIImageView, "". "setNeedsDisplay", . (sizeToFit ).

, , , - "setFrame: CGRectMake" .

0

More articles:


All Articles