iOS开发中拉伸图片的几种方式

最新推荐文章于 2020-12-19 12:12:52 发布

原创最新推荐文章于 2020-12-19 12:12:52 发布 · 4.2k 阅读

4 ·

CC 4.0 BY-SA版权

文章标签：

#图片拉伸 #iOS

本文介绍了在iOS开发中如何进行图片拉伸，包括Xcode的Show Slicing功能和代码实现方法，以适应不同尺寸的控件。通过调整拉伸区域，确保图片在拉伸后仍保持美观，特别适用于创建自适应背景图和聊天气泡效果。

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

在iOS开发中,经常会遇到控件尺寸和图片大小不匹配的情况. 一些情况下, 我们需要对图片进行拉伸, 以满足美观需求.

总的来说, 图片的拉伸方式可以分为两种, 一种是通过Xcode自带的Show Slicing功能, 一种是通过代码进行拉伸.

首先, 介绍Xcode自带的Show Slicing 功能.

1. 如下图所示的图片, 如果不进行拉伸, 直接设置给一个长度比较长的button以后,其运行效果如图所示.

2. 用Show Slicing 进行拉伸.

1)选中Assets中的图片,右下角有一个Show Slicing ,如图所示.

2)点击Show Slicing 以后, 会显示如下界面, 点击图中的Start Slicing

3)拖动虚线,调整拉伸区域, 虚线内的白色区域会被拉伸, 注意要保留住四周的圆角,选择好拉伸区域以后, 点击右下角的Show Overview,就会保存拉伸后的效果了.

4)这个时候,在给button设置这张背景图片,运行效果如图,这样就比原先美观多了.

5)当给UIImageView设置尺寸大小不匹配的背景图片时,还可以通过Stretching 功能,当设置了Image以后, 在Stretching的四个参数中,填入0-1的数值, 调整拉伸效果.

3. 用代码进行拉伸

1)第一种拉伸方法

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

使用示例:

UIImage *image = [UIImage imageNamed:@"RedButton"];

image = [image stretchableImageWithLeftCapWidth:image.size.width * 0.5 topCapHeight:image.size.height * 0.5];

[self.loginButton setBackgroundImage:image forState:UIControlStateNormal];

使用效果:

2)第二种拉伸方法

- (UIImage *)resizableImageWithCapInsets:(UIEdgeInsets)capInsets NS_AVAILABLE_IOS(5_0); // create a resizable version of this image. the interior is tiled when drawn.

使用示例:

UIImage *image = [UIImage imageNamed:@"RedButton"];

image = [image resizableImageWithCapInsets:UIEdgeInsetsMake(image.size.height * 0.5, image.size.width * 0.5, image.size.height * 0.5, image.size.width * 0.5)];