Display image-containing HTML using UILabel and detect if an image is tapped in your iOS apps

Make your UILabel graphic and tappable

Thanks to Lukas for the great illustration
let label = UILabel()
label.text = "Some Plain Text"

Part I. Display HTML with an Image

Set up the label
let htmlString = "<html><body><h1>This is the title</h1><p>This is the first paragraph.</p><img src=\"https://miro.medium.com/max/9216/1*QzxcfBpKn5oNM09-vxG_Tw.jpeg\" width=\"360\" height=\"240\"><p>This is the second paragraph.</p><p>This is the third paragraph.</p><p>This is the fourth paragraph.</p><p>This is the last paragraph.</p></body></html>"
label.attributedText = htmlString.convertToAttributedFromHTML()
Display of an image-containing HTML string using UILabel

Part II. Image Tap Gesture Detection

The extension function to calculate the tap gesture’s location
The function in response to a tap gesture
Detect the tap gesture

Conclusions

--

--

Get the Medium app

A button that says 'Download on the App Store', and if clicked it will lead you to the iOS App store
A button that says 'Get it on, Google Play', and if clicked it will lead you to the Google Play store
Yong Cui

Work at the nexus of biomedicine, data science & mobile dev. Author of Python How-to by Manning (https://www.manning.com/books/python-how-to).