个人中心
gpt4 book ai didi

android - 使触摸屏立即响应 Html 查看器并停止 Android 在触摸屏上的振动

转载 作者：行者123 更新时间：2023-11-28 02:24:01 25 4
gpt4 key购买 nike

总结:当我在 Android 应用程序中触摸我的 WebView 时，我想停止嗡嗡声。我希望第一次触摸 webview 时没有延迟，并尽可能响应触摸。

编辑:我设法摆脱了嗡嗡声。它被称为触觉反馈。您可以通过将以下代码行放在我的 onCreate 的末尾来删除它功能:webview.setHapticFeedbackEnabled(false); .

编辑 2:我现在发现第一次触摸检查缩放和东西时有 300 毫秒的延迟。这可以通过将以下内容放在 <head> 中来关闭。节html文件:<meta name="viewport" content="width=device-width, user-scalable=no" /> .

所以这个问题得到了回答，除非有人知道任何其他提示。

我有一个非常基本的安卓应用程序。您可以使用仅使用 java 的“空 Activity ”在 Android Studio 中创建它。然后更新结果代码如下。

注意:它基本上是一个 WebView ，其中 index.html文件包含在文件夹 assets/www 中.

蓝色 Blob 会响应您的触摸。当您按下它们时，它们会根据您触摸的每个圆圈的哪一侧变成青蓝色。 (一个是左/右按钮，一个是上/下按钮。)

问题一:第一次触摸屏幕时和松开手指后再次触摸屏幕时有烦人的嗡嗡声。我怎样才能在 Android 代码中删除它，只为这个应用程序？

问题 2:我还想让触摸响应尽可能快。还有什么我可以做的吗？我第一次触摸蓝色按钮时似乎有延迟。当我在蓝色按钮上左右移动手指时，响应似乎正常。

重要的html:

<!DOCTYPE html>

<html>
<head>
    <title>Test Touch Screen</title>
</head>
<body onload="MyOnLoad();" style="width:100%; height: 100%; padding: 0 0 0 0; margin: 0 0 0 0; overflow: hidden;">
<div id="divMain" style="display: none;">
<br /><br /><br />
<button onclick="MyButton();" style="font-size:xx-large">Click</button>
</div>
<div id="divCanvas" style="display: block; width: 100%; height: 100%; min-height: 100vh; overflow-x: hidden; overflow-y: hidden;
                                            margin: 0px 0px 0px 0px; padding: 0px 0px 0px 0px;">
    <canvas id="mycanvas" oncontextmenu="return false;"></canvas>
</div>

<!-- JQuery -->
<script type="text/javascript" src="https://code.jquery.com/jquery-3.2.0.min.js"></script>

<script type="text/javascript">
var g_StopTouchAndMouseFiringTwice = true;
var g_PosUpDownX = 0;
var g_PosUpDownY = 0;
var g_PosLeftRightX = 0;
var g_PosLeftRightY = 0;
var g_PosReturnX = 0;
var g_PosReturnY = 0;
var g_Radius = 0;
var g_UpDown = 0; // -1, 0, 1
var g_LeftRight = 0; // -1, 0, 1
var g_TouchPoints = [];

