`
444878909
  • 浏览: 635956 次
文章分类
社区版块
存档分类
最新评论

Android混合开发之Activity类与html页面之间的相互跳转(并解决黑屏问题)

 
阅读更多

文章源地址：http://blog.csdn.net/jdfkldjlkjdl/article/details/11614291

在底部有本程序源码下载

本程序流程：程序启动-->testActivity--->phonegap2框架类--->index.html--->testActivity，主要实现activity与html页面的相互跳转，并实现 传递参数的功能。

程序结构图：




1.创建一个安卓项目，在该项目里面添加PhoneGap框架(具体步骤请点击查看)，我们知道我们在定义一个主界面的时候往往用的是Activity，这里我们先定义一个TestActivity，程


序代码如下：

[java] view plaincopyprint?
  1. packagecom.myphonegap;
  3. importandroid.app.Activity;
  4. importandroid.content.Intent;
  5. importandroid.os.Bundle;
  6. importandroid.view.View;
  7. importandroid.view.View.OnClickListener;
  8. importandroid.widget.Button;
  9. importandroid.widget.EditText;
  10. importandroid.widget.TextView;
  12. publicclassTestActivityextendsActivity{
  13. privateEditTextedittext;
  14. privateButtonbutton;
  16. @Override
  17. protectedvoidonCreate(BundlesavedInstanceState){
  18. //TODOAuto-generatedmethodstub
  19. super.onCreate(savedInstanceState);
  20. setContentView(R.layout.main);
  21. edittext=(EditText)findViewById(R.id.EditText1);
  22. button=(Button)findViewById(R.id.Button1);
  23. <spanstyle="color:#CC0000">//接收html页面参数
  24. Stringstr=getIntent().getStringExtra("name");
  25. Stringstr1=getIntent().getStringExtra("name");
  26. //将编辑框文本内容设置接收值
  27. edittext.setText(str+str1);</span>
  28. //为按钮设置绑定事件
  29. button.setOnClickListener(newOnClickListener(){
  30. publicvoidonClick(Viewv){
  31. //设置intent之间的跳转
  32. Intentintent=newIntent(TestActivity.this,
  33. PhoneGap2Activity.class);
  34. //启动intent
  35. startActivity(intent);
  36. }
  37. });
  38. }
  39. }

2.在PhoneGap2Activity里面，这个类继承的是DroidGap类，这样的话在这个activity里面就很容易跳转到一个html页面了。也就是说这个activity会跳转到

某个html页面里面。那么显示的就是跳转后html页面的内容了。我在思考怎样从跳转后的html页面回到TestActivity里面去呢，这里面就涉及到js调用java

的代码了，其实同过appView.addJavascriptInterface(obj,String str)增加一个js操作java的接口就可以了，第一个参数是类的实例，第二个参数时调用

该实例的js的名字。
下面是PhoneGap2Activity代码：
[java] view plaincopyprint?
  1. packagecom.myphonegap;
  3. importorg.apache.cordova.DroidGap;
  5. importandroid.content.Intent;
  6. importandroid.os.Bundle;
  8. publicclassPhoneGap2ActivityextendsDroidGap{
  9. /**Calledwhentheactivityisfirstcreated.*/
  10. Stringstr;
  12. @Override
  13. publicvoidonCreate(BundlesavedInstanceState){
  14. super.onCreate(savedInstanceState);
  15. super.loadUrl("file:///android_asset/www/index.html");
  16. //在该方法中增加js操作java的接口,this为当前对象，js1为操作java文件的javascript的名字
  17. <spanstyle="color:#CC0000">appView.addJavascriptInterface(this,"js1");</span>
  18. }
  20. publicvoidmethod(Stringstr,Stringstr1){
  22. Intentintent=newIntent();
  23. intent.putExtra("name",str);
  24. intent.putExtra("pass",str);
  25. intent.setClass(PhoneGap2Activity.this,TestActivity.class);
  26. startActivity(intent);
  27. }
  28. }

这时候会遇到黑屏问题：也就是当activity跳转到html之间的延迟时间，要解决这个问题，需要添加几句代码：

[java] view plaincopyprint?
  1. super.init();
  2. this.appView.setBackgroundResource(R.drawable.load);//设置背景图片
  3. super.setIntegerProperty("splashscreen",R.drawable.load);//设置闪屏背景图片
  4. super.loadUrl("file:///android_asset/www/login.html",3000);//经过测试3000毫秒比较合适
以上解决黑屏关键代码截图


修改后的代码为：

[java] view plaincopyprint?
  1. packagecom.myphonegap;
  3. importorg.apache.cordova.DroidGap;
  5. importandroid.content.Intent;
  6. importandroid.os.Bundle;
  8. publicclassPhoneGap2ActivityextendsDroidGap{
  9. /**Calledwhentheactivityisfirstcreated.*/
  10. Stringstr;
  12. @Override
  13. publicvoidonCreate(BundlesavedInstanceState){
  14. super.onCreate(savedInstanceState);
  15. <prename="code"class="java"><spanstyle="color:#CC0000">super.init();
  16. this.appView.setBackgroundResource(R.drawable.load);//设置背景图片
  17. super.setIntegerProperty("splashscreen",R.drawable.load);//设置闪屏背景图片
  18. super.loadUrl("file:///android_asset/www/login.html",3000);</span>//经过测试3000毫秒比较合适
  19. //在该方法中增加js操作java的接口,this为当前对象，js1为操作java文件的javascript的名字
  20. appView.addJavascriptInterface(this,"js1");
  21. }
  23. publicvoidmethod(Stringstr,Stringstr1){
  25. Intentintent=newIntent();
  26. intent.putExtra("name",str);
  27. intent.putExtra("pass",str);
  28. intent.setClass(PhoneGap2Activity.this,TestActivity.class);
  29. startActivity(intent);
  30. }
  31. }</pre>

3.这个html页面就是跳转后的html页面，它通过定义的js函数直接调用java方法，通过js调用PhoneGap2Activity的method方法，从而实现html页面向


TestActivity跳转的功能。----注意引入的包
[html] view plaincopyprint?
  1. <!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <metahttp-equiv="Content-Type"content="text/html;charset=UTF-8">
  5. <title>PhoneGap</title>
  6. <spanstyle="color:#CC0000"><scripttype="text/javascript"charset="utf-8"src="cordova.js"></script>
  7. <linkrel="stylesheet"type="text/css"
  8. href="css/jquery.mobile-1.3.2.min.css">
  9. <scripttype="text/javascript"charset="utf-8"src="js/jquery-1.6.4.min.js"></script>
  10. <scripttype="text/javascript"src="js/jquery.mobile-1.3.2.min.js"></script</span>>
  11. </head>
  12. <scripttype="text/javascript">
  13. $("#page").live("pagecreate",function(){
  14. $("#b").click(function(){
  15. <spanstyle="color:#CC0000">js1.method($("#text1").val(),$("#text2").val());</span>
  16. });
  17. });
  18. </script>
  19. <body>
  20. <divdata-role="page"id="page">
  21. <divdata-role="header"data-position="fixed">
  22. <h1>标题</h1>
  23. </div>
  24. <divdata-role="content">
  26. <h1>HelloWorld</h1>
  28. <aid="b"data-role="button">跳转到activity</a>
  29. 用户名:<inputtype="text"id="text1"placeholder="输入内容"/>
  30. 密码:<inputtype="text"id="text1"placeholder="输入内容"/>
  31. </div>
  32. <divdata-role="footer"data-position="fixed">
  33. <h4>脚注</h4>
  34. </div>
  35. </div>
  36. </body>
  37. </html>

注:对于上面的的例子，如果用虚拟机调试，当虚拟机版本为2.3时，可能没有结果，程序并没有问题，因为这是该版本虚拟机的bug，将版本改为2.2就可以解

决这一bug。当然，如果你用手机调试的话，就没有问题了。

运行效果图:

初始化页面如下：

初始值均为null,点击按钮进入html页面，输入用户名和密码，如下图：

点击按钮，回到TestActivity，如下图


源码下载：http://pan.baidu.com/share/link?shareid=602760443&uk=2418081758
分享到：
| android开发要点记录
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics