0

嘿，Stackoverflow！

我正在尝试创建一个使用 WebView 来显示 JavaScript 小部件的应用程序，但我似乎遇到了一堵墙，我根本无法让小部件显示。我已经做了相当多的研究，我认为我正在尝试做的事情是可能的。

这是我的主要活动

public class WebViewAppTestActivity extends Activity {
/** Called when the activity is first created. */
@Override
public void onCreate(Bundle savedInstanceState) {
    super.onCreate(savedInstanceState);
    setContentView(R.layout.main);

    //grab the webview
    WebView webview = (WebView) findViewById(R.id.webview);

  //grab the webview settings
    WebSettings websettings = webview.getSettings();

    //enable javascript
    websettings.setJavaScriptEnabled(true);

    //add a js interface to display the widgets
    webview.addJavascriptInterface(new JavaScriptInterface(this), "Android");

    //load a webpage
    webview.loadUrl("file:///android_asset/javascript/index.html");


}

}

它加载看起来像这样的文件 index.html

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width; user-scalable=0;" />
<title>WebView test!</title>
</head>
<body>
<h1>MyHTML</h1>

<div id="panel">
<section class="episode"></section>
</div>

<script src="https://sourceurl1.js" />
<script src="https://sourceurl2.js" />
<script src="https://sourceurl3.js" />
<script src="https://sourceurl4.js" />

<script src="./widget.js" />
<script src="./top-episodes.js" />
<script>
  var TopEpisodes = new Company.TopEpisodes({
  $element: $('#panel section.episodes')
  });
  TopEpisodes.init({
         mode      : 'realtime',
         range     : { from: 1341911040, to: 1341907200 },
         path      : ["4FB159EB613033AA710006DF"],
         isEpisode : true
  });
</script>
</html>

</body>
</html>

当我测试我的应用程序（Nexus S 4G ICS 4.0.4）时，唯一显示的是空白屏幕上的 MyHTML 标头。在 xml 中启用 Internet 访问。

我是否需要为 WebView 设置启用其他功能，或者我的 HTML 文件看起来真的有问题？我是否需要在 JS 接口中使用 addJavaScriptInterface 方法？

无论如何，我非常坚持并愿意接受任何建议！感谢您的时间！

编辑几天来没有对此问题的任何回应，让我知道是否有任何我可以做的事情来澄清这个问题或任何其他有帮助的细节！或者，如果它甚至是可能的。谢谢！

4

2 回答 2

2

您的 HTML 错误，<script src="<location of js>" /> 您没有正确指向位置，

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width; user-scalable=0;" />
<title>WebView test!</title>
</head>
<body>
<h1>MyHTML</h1>

<div id="panel">
<section class="episode"></section>
</div>
<!-- Below is the code if the js in the same location of your index.html file. -->
<script src="sourceurl1.js" />
<script src="sourceurl2.js" />
<script src="sourceurl3.js" />
<script src="sourceurl4.js" />

<!-- Below is the code if the js is outside the location of your index.html file. -->  
<script src="../widget.js" />

<!-- Below is the code if the js is outside the location of your index.html file., inside folder js-->  
<script src="../js/top-episodes.js" />
<script>
  var TopEpisodes = new Company.TopEpisodes({
  $element: $('#panel section.episodes')
  });
  TopEpisodes.init({
         mode      : 'realtime',
         range     : { from: 1341911040, to: 1341907200 },
         path      : ["4FB159EB613033AA710006DF"],
         isEpisode : true
  });
</script>
</html>

为了帮助您更多，请指定文件的位置

于 2012-07-13T16:31:58.227 回答
0

因此，由于我缺乏 HTML 和 Javascript 方面的经验，我决定对我的应用程序采取不同的方向。

相反，我将使用此图表库在 Java 中本地开发小部件：http: //achartengine.org/，然后使用 HttpClient 更新数据，而不是在 Javascript 中的 WebView 中创建它，因为我认为这个解决方案将是Android 应用程序更轻松、更快捷。

谢谢大家的时间！

于 2012-07-13T22:32:35.557 回答