我正在 Android 上用 HTML/JS 构建一个小游戏。我的 HTC Desire (Android 2.2) 遇到问题。当我触摸屏幕时，所有图像看起来都是像素化的，而在触摸结束时它们会变得非像素化。
这是截图：
右边是触摸屏幕的时候。有人可以帮我找出导致此问题的原因吗？
注意事项：
【问题讨论】：
标签： android cordova android-image
据我所知，“像素化”行为是针对滚动进行的优化（在 Froyo 及更高版本中）。如果渲染被简化，它会使得像弹跳滚动动画这样的东西需要更少的处理。
如果您需要完整的浏览器功能，我不确定您能帮上多少忙。
既然你说你正在制作游戏，那么我可能有一个解决方法。我希望你的游戏不需要滚动（一个全屏），所以不需要滚动优化。
我用 WebView 做了一个简单的测试。正如您所提到的，在点击时，渲染会被简化，并且看起来有点不对劲。然后，一旦单击某些内容（WebView 知道不再发生滚动），一切就会恢复正常。
我通过用 FrameLayout 替换 WebView 来修改我的布局。 FrameLayout 包含 WebView 和一个不可见的 Button（在顶部）。这个 Button 抓取所有的触摸事件。然后，我有选择地选择 WebView 应该需要哪些类型的事件，并将它们传递给 WebView。如果触地和触地靠近在一起，中间没有移动，则没有理由滚动，所以我没有看到任何“像素化”行为。
因为这个例子最简单，所以我选择检测“MotionEvent.ACTION_UP”事件，当它完成时，我先发送一个向下，这样它就可以模拟真正的点击。您当然可以在 ACTION_DOWN 上触发，但如果用户滑动或其他东西，您将获得不止一个，我想让这里的逻辑保持简单。您可以根据需要进行自定义，并且可能需要进行足够的工作，甚至在某些情况下启用滚动。我希望下面的代码足以传达我认为有效的内容。
WebView wv = new WebView(this);
View dummyView = new Button(this);
dummyView.setBackgroundColor(0x00000000);
dummyView.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
if (event.getAction() == MotionEvent.ACTION_UP) {
MotionEvent down = MotionEvent.obtain(100, 100,
MotionEvent.ACTION_DOWN, event.getX(),
event.getY(), 0);
wv.onTouchEvent(down);
wv.onTouchEvent(event);
}
return false;
}
});
FrameLayout fl = new FrameLayout(this);
fl.addView(wv);
fl.addView(dummyView);
topLayout.addView(fl);
编辑： 如果您不想编辑 PhoneGap 源，您可以执行以下操作来更改 PhoneGap 布局...它未经测试，但似乎应该可以工作：
@Override
public void onCreate(Bundle arg0) {
super.onCreate(arg0);
super.loadUrl("file:///android_asset/www/index.html");
// Get the "root" view from PhoneGap
LinearLayout droidGapRoot = super.root;
// Create a new "root" that we can use.
final LinearLayout newRoot = new LinearLayout(this);
for (int i = 0; i < droidGapRoot.getChildCount(); i++) {
// Move all views from phoneGap's LinearLayout to ours.
View moveMe = droidGapRoot.getChildAt(i);
droidGapRoot.removeView(moveMe);
newRoot.addView(moveMe);
}
// Create an invisible button to overlay all other views, and pass
// clicks through.
View dummyView = new Button(this);
dummyView.setBackgroundColor(0x00000000);
dummyView.setOnTouchListener(new OnTouchListener() {
@Override
public boolean onTouch(View v, MotionEvent event) {
// Only pass "UP" events to the specific view we care about, but
// be sure to simulate a valid "DOWN" press first, so that the
// click makes sense.
if (event.getAction() == MotionEvent.ACTION_UP) {
MotionEvent down = MotionEvent.obtain(100, 100,
MotionEvent.ACTION_DOWN, event.getX(),
event.getY(), 0);
newRoot.onTouchEvent(down);
newRoot.onTouchEvent(event);
}
return false;
}
});
// Layer the views properly
FrameLayout frameLayout = new FrameLayout(this);
frameLayout.addView(newRoot);
frameLayout.addView(dummyView);
// Add our new customized layout back to the PhoneGap "root" view.
droidGapRoot.addView(frameLayout);
}
【讨论】：
我遇到了同样的问题。您可以尝试的一件事是将 android:hardwareAccelerated="true" 添加到标签中的应用清单中。这解决了我的问题，但是现在整个应用程序在我的设备上整体看起来有点像素化，所以这可能不是最好的解决方案。
【讨论】：
检查两次您的图片是否在 CSS 中与文件本身具有相同的像素大小。它似乎有某种关系。如果我拍摄一张大图像并使用依赖于设备生成的 CSS 重新缩放它，我就会发现问题所在。否则，它要么不显示，要么不可见。不知道原来的问题是否已经在最新的 Android 中得到修复，但我仍然支持 2.3，希望对您有所帮助。
【讨论】：