Resizing text in UIWebView - Swift 3

Question

I having a problem, resizing text within a UIWebView, the html file is located within the bundle. I have managed to get a modified script to work within obj-c, however using swift 3 there is no change to the text size, although the optimal value changes correctly at each click of the button. Here is the code -

import UIKit

class ViewController: UIViewController {

@IBOutlet var resWebView: UIWebView!

@IBOutlet weak var increaseFont: UIBarButtonItem!

@IBOutlet weak var decreaseFont: UIBarButtonItem!


var defaults  = ["textFontSize":40]


@IBAction func fontButtonPressed(sender: UIBarButtonItem) {

    var textFontSize = defaults["textFontSize"]

    switch sender.tag
    {
    case 1 : //when decrease
        textFontSize  = textFontSize! - 10

    case 2 ://when increase
        textFontSize = textFontSize! + 50
    default:
        break
    }

    defaults["textFontSize"] = textFontSize

    print(textFontSize)

    var jsString = "document.getElementsByTagName('body')[0].style.fontSize='\(defaults["textFontSize"])px'"
    resWebView.stringByEvaluatingJavaScript(from: jsString)
}


override func viewDidLoad() {
    super.viewDidLoad()

    let resFilePath = Bundle.main.url(forResource: "ResilienceHandbook", withExtension: "html");

    let resRequest = URLRequest(url: resFilePath!);
    resWebView.loadRequest(resRequest);


    // Do any additional setup after loading the view, typically from a nib.
}

override func didReceiveMemoryWarning() {
    super.didReceiveMemoryWarning()
    // Dispose of any resources that can be recreated.
}

}

Any pointers gratefully received - Thank you

score 12 · Accepted Answer · answered Nov 09 '17 at 06:53

As this is a web view, you can wrap content with "font size" attribute,

        let content = "<html><body><p><font size=30>" + webContent + "</font></p></body></html>"
        webView.loadHTMLString(content, baseURL: nil)

Here change the size accordingly

score 3 · Answer 2 · edited May 23 '17 at 12:02

3

This question is answered here:

Resizing UIWebView text

However I converted it in to Swift3 and tested it on Xcode8. Here is the code:

class ViewController: UIViewController {

@IBOutlet weak var webView: UIWebView!

var defaults  = ["textFontSize":12]

override func viewDidLoad() {
    super.viewDidLoad()

    let url = NSURL(string: "https://stackoverflow.com/questions/39638019/resizing-text-in-uiwebview-swift-3")


    let urlRequest = NSURLRequest(url: url! as URL)

    webView.loadRequest(urlRequest as URLRequest)

}

func changeWebViewFontSize(zoomInOrZoomOut: Int, webView: UIWebView)
{
    //1 = decreace
    //2 = increace
    var textFontSizeTemp = defaults["textFontSize"]! as Int


    switch zoomInOrZoomOut
    {
    case 1: //when decrease
        textFontSizeTemp  = textFontSizeTemp - 20
    case 2: //when increase
        textFontSizeTemp = textFontSizeTemp + 20
    default:
        break
    }

    defaults["textFontSize"] = textFontSizeTemp


    let jsString = "document.getElementsByTagName('body')[0].style.fontSize='\(textFontSizeTemp)px'"
    webView.stringByEvaluatingJavaScript(from: jsString)
}

//UIButton Action
@IBAction func zoomOutButton_TouchUpInside(_ sender: AnyObject)
{
    changeWebViewFontSize(zoomInOrZoomOut: 1,webView: webView)
}

@IBAction func zoomInButton_TouchUpInside(sender: AnyObject)
{
    changeWebViewFontSize(zoomInOrZoomOut: 2,webView: webView)
}

edited May 23 '17 at 12:02

Community

1
1

answered Sep 22 '16 at 15:58

rohit90

173
2
7

Thank you for your response rohit90, The script works as my original, the font size does not change although the buttons work as shown in the console. Interestingly though, when using the URL in your script, I get a blank white screen (with the buttons) and using the bundle HTML file when increasing the size nothing happens (save for the console logging) and decreasing size simple puts more blank space between the paragraphs, but does not change the font size. – Bowcaps Sep 22 '16 at 23:11
First try that URL which I am using in my code let me know if that works and I think you are getting blank screen because of this http://stackoverflow.com/questions/31254725/transport-security-has-blocked-a-cleartext-http – rohit90 Sep 23 '16 at 01:10
Yes, the Allow Arbitrary Loads fixed the white screen issue - Thank you. However the text does not resize, it just seems to add blank lines between the lines of text, but the actual font remains fixed - confusing? – Bowcaps Sep 23 '16 at 06:50
Update : Having run the script (your URL) on an iPhone rather than simulator, the title 'Resizing text in uiwebview swift 3' response as required, i.e. increases and decreases in size, but the rest of the page remains unchanged, although no blank lines are added. – Bowcaps Sep 23 '16 at 07:01
this works only on iPads and doestn't work in iPhones, any reason why ? – Heshan Sandeepa Nov 09 '17 at 06:20

Alan Silva · Answer 3 · 2020-04-29T22:00:33.830

Create a snippet variable as follows:

                           let snippet = "<html><head><style>body { font-family: -apple-system, GothamNarrowSSm-Medium; sans-serif;}</style><meta name=\"viewport\" content=\"width=device-width, initial-scale=0.5\"></head><body>\(YOUR_HTML_HERE)</body></html>"

Put you string/html variable where you see YOUR_HTML_HERE.

Set/replace to your favorite font and the scale for sizing in initial-scale=value.

Then, pass it to the WKWebView.

yourWebView.loadHTMLString(snippet, baseURL: nil)

You're all set.

Resizing text in UIWebView - Swift 3

3 Answers3

Linked