phonegap-网络访问与调用android手机硬件设备

最新推荐文章于 2019-06-19 21:58:15 发布

AdrianRD

最新推荐文章于 2019-06-19 21:58:15 发布

阅读量1k

点赞数 1

分类专栏： phonegap开发文章标签： phonegap- iframe的全屏显示 android

本文链接：https://blog.csdn.net/adrian_rendong/article/details/49963895

版权

phonegap开发专栏收录该内容

5 篇文章 0 订阅

订阅专栏

phonegap开发简述

使用phonegap包开发的目的就是为了缩短开发周期，利用熟悉的HTML、javascript、CSS技术快速的打造自己的客户端APP。其中存在的关键问题是：这些HTML、CSS、js的文件是放在服务器端还是放在移动端。如果是放在移动端，这无疑的没有发挥出javascript的优势，在“数据走向云端”的大趋势下这种方式终将无立足之地。所以我们还是选择将大量的网页数据放在服务器端。

这么做就又有一个问题了。如果我们把这个APP做成是打开运行之后就直接访问外部网站，那么这个APP就等同于一个网页链接的桌面版。而且这样也不方便或是说不可以通过服务器远程调用android手机的硬件设备，因为它的HTML里面没有cordova.js包。如果在服务器端的HTML里面就导入cordova.js，这种方式不知道行不行得通。

直接访问外部网站

如果是想要打开APP之后就直接访问外部网站，可进行如下操作

打开MainActivity.java文件

将里面onCreate方法中的程序替换成如下代码

super.onCreate(savedInstanceState);

//实例化WebView对象
WebView webview = new WebView( this);
//设置WebView属性，能够执行Javascript脚本
webview.getSettings().setJavaScriptEnabled( true);
webview.getSettings().setSupportZoom(true); // 支持缩放
webview.getSettings().setLoadWithOverviewMode( true);
webview.getSettings().setUseWideViewPort(true);

webview.getSettings().setBuiltInZoomControls(true);//支持手势缩放

try {
//设置打开的页面地址。设置成自己需要访问网站的IP
webview.loadUrl( "http://blog.csdn.net/adrian_rendong/article/details/49950553" );
}
catch (Exception ex)
{
ex.printStackTrace();
}

setContentView(webview);

然后添加网络访问权限

在AndroidManifest.xml文件中添加

<uses-permission android:name="android.permission.INTERNET"/>

在本地HTML中访问外部网站

打开MainActivity.java文件

将里面onCreate方法中的程序替换成如下代码

super.onCreate(savedInstanceState);

super.loadUrl("file:///android_asset/www/index.html" );

然后添加网络访问权限

在AndroidManifest.xml文件中添加

<uses-permission android:name="android.permission.INTERNET"/>

编写HTML

打开index.js替换成如下代码

<!DOCTYPE html>
<html>
<head>
<title>Capture Photo</title>

<script type="text/javascript" charset="utf-8" src="cordova.js"></script>

<script type="text/javascript" charset="utf-8">

document.addEventListener("deviceready",onDeviceReady,false);

alert("进入run2D");

</script>
</head>

<body margin=0;>

<iframe src="http://192.168.0.100:9010/IDE/application/run2D.html#" style="position:fixed;

top:0px; left:0px; bottom:0px; right:0px; width:100%; height:100%; border:none;

margin:0; padding:0; overflow:hidden; z-index:999999;">

</iframe>

</body>

</html>

iframe的全屏显示

范例