使用圖像創建自定義進度條

Question

我正在嘗試做的幾乎是創建以下圖像：

所以這是一個進度條，它將顯示客戶在該選項中獲得多少票。 我怎樣才能做到這一點？ 我想知道我是否可以使用掩碼（就像我在flex中那樣），但是我在網上找到的所有掩碼實現都在為UIImage做掩碼，而不是用於UIImageView 。 我不能在UIImage做掩碼，因為這兩個圖像具有相同的尺寸。 我必須使用圖像的X和Y來裁剪它們？！ 那么，有什么建議嗎？

以下是我必須創建進度條的兩個圖像：

干杯。

Answer 1

你想擺脫每個圖像中間的所有相同位。 然后做類似的事情：

- (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];
}

Answer 2

Grady Player的答案很棒。 對於使用此功能的任何人來說，只是一個小筆記。 我試圖更新兩個UIImageView的幀來更新“進度”。 我試圖用“setNeedsDisplay”強制更新，但無濟於事。 （sizeToFit也引起了問題）。

無論如何，我想出如何更新現有進度條的進度的唯一方法是用我的新維度調用“setFrame：CGRectMake”。