iOS 图片处理学习：实现点九切图

原创

已于 2022-01-19 04:07:31 修改 · 2.9k 阅读

1 ·

CC 4.0 BY-SA版权

文章标签：

#ios #xcode #swift

于 2022-01-19 04:03:27 首次发布

本文通过实例讲解了iOS中如何实现点九切图，详细介绍了如何保留图片中间部分并拉伸两边，包括调用代码和实现逻辑，帮助开发者理解点九图的制作过程。

先来一个例子: 一张图片，保留中间，拉伸两边

看效果

原始图片

easy

处理后

截屏2022-01-19 上午3.42.36.png

调用代码

        view.backgroundColor = UIColor.white

        let imgViewWidth: CGFloat = 300

        let imgView = UIImageView(frame: CGRect(origin: CGPoint(x: 50, y: 250), size: CGSize(width: imgViewWidth, height: 100)))

        imgView.contentMode = .scaleAspectFit

        view.addSubview(imgView)

        if let image = UIImage(named: "easy"), let img = stretchImageSides(image: image, newWidth: imgViewWidth){

            imgView.image = img

        }

实现代码

逻辑比较简单，

先拉左边

拉升最左边 3 pt 的图片

保留其他部分不变

再拉右边

拉升最右边 3 pt 的图片

保留其他部分不变

这两步的区别是，

画布拉大

func stretchImageSides(image: UIImage, newWidth: CGFloat) -> UIImage? {
        guard image.size.width < newWidth else {
            return image
        }

        let originalWidth = image.size.width
        let tiledAreaWidth = ceil(newWidth - originalWidth) / 2.0

        UIGraphicsBeginImageContextWithOptions(CGSize(width: originalWidth + tiledAreaWidth, height: image.