Nativescript WebViewキャプチャonclickイベント

Question

WebViewで画像を表示するためにタップ（クリック）イベントをキャプチャする必要があります（SVGファイル内の画像を表示する）ので、画像の場所に基づいて別のNativescriptページを表示できます

WebViewのx、y座標でタップイベントをキャプチャする方法はありますか？

別のこと。私は、WebViewがhtml内のハイパーリンクを読み込むことができることがわかりました。ロードされたHTML内のリンクを作成する方法はありますか？それで、nativescriptアプリケーション内の別のローカルファイルを開きますか？たとえば、< a href = "〜/ stuff/foo2.html">ここでは</a>が動作しませんでしたが（私の "app"フォルダの下にあるもの）、私は404を取得しています。

Answer 1

これは可能な解決策です。

WebViewに表示されているページにフロントエンドのJavascriptコードを追加します。そのJavascriptを使用してページのタップを検出し、タップしたときにWebViewを新しい（偽の）ページにリダイレクトします。 NativeScript側では、WebViewのloadStartedEvent（WebViewがナビゲートすると起動します）を聞き、WebViewがその新しい偽のページに移動しようとするときに何かをします。

私は次のようになります。

ブラウザ/ WebViewコードです。 clickイベントのイベントリスナーを追加します（おそらくこれをtapイベントに変更します）。クリックすると、ユーザーはnativescript://{X coordinate}/{Y coordinate}にナビゲートされます。それが始まるURLにナビゲートするかどうNativeScript側のその後

window.addEventListener('click', function(event){ 
    window.location.href='nativescript://' + event.screenX + '/' + event.screenY; 
}) 

は、WebViewのがナビゲートされたときのリスニングイベントリスナーを設定し、「nativescript：//」をロードするイベントを停止してから座標を抽出しますURL。

var wv = new webViewModule.WebView(); 
wv.on(webViewModule.WebView.loadStartedEvent, function(event) { 

    // Check if the WebView is trying to navigate to 'nativescript://...' 
    if (event.url.indexOf('nativescript://') === 0) { 
     // Stop the loading event 
     if (ios) { 
      event.object.ios.stopLoading(); 
     } else if (android) { 
      event.object.android.stopLoading(); 
     } 

     // Do something depending on the coordinates in the URL 
     var coords = event.url.split('/'); 
     coords.splice(0, 2); 
     console.log(coords[0] + ' - ' + coords[1]) 
    } 
}); 

ローカルファイルをロードするには、ローカルファイルへのパスをfile://にするだけです。例えば。

var linkPath = fs.path.join(fs.knownFolders.currentApp().path, 'localHTMLFiles') + '/myFile.html'; 

var link = '<a href="file://" + linkPath + ">"'