【Swift】WKWebViewのコンテキストメニューへの項目追加

WKWebViewのコンテキストメニューへの項目追加の方法です。
リンクを長押しした時に出てくるヤツですね。
TouchCalloutとかActionSheetとか言われたりもしてました。

結論から言うとこのURLを見てください。
Add a Context Menu to a Web Viewの所にサンプルのコードがあります。

Adding Context Menus in Your App | Apple Developer Documentation
Provide quick access to useful actions by adding context menus to your iOS app.

何故わざわざ記事にしようかと思ったかというと、
適当にWKWebViewと日本語組み合わせて検索しても全然たどり着かなかったからです。

雑に検索してTouchCalloutとかActionSheetとか見つけてしまって、
Context Menu後回しにしてそっちで探してドツボにハマりました。

ちなみにWKWebView ContextMenuで検索するとそこそこの所に出てきますし、
WKWebView>WKUIDelegate>Displaying a Contextual Menuで見れるので、
時間がかかったのは私が間抜けだっただけです。

コンテキストメニューへの項目追加方法について

英語読みたくない人向け兼メモとして書いて置きます。
サンプルコードより簡単なものに変えてあります。

func webView(_ webView: WKWebView,
             contextMenuConfigurationForElement elementInfo: WKContextMenuElementInfo,
             completionHandler: @escaping (UIContextMenuConfiguration?) -> Void) {
    let configuration =
        UIContextMenuConfiguration(identifier: nil,
                                   previewProvider: { return SFSafariViewController(url: elementInfo.linkURL!) },
                                   actionProvider: { elements in
            guard elements.isEmpty == false else { return nil }
                                    
       //elements:[UIMenuElement]に項目が入っているので、これを変えたい。
       //elementsがconstantなので変数に
            var elementsToUse = elements

       //追加項目をUIMenuElementで用意する。今回はUIActionにした。
            let addAction = UIAction(title: "追加項目"){ (action) in
                //なんかやりたい事
            }

            //配列に追加
            elementsToUse.append(addAction)

            //編集した方を渡してやる       
            return UIMenu(children: elementsToUse)
        }
    )
    completionHandler(configuration)
}

この方法でリンク追加削除が出来ます。
実際はもっと色々書いたコードでやってるので動作確認したコードとかではありません。悪しからず。

ActionSheetとかTouchCallout方面で調べると、
WKUserScriptで”document.documentElement.style.webkitTouchCallout=’none’;”追加して、
既存の物を潰してGestureで独自の物を表示するとかありましたが、
凝った物を作ろうとしなければここで変えれば大丈夫だと思います。

なんとなくのクラス全体像(メモ)

使うのに最低限のコード追加したメモ。これも動かしてはいない。

import WebKit
import SafariServices

class MyWebView:WebView{
    
    init(){
       super.init())
       self.uiDelegate = self
    }
    
}

extension MyWebView:WKUIDelegate{
    func webView(_ webView: WKWebView,
                 contextMenuConfigurationForElement elementInfo: WKContextMenuElementInfo,
                 completionHandler: @escaping (UIContextMenuConfiguration?) -> Void) {
        let configuration =
            UIContextMenuConfiguration(identifier: nil,
                                       previewProvider: { return SFSafariViewController(url: elementInfo.linkURL!) },
                                       actionProvider: { elements in
                 guard elements.isEmpty == false else { return nil }
                                    
           //elements:[UIMenuElement]に項目が入っているので、これを変えたい。
           //elementsがconstantなので変数に
                var elementsToUse = elements

           //追加項目をUIMenuElementで用意する。今回はUIActionにした。
                let addAction = UIAction(title: "追加項目"){ (action) in
                    //なんかやりたい事
                }

                //配列に追加
                elementsToUse.append(addAction)

                //編集した方を渡してやる       
                return UIMenu(children: elementsToUse)
            }
        )
        completionHandler(configuration)
    }
}

コメント

タイトルとURLをコピーしました