Ich habe eine WebView, die eine Website lädt, sobald ich einige meiner Elemente dieser Website drücken, platziert das WebView eine Art blaue Überlagerung über das gepresste Element.Entfernen Fokus-Overlay-Farbe von webview
Gibt es trotzdem dieses Verhalten zu entfernen?
Vielen Dank im Voraus!
Hier ist die Antwort, die Sie für [LINK] suchen, es zusammenzufassen:
Sie können die Highlight Grenze leicht entfernen (die Grenze, die ein Element kommt, wenn der Schwerpunkt ist) oder es ist Farbe mit CSS in einem WebView ändern ! Die WebKit-spezifische Eigenschaft "-webkit-tap-highlight-color" ist genau das, wonach Sie suchen.
Die folgende Zeile wird es vollständig auf einer Seite deaktivieren:
{
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
rgba() wie rgb() ist, aber es dauert einen vierten Parameter für Undurchsichtigkeit. Ich glaube, dass dies wahrscheinlich auch für iPhone WebView funktionieren würde, da sowohl Chrome als auch Safari auf WebKit basieren.
Es ist CSS, also können Sie es in ein externes Stylesheet oder in eine HTML-Seite mit einem Style-Tag einfügen.
Ein weiterer aufwändiger Ansatz, aus dem commen Abschnitt der Verbindung genommen ist:
{
-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}
:focus {
outline: 0;
border:none;
color: rgba(0, 0, 0, 0);
}
Obwohl @ g00dy Lösung funktioniert in den meisten Fällen gibt es einige Android-Versionen, in denen dies nicht genug ist. Ich habe versucht, alle Eigenschaften in diesem und anderen Beiträgen erwähnt, aber nichts ...
In Fällen, dass der einzige Ansatz, der immer funktioniert die Eigenschaft verwendet:
-webkit-user-modify: read-write-plaintext-only;
Die schlechte Seite ist, dass es die erlaubt Benutzer, um die Webansicht zu bearbeiten, und es könnte die Tastatur anzeigen und sogar den Benutzer über die Webansicht schreiben lassen.
Kurz gesagt, nach einem langen Tag auf der Suche nach Lösungen, die einzige, die für mich funktionierte in allen Geräten und Versionen war die Verwendung der genannten Eigenschaft und dann den Klick über das Webview.
Das ist die hässliche Abhilfe:
Im html ich ein div verwendet, um das Loch Code zu wickeln und eine Funktion für das Click-Ereignis hinzugefügt:
<html>
<head>...</head>
<body>
<div id="background">...content...</div>
</body>
<script type="text/javascript">
window.onload = function(){
var background = document.getElementById("background");
background.addEventListener("click",backgroundClick,false);
function backgroundClick(e) {
console.log("whatever");
window.location.href="ftp://"; //some protocolor (dummy url)
}
}
</script>
</html>
Dann können wir die URL Laden außer Kraft setzen (oder das Konsolenprotokoll von Android) wie folgt:
WebSettings webSettings = webView.getSettings();
webSettings.setJavaScriptEnabled(true);
webView.setWebViewClient(new WebViewClient() {
@Override
public boolean shouldOverrideUrlLoading(WebView view, String url) {
someView.requestFocus();
//do something else if needed
return true; //or false if you want the webview to process the url loading
}
});
Wenn wir den Fokus von der Webansicht auf ein anderes Element nicht bearbeitet ändern, wird die Tastatur nicht gezeigt und der Effekt ist die de einen geboren.
Es ist keine gute Lösung, aber es ist das einzige, das endlich für mich funktioniert hat.
Natürlich müssen alle anderen Berührungsereignisse funktionieren (Pinch-Zoom, Scroll, Klick ...).Wenn nicht, würde es ausreichen, das onTouch-Ereignis über das Webview zu überschreiben und nichts zu tun.
Ich hoffe, das hilft jemandem. Grüße.
Edit: ich bemerkt habe, dass die Tatsache, dass Sie die „backgroundClick()“ js Funktion aufrufen deaktiviert die Highlight-Effekt auch die CSS-Eigenschaft zu entfernen und das Click-Ereignis von Android nicht handhaben. Also, wenn Sie mit dem Ereignisse nicht etwas tun müssen, können Sie diesen Teil ignorieren und nur de eventlistener zum Hintergrund hinzuzufügen und nichts tun:
<html>
<head>...</head>
<body>
<div id="background">...content...</div>
</body>
<script type="text/javascript">
window.onload = function(){
var background = document.getElementById("background");
background.addEventListener("click",backgroundClick,false);
function backgroundClick(e) {
//nothing
}
}
</script>
</html>
Nur eine Idee, Sie hätten 'pointer-events: none' [doc] (https://developer.mozilla.org/en/docs/Web/CSS/pointer (Ereignisse) statt Onclick zu überschreiben. – venkatvb
Dank für die Hilfe :) – Inx
immer willkommen ;-) – g00dy
Rather anstatt die Farbe schwarz zu machen und alpha auf 0 zu setzen, hättest du '-webkit-tap-highlight-color: transparent;' [doc] (https://developer.mozilla.org/en-US/docs/Web/ CSS/-webkit-tap-highlight-color) – venkatvb