투케이2K

630. (ios/swift5) [간단 소스] IOS WKWebView 웹뷰 화면 스크롤 이동 이벤트 감지 - WKScriptMessageHandler Webview Scroll 본문

IOS

630. (ios/swift5) [간단 소스] IOS WKWebView 웹뷰 화면 스크롤 이동 이벤트 감지 - WKScriptMessageHandler Webview Scroll

투케이2K 2025. 2. 2. 09:36

[개발 환경 설정]

개발 툴 : XCODE

개발 언어 : SWIFT5

 

[소스 코드]

// --------------------------------------------------------------------------------------
[개발 및 테스트 환경]
// --------------------------------------------------------------------------------------

- 언어 : Swift5

- 개발 툴 : Xcode

- 기술 구분 : Webview / Scroll / WKScriptMessageHandler

// --------------------------------------------------------------------------------------






// --------------------------------------------------------------------------------------
[소스 코드]
// --------------------------------------------------------------------------------------

[1] : 웹 페이지 내부에서 window.onscroll 이벤트를 감지하고, 이를 네이티브로 전달하는 방법입니다


[2] : IOS 웹뷰에서 WKUserContentController 에 스크롤 감지 스크립트 추가

    let contentController = WKUserContentController()
    let script = """
    window.onscroll = function() {
        window.webkit.messageHandlers.scrollHandler.postMessage(window.scrollY);
    };
    """
    let userScript = WKUserScript(source: script, injectionTime: .atDocumentEnd, forMainFrameOnly: false)
    contentController.addUserScript(userScript)
    contentController.add(self, name: "scrollHandler")


[3] : IOS 웹뷰에서 WKWebViewConfiguration 에 컨트롤러 옵션 지정

    let webConfiguration = WKWebViewConfiguration()
    webConfiguration.userContentController = contentController


[4] : IOS 웹뷰에서 스크립트 이벤트 감지를 위한 userContentController 메소드 생성

    func userContentController(_ userContentController: WKUserContentController, didReceive message: WKScriptMessage) {
        if message.name == "scrollHandler", let scrollY = message.body as? CGFloat {
            print("WEBVIEW_웹페이지 스크롤 위치 :: \(scrollY)")
        }
    }

// --------------------------------------------------------------------------------------





// --------------------------------------------------------------------------------------
[참고 사이트]
// --------------------------------------------------------------------------------------

[Ios/Swift] A_Main - 웹뷰 로드 화면 관련 클래스 정리

https://blog.naver.com/kkh0977/222686770495

// --------------------------------------------------------------------------------------
 
반응형
Comments