Android webview 和 Twitter bootstrap 修复导航栏无法点击

Question

我使用 Twitter Bootstrap 3 和固定顶部导航栏。
我的 android 应用程序中有一个 Webview。

我为我的应用添加了许多功能已有数周时间，但我找不到解决此问题的方法。 一切正常。
用户单击固定顶部导航栏中的链接，webview 会加载新的 URL。

但是当
* 用户加载网页
* 然后转到页面底部
* 转到页面顶部
[第 1 部分开始]
* 用户点击导航栏链接
* 导航栏链接无法点击
* 链接不响应
[第 2 部分开始]
* 用户向下滚动页面的量非常小（比如 1-2 毫米。）
* 垂直滚动条出现在右侧
[第 3 部分开始]
* 用户点击链接
* 导航栏链接是可点击的。

很抱歉，我无法在此处提供应用程序代码，但我可以尽力解决问题。我在下面粘贴了 PART 1、2 和 3 的 logcat 结果。

小提琴：http://jsfiddle.net/mavent/X3THf/19/

<nav class="navbar navbar-inverse navbar-fixed-top visible-xs" role="navigation">
    <div class="navbar-header" style="text-align:center;">
        <button type="button" class="navbar-toggle pull-left" data-toggle="collapse" data-target=".navbar-part2"> <span class="sr-only">Toggle navigation</span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>
 <span class="icon-bar"></span>

        </button>
        <button type="button" class="navbar-toggle pull-right" data-toggle="collapse" data-target=".navbar-part3" style="padding: 3px 15px;">
            <img src="http://www.wdc.com/Global/images/icons/icon_supporthelp.gif" width="24" height="24" alt="aaaa">
        </button>
        <div style="padding-top: 15px;"> <a href="/page0" title="aaa" style="color:#ffffff;margin-top:40px;">Example.com</a>

        </div>
    </div>
    <div class="collapse navbar-collapse navbar-part2">
        <ul class="nav navbar-nav">
            <li><a href="/page1">page 1</a>

            </li>
            <li><a href="/page2">page 2</a>

            </li>
        </ul>
    </div>
    <div class="collapse navbar-collapse navbar-part3">
        <ul class="nav navbar-nav">
            <li><a href="/page3">page 3</a>

            </li>
            <li><a href="/page4">page 4</a>

            </li>
        </ul>
    </div>

在我的网络视图中，我没有做出非常具体的操作。这是一个常见的webview。

mWebView = (WebView) findViewById(R.id.webview);
mWebView.setWebChromeClient(new myWebChromeClient());
mWebView.setWebViewClient(new myWebViewClient());
mWebView.getSettings().setJavaScriptEnabled(true);
String defaultUserAgent = mWebView.getSettings().getUserAgentString();
mWebView.getSettings().setUserAgentString(defaultUserAgent+" my app");

.

[PART 1]
11-09 13:27:03.522  17315-17355/com.example.android E/webcoreglue﹕ Should not happen: no rect-based-test nodes found
11-09 13:27:03.612  17315-17315/com.example.android V/WebViewInputDispatcher﹕ blockWebkitDraw
11-09 13:27:03.612  17315-17315/com.example.android V/WebViewInputDispatcher﹕ blockWebkitDraw lockedfalse
11-09 13:27:03.622  17315-17315/com.example.android V/webview﹕ singleCursorHandlerTouchEvent -getEditableSupport  FASLE
11-09 13:27:03.923  17315-17355/com.example.android D/webview﹕ blockWebkitViewMessage= false

[PART 2]
11-09 13:27:32.711  17315-17315/com.example.android V/WebViewInputDispatcher﹕ blockWebkitDraw
11-09 13:27:32.711  17315-17315/com.example.android V/WebViewInputDispatcher﹕ blockWebkitDraw lockedfalse
11-09 13:27:32.711  17315-17315/com.example.android V/webview﹕ singleCursorHandlerTouchEvent -getEditableSupport  FASLE

[PART 3]
11-09 13:27:42.650  17315-17315/com.example.android V/WebViewInputDispatcher﹕ blockWebkitDraw
11-09 13:27:42.650  17315-17315/com.example.android V/WebViewInputDispatcher﹕ blockWebkitDraw lockedtrue
11-09 13:27:42.650  17315-17315/com.example.android V/webview﹕ singleCursorHandlerTouchEvent -getEditableSupport  FASLE
11-09 13:27:42.961  17315-17355/com.example.android D/webview﹕ blockWebkitViewMessage= false
11-09 13:27:48.176  17315-17355/com.example.android I/GATE﹕ <GATE-M>DEV_ACTION_COMPLETED</GATE-M>
11-09 13:27:48.256  17315-17315/com.example.android W/IInputConnectionWrapper﹕ getSelectedText on inactive InputConnection
11-09 13:27:48.256  17315-17315/com.example.android W/IInputConnectionWrapper﹕ setComposingText on inactive InputConnection
11-09 13:27:48.256  17315-17315/com.example.android W/IInputConnectionWrapper﹕ getExtractedText on inactive InputConnection

所以每次导航栏链接不起作用时，用户必须在页面上滚动一些然后点击链接。

Answer 1

6 个月后，此问题仍然存在。所以下面的答案并不能解决问题。

原因是果冻豆的错误。有一个完美的解决方法。

我创建了一个新的 WebView 类，并使用了 myWebView 类而不是默认的 WebView 类。 这个话题对我帮助很大：Android WebView JellyBean -> Should not happen: no rect-based-test nodes found

public class MyWebView extends WebView
{
    Context mContext;

    public MyWebView(Context context)
    {
        super(context);
        mContext = context;
    }

    public MyWebView(Context context, AttributeSet attrs)
    {
        super(context, attrs);
        mContext = context;
    }

    public MyWebView(Context context, AttributeSet attrs, int defStyle)
    {
        super(context, attrs, defStyle);
        mContext = context;
    }

    @Override
    public boolean onTouchEvent(MotionEvent event) {
        if (event.getAction() == MotionEvent.ACTION_DOWN){

            int temp_ScrollY = getScrollY();
            scrollTo(getScrollX(), getScrollY() + 1);
            scrollTo(getScrollX(), temp_ScrollY);
        }
        return super.onTouchEvent(event);
    }
}

Answer 2

我从您 6 月 4 日的编辑中得知问题仍然存在，可能是由于 Android JB 中的问题。

即使在 Android 中不是问题，bootstrap 3 也不支持 JB 中的 webview 使用的 Android 浏览器。

我知道的唯一解决方案是使用Intel's crosswalk project（可能通过 Cordova 或 Google 的 CCA）将当前版本的 Chromium 捆绑为您的 webview，而不是取决于平台的 webview、功能和怪癖这取决于 Android 版本。

这样做的缺点是额外的 18MB，我敢肯定你不想要，但这样你的应用在所有版本的 Android 上都可以获得一致的 webview。