jQuery Mobile的列表视图 - 幻影/不是安卓4.0更新 [英] jQuery Mobile Listview - Phantom/not refreshed in Android 4

问题描述

我看到下面的拙劣列表视图在Android模拟器（jQuery Mobile的+ PhoneGap的，安卓4.0）：

I see the following botched listview in the Android Emulator (jQuery Mobile + PhoneGap, Android 4):

当被首先显示的页时，如预期显示的列表中，但随后的内容被立即隐藏。触摸显示屏几次更新为：

When the page is first displayed, the list is displayed as expected, but then the content is immediately hidden. Touching the display a few times updates to:

该列表本身是没有什么不寻常的，即：

The list itself is nothing unusual, i.e.:

<div data-role="page" class="type-home" id="dine-around-list" data-add-back-btn="true">
    <div data-role="header" data-position="fixed" data-theme="e">
        <h1>Venue</h1>
    </div>
    <div data-role="content" class="content">
        <h3>Restaurants</h3>
        <ul data-role="listview" data-inset="true" data-theme="c" data-dividertheme="b">
            <li><a href="#dinearound1">EDGE Restaurant at The Four Seasons Denver</a></li>
            <li><a href="#dinearound3">The Ninth Door</a></li>
            <li><a href="#dinearound4">Bistro Vend&#244;me</a></li>
            <li><a href="#dinearound5">JAX Fish House &amp; Oyster Bar</a></li>
            <li><a href="#dinearound6">Venice Ristorante &amp; Wine Bar</a></li>
            <li><a href="#dinearound7">The Kitchen</a></li>
            <li><a href="#dinearound8">Capital Grille</a></li>
            <li><a href="#dinearound9">ChoLon</a></li>
            <li><a href="#dinearound10">Prima Ristorante</a></li>
            <li><a href="#dinearound11">Osteria Marco</a></li>
        </ul>
    </div>
</div>

任何想法，为什么会发生这种情况？我只在Android模拟器看到了这一点在Android 4，而不是任何其他Android版本。

Any idea why this would happen? I have only seen this on Android 4 in the Android Emulator, not on any other Android version.

更新的：一般建议是激活清单，即硬件加速：

UPDATE: General recommendation is to activate hardware acceleration in the manifest, i.e.:

<application android:icon="@drawable/icon" 
             android:label="@string/app_name" 
             android:hardwareAccelerated="true" >

您也可以做到这一点在code，即：

You can also do this in code, i.e.:

if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.ICE_CREAM_SANDWICH ){
    getWindow().addFlags(WindowManager.LayoutParams.FLAG_HARDWARE_ACCELERATED);
}

没什么区别，但。

Makes no difference though.

推荐答案

奇怪的是，除去在应用程序中使用的自定义CSS下列解决了这个问题：

Strangely, removing the following from the custom CSS used in the app solved the problem:

.ui-page { -webkit-backface-visibility: hidden; }

;及

这行是在试图消除在Android上的页面过渡闪烁（这最终被指定解决 $ mobile.defaultPageTransition ='无'前加入与它生活）。

This line was added before in an attempt to eliminate flicker during page transitions on Android (which was eventually solved by specifying $.mobile.defaultPageTransition = 'none'; and living with it).

这是一个奇怪的一个 - 解决方案似乎无关的问题。

It is an odd one - the solution seemed to have nothing to do with the problem.

这篇关于jQuery Mobile的列表视图 - 幻影/不是安卓4.0更新的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！