Remove the scroll in WebKit View

Question

macOS, Swift

Is it possible to remove the scroll in WebKit View? (or make it not visible)

I have a WebKit View from library and I have made the connection to the ViewController.swift:

@IBOutlet weak var webView1: WKWebView!

AppKit

5.2k

Posted by

narcisfromgirona

Reply

Add a Comment

Answer 1

In MacOS, I tested this:

Subclass and implement scrollWheel:

func scrollWheel(with event: NSEvent)

https://stackoverflow.com/questions/43961952/disable-scrolling-of-wkwebview-in-nsscrollview

See here

openradar.appspot.com/51328335

Code is

import Cocoa
import WebKit

class MyWKWebView: WKWebView {
    override func scrollWheel(with event: NSEvent) {
         print("NoScroll")     // Just to see scroll did not occur
    }
}

class WebViewController: NSViewController, WKUIDelegate {
   
    var webView: MyWKWebView! 
   
    override func loadView() {
        super.loadView()

        let webConfiguration = WKWebViewConfiguration()
        webView = MyWKWebView(frame: CGRect(x: 0, y: 0, width: 300, height: 300), configuration: webConfiguration)
        webView.uiDelegate = self

        view = webView
    }
   
    override func viewDidLoad() {
        super.viewDidLoad()
       
        var myURL: URL!
        myURL = URL(string: "https://developer.apple.com/")
        let myRequest = URLRequest(url: myURL!)
        webView.load(myRequest)
        webView.allowsMagnification = true
        webView.magnification = 0.25
        webView.setMagnification(0.25, centeredAt: CGPoint(x: 150, y: 150))

    }
   
}

Posted by

Claude31

Add a Comment

Answer 2

WkWebView is very opaque. It is almost always a better idea to do such things in CSS or Javascript inside the view.

Posted by

john daniel

Add a Comment

Answer 3

Things are easy in iOS? Are you in MacOS app ?

In that case, you may have to subclass and implement scrollWheel:

func scrollWheel(with event: NSEvent)

https://stackoverflow.com/questions/43961952/disable-scrolling-of-wkwebview-in-nsscrollview

in iOS:

There is a scrollView associated to the webView:

webView.scrollView

Not sure it works in MacOS (except Catalyst)

See discussion here on WebView in MacOS

https://stackoverflow.com/questions/34363924/webview-vs-wkwebview-on-osx

Did you try to set its

isScrollEnabled property to false ?

Or use those properties (iOS):

var showsHorizontalScrollIndicator: Bool

A Boolean value that controls whether the horizontal scroll indicator is visible.

var showsVerticalScrollIndicator: Bool

A Boolean value that controls whether the vertical scroll indicator is visible.

In MacOS, there are

var hasHorizontalScroller: Bool

A Boolean that indicates whether the scroll view has a horizontal scroller.

var hasVerticalScroller: Bool

A Boolean that indicates whether the scroll view has a vertical scroller.

Posted by

Claude31

Add a Comment

Answer 4

Thank you Claude. I know how to do that in iOS. I am asking only for macOS.

I do not know how to apply your suggestions. For instance,

var hasVerticalScroller: Bool

Posted by

narcisfromgirona

Add a Comment

Answer 5

In MacOS, I tested this:

Subclass and implement scrollWheel:

func scrollWheel(with event: NSEvent)

https://stackoverflow.com/questions/43961952/disable-scrolling-of-wkwebview-in-nsscrollview

See here

openradar.appspot.com/51328335

Code is

import Cocoa
import WebKit

class MyWKWebView: WKWebView {
    override func scrollWheel(with event: NSEvent) {
         print("NoScroll")     // Just to see scroll did not occur
    }
}

class WebViewController: NSViewController, WKUIDelegate {
   
    var webView: MyWKWebView! 
   
    override func loadView() {
        super.loadView()

        let webConfiguration = WKWebViewConfiguration()
        webView = MyWKWebView(frame: CGRect(x: 0, y: 0, width: 300, height: 300), configuration: webConfiguration)
        webView.uiDelegate = self

        view = webView
    }
   
    override func viewDidLoad() {
        super.viewDidLoad()
       
        var myURL: URL!
        myURL = URL(string: "https://developer.apple.com/")
        let myRequest = URLRequest(url: myURL!)
        webView.load(myRequest)
        webView.allowsMagnification = true
        webView.magnification = 0.25
        webView.setMagnification(0.25, centeredAt: CGPoint(x: 150, y: 150))

    }
   
}

Posted by

Claude31

Add a Comment

Answer 6

In addition, you should check the system Preferences > General.

Check that

Display sidebars

is not set to always.

Posted by

Claude31

Add a Comment

Answer 7

@Claude31, that solution only disables the scrollWheel. It does not turn off the scrollbars in the enclosingScrollView, and the user can still grab the scroll bars and drag the webView up or down or left to right.

I even tried webView.enclosingScrollView.hasHorizontalScroller = false and webView.enclosingScrollView.hasVerticalScroller = false and that doesn't remove the scroll bars either.

Posted by

southernyankee

For WebKit's WebView, use "webView.scrollView.isScrollEnabled = false" For the older UIWebView, use "webView.enclosingScrollView.hasVerticalScroller = false"

—
William NYC

Add a Comment

Remove the scroll in WebKit View

Accepted Reply

Replies