UIImage如何使用capInsets调整气泡图像的大小？

Question

我有像图像一样的泡泡，我需要动态调整大小。 附例。 我将有动态文本，我需要仅调整泡沫的直接部分。在中间留下箭头 我怎样才能做到这一点？ 感谢

Answer 1

我认为resizableImageWithCapInsets:对您非常有用

示例：

UIImage *image = [[UIImage imageNamed:@"buttonImage"] resizableImageWithCapInsets:UIEdgeInsetsMake(5.0,10.0,5.0,10.0)];
[self.yourButton setBackgroundImage:image forState:UIControlStateNormal];

我用按钮编写了示例，因为这是使用此方法的常见情况。只需玩上限值。

HTH！

修改

想到这个问题并写了一个小例子。 据我所知，resizableImageWithCapInsets:只能保存图像的边角，以防我们使用二维尺度。

我看到两种方式：

1. 使用两个控件：一个用于气球，一个用于带有正确图像的箭头
2. 从两个图像中为这一个控件渲染图像

我决定实现第二个。 将ballonView.frame作为参数传递到这里：

- (UIImage *)balloonImageWithRect:(CGRect)rect{
    //create two images, ballon image with cap corners
    UIImage *ballonImage = [[UIImage imageNamed:@"balloon"] resizableImageWithCapInsets:UIEdgeInsetsMake(IMAGE_CAP_INSET_TOP, IMAGE_CAP_INSET_LEFT, IMAGE_CAP_INSET_BOTTOM, IMAGE_CAP_INSET_RIGHT) resizingMode:UIImageResizingModeStretch];
    UIImage *arrowImage = [UIImage imageNamed:@"arrow"];

    //drawing area
    CGSize newSize = rect.size;
    UIGraphicsBeginImageContext(newSize);

    //leave some space for arrow at the bottom
    [ballonImage drawInRect:CGRectMake(0, 0, newSize.width, newSize.height - arrowImage.size.height)];
    //draw arrow at the bottom
    [arrowImage drawInRect:CGRectMake((newSize.width - arrowImage.size.width)/2, newSize.height - arrowImage.size.height, arrowImage.size.width, arrowImage.size.height)];

    UIImage *newImage = UIGraphicsGetImageFromCurrentImageContext();
    UIGraphicsEndImageContext();

    return newImage;
}

然后我们将此图像设置为我们的ballonView。

另外，我给gist留下了ViewController的完整代码，其中包含该气球的随机大小：https://gist.github.com/AlloyDev/7910637

您也可以使用这两张图片：

Answer 2

您可以使用方法：

- (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight;

这样打电话：

UIImage* image = [[UIImage imageNamed:@"bubbleImageName.png"]
                       stretchableImageWithLeftCapWidth:15 topCapHeight:13];

更改capWidth和capHeight值

Answer 3

使用UIImage.h委托方法

//使用resizableImageWithCapInsets：和capInsets。

- (UIImage *)stretchableImageWithLeftCapWidth:(NSInteger)leftCapWidth topCapHeight:(NSInteger)topCapHeight;
@property(nonatomic,readonly) NSInteger leftCapWidth;   // default is 0. if non-zero, horiz. stretchable. right cap is calculated as width - leftCapWidth - 1
@property(nonatomic,readonly) NSInteger topCapHeight;   // default is 0. if non-zero, vert. stretchable. bottom cap is calculated as height - topCapWidth - 1

像这样

UIImage *balloon = [[UIImage imageNamed:@"grey.png"] stretchableImageWithLeftCapWidth:24 topCapHeight:15];

希望这会有所帮助。

Answer 4

对于问题中的图像（假设它是Retina图像）：

[[UIImage imageNamed:@"Bubble"] resizableImageWithCapInsets:UIEdgeInsetsMake(14, 28, 14, 26) resizingMode:UIImageResizingModeStretch];

如果您在问题中提供的图像是非视网膜图像，则将值减半。

修改值（UIEdgeInsetsMake(top, left, bottom, right)）以适合您需要的任何图像。