[英]Creating a custom progress bar with images
Pretty much what I am trying to do, is create the following image: 我正在尝试做的几乎是创建以下图像:
So this is a progress bar, which will show how many votes the client get in that option. 所以这是一个进度条,它将显示客户在该选项中获得多少票。 How can I do that? 我怎样才能做到这一点? I was wondering if I can use a mask (as I would in flex), but all the masking implementations that I found on the web are doing masks for UIImage
s, and not for UIImageView
. 我想知道我是否可以使用掩码(就像我在flex中那样),但是我在网上找到的所有掩码实现都在为UIImage
做掩码,而不是用于UIImageView
。 I cannot do the mask in the UIImage
, because the two images have the same dimensions. 我不能在UIImage
做掩码,因为这两个图像具有相同的尺寸。 I have to use the X and Y of the images to crop them?! 我必须使用图像的X和Y来裁剪它们?! So, any suggestions? 那么,有什么建议吗?
Here are the two images that I have to create that progress bar: 以下是我必须创建进度条的两个图像:
Cheers. 干杯。
you want to get rid of all of the same bit in the middle of each image. 你想摆脱每个图像中间的所有相同位。 then do something like: 然后做类似的事情:
- (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];
}
Grady Player's answer is great. Grady Player的答案很棒。 Just a small note, for anyone that uses this. 对于使用此功能的任何人来说,只是一个小笔记。 I tried to update the frames of the two UIImageView's to update the "progress". 我试图更新两个UIImageView的帧来更新“进度”。 I tried to force an update with "setNeedsDisplay", but to no avail. 我试图用“setNeedsDisplay”强制更新,但无济于事。 (sizeToFit caused problems too). (sizeToFit也引起了问题)。
Anyway, the only way I figured out how to update the progress of an existing progress bar was to call "setFrame:CGRectMake" with my new dimensions. 无论如何,我想出如何更新现有进度条的进度的唯一方法是用我的新维度调用“setFrame:CGRectMake”。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.