Android webview 和 Twitter bootstrap 修复 navbar 无法点击

标签 android html css twitter-bootstrap

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

数周以来,我在我的应用程序中添加了许多功能,但我找不到解决此问题的方法。 一般情况下一切正常。
用户点击固定顶部导航栏中的链接,webview 加载新的 URL。

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

很抱歉,我不能在这里提供应用程序代码,但我可以尽力调试问题。我在下面粘贴了第 1、2 和 3 部分的 logcat 结果。

fiddle :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 中,我不会执行非常具体的操作。这是一个普通的 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

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

最佳答案

6 个月后,这个问题仍然存在。所以下面的回答不能解决问题。

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

我创建了一个新的 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);
    }
}

关于Android webview 和 Twitter bootstrap 修复 navbar 无法点击,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19875454/

相关文章:

html - 如何对齐固定元素内的文本?

html - "browser chrome"是什么?

java - 位于 Fragment 中的 WebView 中没有出现 ProgressBar,如何在 Android WebView 中显示 ProgressBar?

android - 将页脚添加到 CoordinatorLayout

javascript - jquery select 标签没有被带到前面

javascript - 按姓氏对数组排序

android - 您可以使用 Mac 在物理 Android 设备上测试 Android 应用程序吗?

android - gradle connectedAndroidTest如何调试junit测试执行

jquery - 附加示例中的多层 Canvas 问题

html - 如何将样式应用于按钮上显示的 HiddenField