title: How to use UIGraphicsBeginImageContextWithOptions to draw non-standard shapes?
body: <p>I have an image which is a bubble shape, and I wish to add text to the middle of the image, so I tried to use UIGraphicsBeginImageContextWithOptions to redraw the image. </p>
  
  <p>The code is as following: </p>
  
  <pre><code> let imageSize = CGSize(width: 40, height: 40)
  
          // the rect in which the image will be drawn in
          let imageRect = CGRect(origin: CGPoint.zero, size: imageSize)
          UIGraphicsBeginImageContextWithOptions(imageSize, true, 1.0)
          // begining drawing things
  
          // first, we draw the image in the specified rect
          image.draw(in: imageRect)
  
          let attributes = [ NSAttributedStringKey.foregroundColor: UIColor.red,
                             NSAttributedStringKey.font: UIFont.boldSystemFont(ofSize: 20)]
          let text = "55"
          let size = text.size(withAttributes: attributes)
          let rect = CGRect(x: 20 - size.width / 2, y: 20 - size.height / 2, width: size.width, height: size.height)
          text.draw(in: rect, withAttributes: attributes)
  
          let newImage = UIGraphicsGetImageFromCurrentImageContext()!
          UIGraphicsEndImageContext()
          return newImage
  </code></pre>
  
  <p>but I get a square with a black background with the desired image inside: 
  <a href="https://i.stack.imgur.com/7W3B2.png" rel="nofollow noreferrer"><img src="https://i.stack.imgur.com/7W3B2.png" alt="enter image description here"></a></p>
  
  <p>the blue is the original image, the black is the re-drawn image. Anyone knows how can I draw the image as the original image? </p>
  
  <p>Thanks!</p>