WKWebview로 간단한 웹 뷰 만들기

12247 단어 Swift2.0SwiftWKWebView

WKWebview 소개


처리가 UIWebview보다 빠르고 JS가 주위의 처리를 안정적으로 합니다.
iOS 8 이후부터 사용할 수 있습니다.
구글 크롬의 iOS 앱도 WKWebview를 사용했다
애플 공식 문서에도
For new development, employ this class instead of the older UIWebView class.
있기 때문에, 변형은 이 클래스를 사용합니다.

1. 성명


WKWebView의 인스턴스를 생성합니다.
WKWebView의 경계선 지정
※ Class에 WKNavigation Delegate 계약을 지정하는 것을 잊지 마십시오
class WebViewController: UIViewController, WKNavigationDelegate {

  ・
 ・

  webview = WKWebView()
  webview.navigationDelegate = self
  webview.translatesAutoresizingMaskIntoConstraints = false        

2. 배치


StoryBoard에서 WKWebview를 구성할 수 없습니다.
코드는 AutoLayout을 제한해야 합니다.
※ NSLayoutanchor(iOS 9 이후)를 이용하면 CSS 링크에 오토Layout에 대한 기술을 간단히 적어두면
containerView.addSubview(webview!)

// 上辺の制約
webview.topAnchor.constraintEqualToAnchor(containerView.topAnchor, constant: 0.0).active = true
// 下辺の制約
webview.bottomAnchor.constraintEqualToAnchor(containerView.bottomAnchor, constant: 0.0).active = true
// 左辺の制約
webview.leadingAnchor.constraintEqualToAnchor(containerView.leadingAnchor, constant: 0.0).active = true
// 右辺の制約
webview.trailingAnchor.constraintEqualToAnchor(containerView.trailingAnchor, constant: 0.0).active = true

빈 기어로 되돌아오다

webview.allowsBackForwardNavigationGestures = true스왑 가능

2. 웹 페이지 표시


loadReqest 방법으로 페이지 표시
let request = NSURLRequest(URL: url!)
webview.loadRequest(request)

3. 탐색 설치


돌아가기/전진 버튼의 설정 방법, 여기는 이전의 UIWebVIew와 같습니다.
StoryBoard에서 Toolbar을 설정하고 이번에 코드로 단추를 설정했습니다.
func creatToolbarItems() {

    let backBtnImage = UIImage(named: "back")
    let fowardBtnImage = UIImage(named: "next")    
    let flexbleItem = UIBarButtonItem(barButtonSystemItem: .FlexibleSpace, target: nil, action: nil)

    // 戻る・進む・リロードボタンの設置
    goBackBtn = UIBarButtonItem(image: backBtnImage, style: .Plain, target: self, action: #selector(goBack))
    goFowardBtn = UIBarButtonItem(image: fowardBtnImage, style: .Plain, target: self, action: #selector(goFoward))
    refreshBtn = UIBarButtonItem(barButtonSystemItem: .Refresh, target: self, action: #selector(refresh))

    toolbar.items = [goBackBtn, goFowardBtn, flexbleItem, refreshBtn]
}

4. 델리멘


WKNavigation 의 경계 문자를 사용하는 방법
읽기 시작 - 읽기가 완료된 시간 이벤트를 가져올 수 있습니다.
상용의 예로 삼다
브라우저 후퇴 여부를 판단하고 백 버튼의 ON, OFF 전환
다음과 같이 처리하다

// ページ読み込み完了時、呼ばれるメソッド
func webView(webView: WKWebView, didFinishNavigation navigation: WKNavigation!) {
    if webview.canGoBack {
        goBackBtn.tintColor = nil
    } else {
        goBackBtn.tintColor = UIColor.grayColor()
    }
}

주: 기본적으로 target="blank" 링크를 열 수 없습니다


아래와 같이 정계부 방법 내에서
target="blank"상황에서의 처리 설명
func webView(webView: WKWebView, decidePolicyForNavigationAction navigationAction: WKNavigationAction, decisionHandler: (WKNavigationActionPolicy) -> Void) {

    guard let url = navigationAction.request.URL else {
        decisionHandler(.Cancel)
        return
    }

    // target="_blank"の場合
    if navigationAction.navigationType == WKNavigationType.LinkActivated {
        if navigationAction.targetFrame == nil || !(navigationAction.targetFrame!.mainFrame) {
            webview.loadRequest(NSURLRequest.init(URL: url))
            decisionHandler(.Cancel)
            return
        }
    }

    decisionHandler(.Allow)
}

완성!



사이트 축소판 그림


WKWebView에서 target="blank"링크를 열 수 없을 때의 처리 방법
http://qiita.com/ShingoFukuyama/items/b3a1441025a36ab7659c

좋은 웹페이지 즐겨찾기