function MyOnLoad() {
    // The Resize code - need to add early due to maximize
    addEventListener("resize", MyWindowResize, false);

   if ((canv = document.getElementById("mycanvas")) !== null && typeof (canv) !== "undefined") {
        canv.addEventListener("mousemove", mycanvasOnMouseMove, false);
        canv.addEventListener("mousedown", mycanvasOnMouseDown, false);
        canv.addEventListener("mouseup", mycanvasOnMouseUp, false);

        canv.addEventListener("touchstart", mycanvasOnTouchStart, false);
        canv.addEventListener("touchmove", mycanvasOnTouchMove, false);
        canv.addEventListener("touchend", mycanvasOnTouchEnd, false);
        canv.addEventListener("touchcancel", mycanvasOnTouchCancel, false);
    }
    // Prevent scrolling when touching the canvas
    // Stops all mouse events as well
    document.body.addEventListener("touchstart", function (e) {
        if (g_StopTouchAndMouseFiringTwice && e.target.id === "mycanvas")    {
            e.preventDefault();
        }
    }, false);
    document.body.addEventListener("touchend", function (e) {
        if (g_StopTouchAndMouseFiringTwice && e.target.id === "mycanvas")     {
            e.preventDefault();
        }
    }, false);
    document.body.addEventListener("touchmove", function (e) {
        if (g_StopTouchAndMouseFiringTwice && e.target.id == "mycanvas")    {
            e.preventDefault();
        }
    }, false);

    Layout();
    setTimeout("Animate();", 50);
}
function Layout() {
    var width, height;
    width = $(window).width();
    height = $(window).height();

    var widthDoc = $(document).width(), heightDoc = $(document).height();

    $("#divCanvas").css("overflow-x", "hidden");
    $("#divCanvas").css("overflow-y", "hidden");
    $("#divCanvas").width(width);
    $("#divCanvas").height(height);

    $("#mycanvas").css("overflow-x", "hidden");
    $("#mycanvas").css("overflow-y", "hidden");
    $("#mycanvas").width(width);
    $("#mycanvas").height(height);
    mycanvas.width = width;
    mycanvas.height = height;

    var buffer;
    g_Radius = Math.floor(0.2 * Math.min(width, height));
    buffer = Math.floor(1.1 * g_Radius);
    g_PosUpDownX = width - buffer;
    g_PosUpDownY = height - buffer;
    g_PosLeftRightX = buffer;
    g_PosLeftRightY = height - buffer;
    g_PosReturnX = buffer;
    g_PosReturnY = buffer;
}
function Animate() {
    var border = 20, borderX2 = 2 * border, piX2 = 2 * Math.PI;
    var i, start;
    var width, height;

    var c = document.getElementById("mycanvas");
    var ctx = c.getContext("2d");

    width = c.width;
    height = c.height;

    SetUpDownLeftRight();

    ctx.fillStyle = "#FF0000";
    ctx.fillRect(0, 0, width, height);
    ctx.fillStyle = "#00FF00";
    ctx.fillRect(border, border, width - borderX2, height - borderX2);

    for (i = 0; i < 2; i++) {
        start = i === 0 ? 0 : Math.PI;
        ctx.fillStyle = ((i === 0 && g_UpDown < 0) || (i === 1 && g_UpDown > 0)) ? (Math.abs(g_UpDown) > 1 ? "#FFFFFF" : "#00FFFF") : "#0000FF";
        ctx.beginPath();
        ctx.arc(g_PosUpDownX, g_PosUpDownY, g_Radius, start, start + Math.PI);
        ctx.closePath();
        ctx.fill();
        //ctx.closePath();
    }

    for (i = 0; i < 2; i++) {
        start = i === 0 ? (0.5 * Math.PI) : (1.5 * Math.PI);
        ctx.fillStyle = ((i === 0 && g_LeftRight < 0) || (i === 1 && g_LeftRight > 0)) ? (Math.abs(g_LeftRight) > 1 ? "#FFFFFF" : "#00FFFF") : "#0000FF";
        ctx.beginPath();
        ctx.arc(g_PosLeftRightX, g_PosLeftRightY, g_Radius, start, start + Math.PI);
        ctx.closePath();
        ctx.fill();
        //ctx.closePath();
    }

    //ctx.fillStyle = "#0000FF";
    //ctx.beginPath();
    //ctx.arc(g_PosReturnX, g_PosReturnY, g_Radius, 0, 2 * Math.PI);
    //ctx.closePath();
    //ctx.fill();
    ////ctx.closePath();

    setTimeout("Animate();", 50);
};
function SetUpDownLeftRight() {
    var i, len, xDist, yDist, rXr;

    g_LeftRight = 0
    g_UpDown = 0;

    rXr = g_Radius * g_Radius;

    for (i = 0, len = g_TouchPoints.length; i < len; i++) {
        xDist = g_TouchPoints[i].clientX - g_PosUpDownX;
        yDist = g_TouchPoints[i].clientY - g_PosUpDownY;
        if ((xDist * xDist + yDist * yDist) < rXr) {
            // Do the + so see if multiple ones
            g_UpDown += yDist < 0 ? 1 : -1; // Up is in the negative y  direction
        }

        xDist = g_TouchPoints[i].clientX - g_PosLeftRightX;
        yDist = g_TouchPoints[i].clientY - g_PosLeftRightY;
        if ((xDist * xDist + yDist * yDist) < rXr) {
            // Do the + so see if multiple ones
            g_LeftRight += xDist > 0 ? 1 : -1;
        }
    }
}
function MyWindowResize(e) {
    Layout();
};
function MyButton() {
    var el;
    if ((el = document.getElementById("divMain")) !== null && typeof (el) !== "undefined") {
        el.style.display = "none";
    }
    if ((el = document.getElementById("divCanvas")) !== null && typeof (el) !== "undefined") {
        el.style.display = "block";
        Layout();
    }
}

function mycanvasOnMouseMove(e) {
    var found;
    var i, len = g_TouchPoints.length;

    //// Only add it if it is already there
    //for (i = len - 1, found = false; i >= 0; i--) {
    //    if (g_TouchPoints[i].identifier === -1) {
    //        if (!found) {
    //            found = true;
    //            g_TouchPoints[i].clientX = e.clientX;
    //            g_TouchPoints[i].clientY = e.clientY;
    //        } else {
    //            g_TouchPoints.splice(i, 1);
    //        }
    //    }
    //}
    //if (!found) g_TouchPoints.push({ identifier: -1, clientX: 0,  clientY: 0 });

    // Only update it if it is already there
    for (i = len - 1, found = false; i >= 0; i--) {
        if (g_TouchPoints[i].identifier === -1) {
            if (!found) {
                found = true;
                g_TouchPoints[i].clientX = e.clientX;
                g_TouchPoints[i].clientY = e.clientY;
            } else {
                 g_TouchPoints.splice(i, 1);
            }
       }
    }
};
function mycanvasOnMouseDown(e) {
    var i, len = g_TouchPoints.length;

    // Remove any previous
    for (i = len - 1; i >= 0; i--) {
        if (g_TouchPoints[i].id === -1) {
           g_TouchPoints.splice(i, 1);
        }
    }
    g_TouchPoints.push({ identifier: -1, clientX: e.clientX, clientY:  e.clientY });
};
function mycanvasOnMouseUp(e) {
    var i, len = g_TouchPoints.length;

    for (i = len - 1; i >= 0; i--) {
        if (g_TouchPoints[i].identifier === -1) {
            g_TouchPoints.splice(i, 1);
        }
    }
};

