Question

我知道这个主题有很多Q＆amp; A，我把它们全部读完了但仍然无法实现...... 我正在尝试拉伸图像，同时保持其圆形边缘。

这是我的图像（104x77px）：

enter image description here

这是我正在使用的代码：

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

这就是问题：

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

enter image description here

Answer 1

我认为您所寻找的是一张可伸缩的图像

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

正如Maddy所指出的那样，在iOS 5中已经弃用了，对于我们这些可能支持iOS 4.3的穷人来说，这就是我们使用的。

Answer 2

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

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

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

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

Answer 3

每当涉及任何缩放时，两个不同维度的图像看起来都不一样。但是，您可以将图像分成三个部分：左角，中间部分（仅平行线）和右角。

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

请注意，我将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;
}

截图：

enter image description here

Answer 4

检查出来：Resizable UIImage where outside stretches and inside is kept the same

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

可调整大小的UIImage

4 个答案: