UIImage部分拉伸——stretchableImageWithLeftCapWidth的使用

最新推荐文章于 2025-04-25 16:39:32 发布

原创最新推荐文章于 2025-04-25 16:39:32 发布 · 194 阅读

0 ·

CC 4.0 BY-SA版权

iphone 专栏收录该内容

198 篇文章

订阅专栏

本文介绍了如何使用UIImage的stretchableImageWithLeftCapWidth方法来实现图片的部分拉伸，包括横向和纵向拉伸，并通过实例展示了如何避免特定区域被拉伸以保持图片美观。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

UIImage部分拉伸——stretchableImageWithLeftCapWidth的使用

转载自 http://www.2cto.com/kf/201507/419729.html

简介：有时候我们只是想把图片部分拉伸，而不是全部拉伸，那么就要用到下面这个函数，并附上实例验证.

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

对距离leftCapWidth的1竖排像素，和具体topCapHeight的1横排像素进行拉伸，其它像素不拉伸

练习一：理解拉伸点，左边和上面分开设置，从效果图来理解。

//不设置拉伸点，直接设置
    UIImage *image1 = [UIImage imageNamed:@QQ];
    UIImageView *imageView1 = [[UIImageView alloc] initWithFrame:CGRectMake(10, 100, 170, 170)];
    imageView1.image = image1;
    [self.view addSubview:imageView1];
 
    //设置拉伸点，对左边和上面分开设置，理解其拉伸效果
    UIImage *image2 = [UIImage imageNamed:@QQ];
    image2 = [image2 stretchableImageWithLeftCapWidth:0 topCapHeight:image2.size.height*0.5];
    UIImageView *imageView2 = [[UIImageView alloc] initWithFrame:CGRectMake(190, 100, 170, 170)];
    imageView2.image = image2;
    [self.view addSubview:imageView2];

效果图

横向拉伸：

[image2 stretchableImageWithLeftCapWidth:image2.size.width*0.5 topCapHeight:0];

效果图：

练习二：最近做到一个聊天框的联系，对文字背景图片的拉伸应用，左边的小三角我不希望拉伸，拉伸影响美观，只拉伸右边方框部分，那么调用此函数就可以实现，这个较为常用。

UIImage *image1 = [UIImage imageNamed:@chat];
    UIImageView *imageView1 = [[UIImageView alloc] initWithFrame:CGRectMake(100, 100, 200, 80)];
    imageView1.image = image1;
    [self.view addSubview:imageView1];
 
    //设置拉伸点
    UIImage *image2 = [UIImage imageNamed:@chat];
    image2 = [image2 stretchableImageWithLeftCapWidth:image2.size.width*0.5 topCapHeight:image2.size.width*0.8];
    UIImageView *imageView2 = [[UIImageView alloc] initWithFrame:CGRectMake(100, 200, 200, 80)];
    imageView2.image = image2;
    [self.view addSubview:imageView2];

效果图：