function touchesRedo(e) {
    var i, len;
    g_TouchPoints.length = 0; // Also gets rid of mouse ones
    for (i = 0, len = e.touches.length; i < len; i++) {
        g_TouchPoints.push({ identifier: e.touches[i].identifier, clientX: e.touches[i].clientX, clientY: e.touches[i].clientY });
    }
}
function mycanvasOnTouchStart(e) {
    touchesRedo(e);
};
function mycanvasOnTouchMove(e) {
    touchesRedo(e);
};
function mycanvasOnTouchEnd(e) {
    touchesRedo(e);
};
function mycanvasOnTouchCancel(e) {
    touchesRedo(e);
};
</script>
</body>
</html>

主 Activity .java

package touchscreen.com.touchscreentest;

import android.os.Build;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.View;
import android.view.WindowManager;
import android.webkit.WebChromeClient;
import android.webkit.WebSettings;
import android.webkit.WebView;

public class MainActivity extends AppCompatActivity {
    @Override
    protected void onCreate(Bundle savedInstanceState) {
        getWindow().setFlags(WindowManager.LayoutParams.FLAG_FULLSCREEN,    WindowManager.LayoutParams.FLAG_FULLSCREEN);

        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_main);

        WebView webview = (WebView) findViewById(R.id.webView);
        WebSettings settings = webview.getSettings();
        settings.setJavaScriptEnabled(true);
        webview.setWebChromeClient(new WebChromeClient());
        webview.loadUrl("file:///android_asset/www/index.html?IsAndroidWebview=true"); // This is a cheat to tell the html we are calling in AndroidApp
        // These things allegedly make it faster
        settings.setLoadWithOverviewMode(true);
        settings.setUseWideViewPort(true);
        settings.setSupportZoom(true);
        settings.setBuiltInZoomControls(false);
    //settings.setLayoutAlgorithm(WebSettings.LayoutAlgorithm.SINGLE_COLUMN);
        settings.setCacheMode(WebSettings.LOAD_NO_CACHE);
        settings.setDomStorageEnabled(true);
        webview.setScrollBarStyle(WebView.SCROLLBARS_OUTSIDE_OVERLAY);
        webview.setScrollbarFadingEnabled(true);
        // NEW FOR Sound
        settings.setAllowFileAccess(true);
        if (Build.VERSION.SDK_INT > 17) {
            settings.setMediaPlaybackRequiresUserGesture(false);
        }
        // NEW FOR Sound
        settings.setAllowContentAccess(true);
        if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
            webview.setLayerType(View.LAYER_TYPE_HARDWARE, null);
        } else {
            webview.setLayerType(View.LAYER_TYPE_SOFTWARE, null);
        }
    }
}

AndroidManifest.xml

<?xml version="1.0" encoding="utf-8"?>
<manifest xmlns:android="http://schemas.android.com/apk/res/android"
package="touchscreen.com.touchscreentest">

    <application
        android:allowBackup="true"
        android:icon="@mipmap/ic_launcher"
        android:label="@string/app_name"
        android:roundIcon="@mipmap/ic_launcher_round"
        android:supportsRtl="true"
        android:theme="@style/AppTheme">
        /* The android:configChanges="orientation|screenSize"
        is needed to stop the program from reloading on an orientation     change */
        <activity android:name=".MainActivity"   android:configChanges="orientation|screenSize">
            <intent-filter>
                <action android:name="android.intent.action.MAIN" />

                <category android:name="android.intent.category.LAUNCHER"     />
            </intent-filter>
        </activity>
    </application>
</manifest>

最佳答案

正如问题中提到的，我设法回答了它。

我已经设法摆脱了嗡嗡声。它被称为触觉反馈。您可以通过将以下代码行放在我的 onCreate 的末尾来删除它功能:webview.setHapticFeedbackEnabled(false); .

我现在发现第一次触摸检查缩放和东西时有 300 毫秒的延迟。这可以通过将以下内容放入 html 文件的部分来关闭:<meta name="viewport" content="width=device-width, user-scalable=no" /> .

关于android - 使触摸屏立即响应 Html 查看器并停止 Android 在触摸屏上的振动，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/55550042/

25 4 0
文章推荐： javascript - 如何停止在同一对象上触发 'tap' 事件
文章推荐： html - document.getElementById ("componentID").clientHeight 总是在 componentDidMount() 函数中给出零
文章推荐： css - 这段 CSS 代码如何对每行文本应用不同的水平颜色渐变？
文章推荐： php - UTF-8贯穿始终
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com