1

我正在尝试将 html 文件加载到 BrowserField 中。

html 文件位于 res 文件夹内。

在此处输入图像描述

这就是我构建 browserField 对象的方式：

InputStream content = getClass().getResourceAsStream("/www/html/welcome2.html");     
try {
   byte[] html = IOUtilities.streamToBytes(content);
   BrowserFieldConfig config = new BrowserFieldConfig();
   HttpHeaders headers = new HttpHeaders();
   headers.addProperty(HttpHeaders.HEADER_CONTENT_TYPE, HttpHeaders.CONTENT_TYPE_TEXT_HTML);
   headers.addProperty(HttpHeaders.HEADER_ACCEPT_CHARSET, "UTF-8");
   config.setProperty(BrowserFieldConfig.HTTP_HEADERS, headers);
   BrowserField contentField = new BrowserField(config);
   vfm_r.add(contentField);

   contentField.displayContent(new String(html), "http://localhost");
} catch (IOException e) {
   e.printStackTrace();
}

这是html文件：

<html>
    <head>
        <meta charset="UTF-8">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" />
        <link rel="stylesheet" href="../css/style-preferential.css">

    </head>
    <body id="welcome-page">
        <div class="welcome-header"></div>

        <div id="welcome-access-container">
            <span>acceder mi cuenta</span>
        </div>

        <div id="owl-demo" class="owl-carousel owl-theme">
            <div class="item"><span>Contact</span></div>
            <div class="item"><span>Option 1</span></div>
            <div class="item"><span>Option 2</span></div>
            <div class="item"><span>Option 3</span></div>
            <div class="item"><span>Option 4</span></div>
            <div class="item"><span>Option 5</span></div>
        </div>
        <div id="image-carousel" class="owl-carousel owl-theme">
            <div class="banner"><img src="../img/brown.png"></div>
            <div class="banner"><img src="../img/orange.png"></div>
            <div class="banner"><img src="../img/pink.png"></div>
            <div class="banner"><img src="../img/green.png"></div>
            <div class="banner"><img src="../img/blue.png"></div>
        </div>
        <div class="footer">
            <div id="info-footer"><span>Lorem ipsum dolor sit amet</span></div>
        </div>
    </body>
</html>

问题是 browserField 需要大约 2 分钟才能完成加载，并且从未应用样式。

当我删除对 css 的导入时

<link rel="stylesheet" href="../css/style-preferential.css">

browserField 会立即加载页面。

1）我应该怎么做才能防止导入样式时页面加载的长时间延迟。

2）我应该怎么做才能让browserField识别css？。现在，正如我所提到的，html 在长时间延迟后呈现，但未应用样式。

提前致谢。

4

1 回答 1

2

这里的问题不是 BrowserField 不能识别 css，而是 BlackBerry 没有找到 css。它会花一些时间寻找 localhost 作为资源，因为 BlackBerry 设备不会将 localhost 识别为它们自己，而且事实上它们并没有真正的 IP 地址，除非它们连接了 WiFi。

您看到的 2 分钟延迟是 BB 设备尝试查找 localhost。

因此，您需要使用“local:”“协议”，以便浏览器知道要拾取本地文件。

这是一些适用于我的示例代码。试试看，然后玩一圈得到你想要的：

body { color: green; }
.item {
    color: blue;
    background-color: red;
}

以上是我的测试“style-preferential.css”文件。 

<html>
    <head>
        <meta charset="UTF-8">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="viewport" content="width=device-width, minimum-scale=1, maximum-scale=1" />
        <link rel="stylesheet" href="/www/css/style-preferential.css">
    </head>
    <body id="welcome-page">
        <div class="welcome-header"></div>
        <div id="welcome-access-container">
            <span>acceder mi cuenta</span>
        </div>
        <div id="owl-demo">
            <div class="item">Contact1</div>
            <div class="item"><span>Option 1</span></div>
            <div class="item"><span>Option 2</span></div>
            <div class="item"><span>Option 3</span></div>
            <div class="item"><span>Option 4</span></div>
            <div class="item"><span>Option 5</span></div>
        </div>
        <div class="banner"><img src="/img/icon.png"></div>
        <div class="footer">
            <div id="info-footer"><span>Lorem ipsum dolor sit amet</span></div>
        </div>
    </body>
</html>

以上是我对您的测试 html 的精简版。

最后，这是我对您的代码所做的更改：

contentField.displayContent(new String(html), "local:///");

我的项目如下所示：

资源结构

输出如下所示：

BB结果

于 2014-03-20T14:37:18.210 回答