可调整大小的 UIImage答案

【问题标题】：Resizable UIImage可调整大小的 UIImage
【发布时间】：2013-08-18 21:33:40
【问题描述】：

我知道这个话题有很多问答，我都阅读了它们，但仍然无法继续... 我正在尝试拉伸图像，同时保持其圆形边缘。

这是我的图片（104x77px）：

这是我正在使用的代码：

UIImage *bg = [UIImage imageNamed:@"btnBg"];
UIEdgeInsets insets = UIEdgeInsetsMake((bg.size.height - 1)/2, (bg.size.width - 1)/2, (bg.size.height - 1)/2, (bg.size.width - 1)/2);
bg = [bg resizableImageWithCapInsets:insets];

UIImageView *imgView = [[UIImageView alloc] initWithFrame:CGRectMake(20, 20, 50, 44)];
imgView.image = bg;

UIImageView *imgView2 = [[UIImageView alloc] initWithFrame:CGRectMake(20, 70, 250, 44)];
imgView2.image = bg;

[self.view addSubview:imgView];
[self.view addSubview:imgView2];

这就是问题所在：

如您所见，每张图片都有不同的边缘。我做错了什么？！

【问题讨论】：

图像视图的问题是它们比原始图像更小（高度）（第一个也更窄）。可调整大小的图像应大于原始图像。

标签： ios objective-c uiimage resizable

【解决方案1】：

我认为您正在寻找的是可拉伸的图像

[[UIImage imageNamed:@"someimage.png"] stretchableImageWithLeftCapWidth:5 topCapHeight:5];

正如 maddy 指出的那样，这在 iOS 5 中已被弃用，对于我们这些不得不支持 iOS 4.3 的可怜人来说，这就是我们所使用的。

【讨论】：

stretchableImageWithLeftCapWidth 在 iOS 5.0 中已弃用。 resizableImageWithCapInsets 是现在使用的正确方法。
更新了我的答案，我建议使用插图。我遇到过有趣的案例，其中一个像素可以在错误的位置拉伸/调整图像大小

【解决方案2】：

只要涉及到任何缩放，两个不同尺寸的图像看起来就不会完全相同。但是，您可以将图像分成三个部分：左角、中间部分（仅平行线）和右角。

现在要创建不同大小的图像视图，您将保持左右部分不变，并缩放中间部分，只要保持高度不变，中间部分看起来就不会变形。

请注意，我将fitInRect 的高度设为 77，因为这是原始图像高度。您可以将其更改为 44，但保持所有图像视图的数字不变。最后，widthToPreserve 必须至少为 34（这意味着整个 Rect 宽度必须为 68 或更大），因为这是原始图像中圆边的宽度。

当然，如果您的目标图像视图高度为 44，那么您可以通过使用较小的图像来简单地完成所有这些操作。

此代码有效：

-(void)viewDidAppear:(BOOL)animated
{
    UIImage *img = [UIImage imageNamed:@"img"];

    UIImageView *view1 = [self getImageViewFromImage:img widthToPreserve:34 fitInRect:CGRectMake(20, 20, 100, 77)];

    UIImageView *view2 = [self getImageViewFromImage:img widthToPreserve:34 fitInRect:CGRectMake(20, 120, 250, 77)];

    [self.view addSubview:view1];
    [self.view addSubview:view2];

}

-(UIImageView*)getImageViewFromImage:(UIImage*)image widthToPreserve:(float)width fitInRect:(CGRect)rect
{
    CGImageRef left, middle, right;
    CGRect leftRect, middleRect, rightRect;
    UIImage *leftImage, *middleImage, *rightImage;
    UIImageView *leftView, *middleView, *rightView;

    // calculate CGRect values for the original image
    leftRect = CGRectMake(0, 0, width, image.size.height);
    middleRect = CGRectMake(width, 0, image.size.width - 2*width, image.size.height);
    rightRect = CGRectMake(image.size.width - width, 0, width, image.size.height);

    left = CGImageCreateWithImageInRect([image CGImage], leftRect);
    middle = CGImageCreateWithImageInRect([image CGImage], middleRect);
    right = CGImageCreateWithImageInRect([image CGImage], rightRect);


    leftImage = [UIImage imageWithCGImage:left];
    middleImage = [UIImage imageWithCGImage:middle];
    rightImage = [UIImage imageWithCGImage:right];

    leftView = [[UIImageView alloc] initWithImage:leftImage];
    middleView = [[UIImageView alloc] initWithImage:middleImage];
    rightView = [[UIImageView alloc] initWithImage:rightImage];

    //make your image subviews, with scaling on the middle view
    [leftView setFrame:CGRectMake(0, 0, width, rect.size.height)];
    [middleView setFrame:CGRectMake(width, 0, rect.size.width - 2*width, rect.size.height)];
    [rightView setFrame:CGRectMake(rect.size.width - width, 0, width, rect.size.height)];

//add your 3 subviews into a single image view
    UIImageView *imgView = [[UIImageView alloc] initWithFrame:rect];
    [imgView addSubview:leftView];
    [imgView addSubview:middleView];
    [imgView addSubview:rightView];


    CGImageRelease(left);
    CGImageRelease(middle);
    CGImageRelease(right);

    return imgView;
}

截图：

【讨论】：

【解决方案3】：

您可以为图像指定驻留模式。选项为UIImageResizingModeStretch 和UIImageResizingModeTile。

拥有可拉伸图像的想法是让您可以拥有一个小图像文件。您应该考虑使用较小的图像来节省应用程序包中的空间。此外，您的左右边缘插图不必位于中间。它们应该刚好超出曲线，在您的图像中看起来大约有 40 个点。

这是用于设置调整大小模式的代码：

bg = [bg resizableImageWithCapInsets:insets resizingMode: UIImageResizingModeStretch];

【讨论】：

【解决方案4】：

看看这个：Resizable UIImage where outside stretches and inside is kept the same

基本上与您想要的相反。希望对您有所帮助！

【讨论】：