Add border to UIImage inside of a UITextView

Question

I am trying to add a border to a UIImage I have, not UIImageView.

Here is my code:

let textView = UITextView(frame: CGRectMake(10, 20, self.view.frame.width - 20, self.view.frame.height - 20))
let attributedString = NSMutableAttributedString(string: "")
let image1 = NSTextAttachment()

image1.image = UIImage(named: "image.jpg")

let oldWidth1 = image1.image!.size.width;

//I'm subtracting 10px to make the image display nicely, accounting
//for the padding inside the textView
let scaleFactor1 = oldWidth1 / (textView.frame.size.width - 10 )

image1.image = UIImage(CGImage: image1.image!.CGImage!, scale: scaleFactor1, orientation: .Up)

let attrStringWithImage1 = NSAttributedString(attachment: image1)
attributedString.replaceCharactersInRange(NSMakeRange(0, 0), withAttributedString: attrStringWithImage1)

textView.attributedText = attributedString;
self.view.addSubview(textView)

I have that UIImage which is displaying nicely in a textView, but now I would like to add a border or some padding to the image so that the text is not so close to the image!

What about adding a newline or two before and/or after the image? — rmaddy, Apr 10 '16 at 20:43
@rmaddy Hello, I know I have already accepted an answer below. But I was just wondering how would I do what you mentioned above? Could possibly be helpfull for other people too! Many thanks. — , Apr 11 '16 at 16:22

score 6 · Accepted Answer · edited May 23 '17 at 11:54

You could easily use Core Graphics to do this

You just have to re-draw the image in a bigger context to account for the border width – and offset the image by the border width.

Something like this should do the trick:

extension UIImage {

    func imageWithBorder(borderWidth:CGFloat) -> UIImage {

        // the bigger size to account for the border width
        let newSize = CGSize(width: size.width+borderWidth*2.0, height: size.height+borderWidth*2.0)

        // create new image context
        UIGraphicsBeginImageContextWithOptions(newSize, false, scale)

        // draw image with offset of the border width
        self.drawInRect(CGRect(x: borderWidth, y: borderWidth, width: size.width, height: size.height))

        // get image and end context
        let img = UIGraphicsGetImageFromCurrentImageContext()
        UIGraphicsEndImageContext()
        return img
    }
}

If you want to give the border a fill color, you can always do that by setting the fill color, and filling the context before drawing the image.

You can then use it like this:

image1.image = UIImage(named: "image.jpg")?.imageWithBorder(10)

Side Note

You seem to be force unwrapping optionals quite a bit. Please don't. Please always safely unwrap them. My answer here might be useful for that.

hey, just wondering if you'd be able to help with this other similar question? http://stackoverflow.com/questions/36580932/add-text-with-uiimage-inside-of-a-uitextview If you could thanks alot! — , Apr 12 '16 at 18:29

Add border to UIImage inside of a UITextView

1 Answers1

You could easily use Core Graphics to do this

Side Note