標籤：android style c class code java
Android混合開發之Activity類與html頁面之間的相互跳轉(並解決黑屏問題)
在底部有本程式源碼下載
本程式流程：程式啟動-->testActivity--->phonegap2架構類--->index.html--->testActivity，主要實現activity與html頁面的相互跳轉，並實現 傳遞參數的功能。
程式結構圖：
1.建立一個安卓項目，在該項目裡面添加PhoneGap架構(具體步驟請點擊查看)，我們知道我們在定義一個主介面的時候往往用的是Activity，這裡我們先定義一個TestActivity，程
序代碼如下：
package com.myphonegap;import android.app.Activity;import android.content.Intent;import android.os.Bundle;import android.view.View;import android.view.View.OnClickListener;import android.widget.Button;import android.widget.EditText;import android.widget.TextView;public class TestActivity extends Activity {private EditText edittext;private Button button;@Overrideprotected void onCreate(Bundle savedInstanceState) {// TODO Auto-generated method stubsuper.onCreate(savedInstanceState);setContentView(R.layout.main);edittext = (EditText) findViewById(R.id.EditText1);button = (Button)findViewById(R.id.Button1);// 接收html頁面參數String str = getIntent().getStringExtra("name");String str1 = getIntent().getStringExtra("name");//將編輯框常值內容設定接收值edittext.setText(str+str1);//為按鈕設定綁定事件button.setOnClickListener(new OnClickListener() {public void onClick(View v) {// 設定intent之間的跳轉Intent intent = new Intent(TestActivity.this,PhoneGap2Activity.class);//啟動intentstartActivity(intent);}});}}
2.在PhoneGap2Activity裡面，這個類繼承的是DroidGap類，這樣的話在這個activity裡面就很容易跳轉到一個html頁面了。也就是說這個activity會跳轉到
某個html頁面裡面。那麼顯示的就是跳轉後html頁面的內容了。我在思考怎樣從跳轉後的html頁面回到TestActivity裡面去呢，這裡面就涉及到js調用java
的代碼了，其實同過appView.addJavascriptInterface(obj,String str)增加一個js操作java的介面就可以了，第一個參數是類的執行個體，第二個參數時調用
該執行個體的js的名字。
下面是PhoneGap2Activity代碼：
package com.myphonegap;import org.apache.cordova.DroidGap;import android.content.Intent;import android.os.Bundle;public class PhoneGap2Activity extends DroidGap {/** Called when the activity is first created. */String str;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);super.loadUrl("file:///android_asset/www/index.html"); //在該方法中增加js操作java的介面,this為當前對象，js1為操作java檔案的javascript的名字 appView.addJavascriptInterface(this, "js1");}public void method(String str,String str1) {Intent intent = new Intent();intent.putExtra("name", str);intent.putExtra("pass", str);intent.setClass(PhoneGap2Activity.this, TestActivity.class);startActivity(intent);}}
這時候會遇到黑屏問題：也就是當activity跳轉到html之間的延遲時間，要解決這個問題，需要添加幾句代碼：
super.init(); this.appView.setBackgroundResource(R.drawable.load);//設定背景圖片 super.setIntegerProperty("splashscreen",R.drawable.load ); //設定閃屏背景圖片 super.loadUrl("file:///android_asset/www/login.html",3000); //經過測試3000毫秒比較合適
以上解決黑屏關鍵代碼
修改後的代碼為：
package com.myphonegap;import org.apache.cordova.DroidGap;import android.content.Intent;import android.os.Bundle;public class PhoneGap2Activity extends DroidGap {/** Called when the activity is first created. */String str;@Overridepublic void onCreate(Bundle savedInstanceState) {super.onCreate(savedInstanceState);
super.init(); this.appView.setBackgroundResource(R.drawable.load);//設定背景圖片 super.setIntegerProperty("splashscreen",R.drawable.load ); //設定閃屏背景圖片 super.loadUrl("file:///android_asset/www/login.html",3000); //經過測試3000毫秒比較合適 //在該方法中增加js操作java的介面,this為當前對象，js1為操作java檔案的javascript的名字 appView.addJavascriptInterface(this, "js1");}public void method(String str,String str1) {Intent intent = new Intent();intent.putExtra("name", str);intent.putExtra("pass", str);intent.setClass(PhoneGap2Activity.this, TestActivity.class);startActivity(intent);}}
3.這個html頁面就是跳轉後的html頁面，它通過定義的js函數直接調用java方法，通過js調用PhoneGap2Activity的method方法，從而實現html頁面向
TestActivity跳轉的功能。----注意引入的包
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd"><html><head><meta http-equiv="Content-Type" content="text/html; charset=UTF-8"><title>PhoneGap</title><script type="text/javascript" charset="utf-8" src="cordova.js"></script><link rel="stylesheet" type="text/css"href="css/jquery.mobile-1.3.2.min.css"><script type="text/javascript" charset="utf-8" src="js/jquery-1.6.4.min.js"></script><script type="text/javascript" src="js/jquery.mobile-1.3.2.min.js"></script></head><script type="text/javascript">$("#page").live("pagecreate",function(){$("#b").click(function() {js1.method($("#text1").val(),$("#text2").val());});});</script><body><div data-role="page" id="page"><div data-role="header" data-position="fixed"><h1>標題</h1></div><div data-role="content"><h1>Hello World</h1><a id="b" data-role="button" >跳轉到activity</a> 使用者名稱:<input type="text" id="text1" placeholder="輸入內容" />密 碼:<input type="text" id="text1" placeholder="輸入內容" /></div><div data-role="footer" data-position="fixed"><h4>腳註</h4></div></div></body></html>
注:對於上面的的例子，如果用虛擬機器調試，當虛擬機器版本為2.3時，可能沒有結果，程式並沒有問題，因為這是該版本虛擬機器的bug，將版本改為2.2就可以解
決這一bug。當然，如果你用手機調試的話，就沒有問題了。
運行:
初始化頁面如下：
初始值均為null,點擊按鈕進入html頁面，輸入使用者名稱和密碼，如：
點擊按鈕，回到TestActivity，如
源碼下載：http://pan.baidu.com/share/link?shareid=602760443&uk=2418081758
本文來自：http://www.myexception.cn/HTML-CSS/1403290.html
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
