欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

Android開發(fā)方式之Java+html+javascript混合開發(fā)

 更新時間：2016年06月08日 09:41:14   作者：_江南一點(diǎn)雨  
這篇文章主要為大家詳細(xì)介紹了Android開發(fā)方式的其中一種Java+html+javascript混合開發(fā)，感興趣的小伙伴們可以參考一下

android開發(fā)，除了使用原生態(tài)的開發(fā)方式之外，還可以使用java+html+javascript混合開發(fā)的方式來開發(fā)，這樣可以節(jié)省大量的開發(fā)時間，同時還可以使不同設(shè)備的用戶獲得相同的用戶體驗(yàn)。好了，廢話不多說，先來看看今天要做什么。
主要是實(shí)現(xiàn)一個簡單的注冊功能，先用jquery mobile的方式寫一個簡單的注冊頁面，點(diǎn)擊提交按鈕之后跳轉(zhuǎn)到一個新的activity中，同時把用戶的注冊信息顯示出來，整體效果如下圖：

這里寫圖片描述

這個頁面完全用html+jquery寫成，它的最下面有一個提交按鈕，點(diǎn)擊提交按鈕之后該頁面的所有注冊信息傳遞到下一個activity中。

這里寫圖片描述

這個界面是完全用android原生態(tài)的方式來開發(fā)。ok,下面一步一步來說。

新建一個名叫webViewTest的工程，在assets文件夾中新建一個文件叫做index.html,index.html文件代碼如下：

<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>無標(biāo)題文檔</title>
<link  rel="stylesheet" type="text/css">
<script src="http://code.jquery.com/jquery-1.6.4.min.js" type="text/javascript"></script>
<script src="http://code.jquery.com/mobile/1.0/jquery.mobile-1.0.min.js" type="text/javascript"></script>
</head>

<body>
<script>
 $(function(){
  $("#commit").click(function(){
   var result = "{";
   result +="\"username\":\"";
   result +=$("#username").val();

   result +="\",\"password\":\"";
   result +=$("#password").val();

   result += "\",\"gender\":\"";
   result += $('input[name="radio1"]:checked').val();

   result += "\",\"interest\":\"";
   $('input[name="checkbox1"]:checked').each(function() {
    result += $(this).val()+",";
   });

   result += "\",\"country\":\"";
   result += $("#selectmenu option:selected").text()+"\"}";
   register_js.register(result);
   });

  });
</script>
<div data-role="page" id="page">
 <div data-role="header">
 <h1>標(biāo)題</h1>
 </div>
 <div data-role="content">
 <ul data-role="listview" data-inset="true">
  <li data-role="list-divider">
  注冊
  </li>
  <li>
   <div data-role="fieldcontain">
   <label for="username">用戶名:</label>
   <input type="text" name="textinput" id="username" value="張三" />
   </div></li><li>
   <div data-role="fieldcontain">
   <label for="password">密碼:</label>
   <input type="password" name="textinput" id="password" value="zhangsan" />
   </div></li><li>
   <div data-role="fieldcontain">
   <fieldset data-role="controlgroup" data-type="horizontal">
    <legend>性別:</legend>
    <input type="radio" name="radio1" id="man" value="0" />
    <label for="man">男</label>
    <input type="radio" name="radio1" id="woman" value="1" />
    <label for="woman">女</label>
   </fieldset>
   </div></li><li>
   <div data-role="fieldcontain">
   <fieldset data-role="controlgroup" data-type="horizontal">
    <legend>愛好</legend>
    <input type="checkbox" name="checkbox1" id="football" class="custom" value="0" />
    <label for="football">足球</label>
    <input type="checkbox" name="checkbox1" id="basketball" class="custom" value="1" />
    <label for="basketball">籃球</label>
    <input type="checkbox" name="checkbox1" id="vollyball" class="custom" value="2" />
    <label for="vollyball">排球</label>
   </fieldset>
   </div>
  </li>
  <li>
   <div data-role="fieldcontain">
   <label for="selectmenu" class="select">國籍:</label>
   <select name="selectmenu" id="selectmenu">
    <option value="China">中國</option>
    <option value="America">美國</option>
    <option value="Japan">小日本</option>
   </select>
   </div>

  </li>
  <li>
   <button id="commit">提交</button>

  </li>
 </ul>
 </div>
 <div data-role="footer" data-position="fixed">
 <h4>腳注</h4>
 </div>
</div>
</body>
</html>

這里全部都是jquerymobile的知識，前面三行是引用jquery和jquerymobile的js文件以及jqueryMobile的css樣式文件。當(dāng)點(diǎn)擊button時，執(zhí)行js代碼，js代碼獲取每一項(xiàng)的值，同時拼湊成一個json字符串，然后執(zhí)行register_js.register(result);方法，這是一個什么方法呢？這是一會加載這個html的activity中的一個名叫register的方法，result是這個方法的參數(shù)，至于前面為什么是register_js，我們一會再說。

再看看加載這個html的activity長什么樣子，先看看它的布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 tools:context="com.example.webviewtest.MainActivity" >

 <WebView 
  android:id="@+id/wv1"
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  />

</LinearLayout>

它的布局文件中就一個控件，webView.

再來看看Java代碼：

package com.example.webviewtest;

import android.app.Activity;
import android.content.Intent;
import android.os.Bundle;
import android.webkit.WebView;

public class MainActivity extends Activity {

 private WebView wv;
 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  setContentView(R.layout.activity_main);

  wv = (WebView) this.findViewById(R.id.wv1);
  wv.getSettings().setJavaScriptEnabled(true);
  wv.loadUrl("file:///android_asset/index.html");
  wv.addJavascriptInterface(this, "register_js");
 }

 public void register(String userInfo){
  Intent intent = new Intent(MainActivity.this,RegisterActivity.class);
  intent.putExtra("userinfo", userInfo);
  this.startActivity(intent);
 }
}

先拿到一個webview，然后wv.getSettings().setJavaScriptEnabled(true);表示允許執(zhí)行js代碼，wv.loadUrl("file:///android_asset/index.html");表示把剛才的html文件加載進(jìn)來，注意文件路徑，項(xiàng)目中是assets文件夾，并不是android_assets，wv.addJavascriptInterface(this, "register_js");表示創(chuàng)建一個對象傳遞給webview，作為js對象，這里把這個activity傳遞給webview，名稱叫做register_js，所以在js中執(zhí)行這個activity中的方法時前面要加上register_js，當(dāng)然，你可以傳遞任何一個類的實(shí)例作為js對象，這樣就可以在js中調(diào)用該類的方法了。public void register(String userInfo)方法就是點(diǎn)擊html中的提交按鈕時執(zhí)行的方法了，該方法跳轉(zhuǎn)將執(zhí)行跳轉(zhuǎn)到另一個activity中，并攜帶用戶注冊數(shù)據(jù)。

再來看看registerActivity的布局文件：

<LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"
 xmlns:tools="http://schemas.android.com/tools"
 android:layout_width="match_parent"
 android:layout_height="match_parent"
 android:orientation="vertical"
 tools:context="com.example.webviewtest.MainActivity" >

 <TextView 
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:text="注冊成功，您的注冊信息是："
  android:textSize="30dp"
  />
 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal" >

  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="用戶名："
   android:textSize="25sp" />

  <TextView
   android:id="@+id/username"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textSize="25sp" />
 </LinearLayout>

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal" >

  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="密碼："
   android:textSize="25sp" />

  <TextView
   android:id="@+id/password"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textSize="25sp" />
 </LinearLayout>

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal" >

  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="性別："
   android:textSize="25sp" />

  <TextView
   android:id="@+id/gender"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textSize="25sp" />
 </LinearLayout>

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal" >

  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="愛好："
   android:textSize="25sp" />

  <TextView
   android:id="@+id/interest"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textSize="25sp" />
 </LinearLayout>

 <LinearLayout
  android:layout_width="match_parent"
  android:layout_height="wrap_content"
  android:orientation="horizontal" >

  <TextView
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:text="國籍："
   android:textSize="25sp" />

  <TextView
   android:id="@+id/country"
   android:layout_width="wrap_content"
   android:layout_height="wrap_content"
   android:textSize="25sp" />
 </LinearLayout>
</LinearLayout>

RegisterActivity的Java代碼：

package com.example.webviewtest;

import org.json.JSONException;
import org.json.JSONObject;

import android.app.Activity;
import android.os.Bundle;
import android.widget.TextView;

public class RegisterActivity extends Activity {

 private TextView username, password, interest, country, gender;

 @Override
 protected void onCreate(Bundle savedInstanceState) {
  super.onCreate(savedInstanceState);
  this.setContentView(R.layout.register_activity);
  this.username = (TextView) this.findViewById(R.id.username);
  this.password = (TextView) this.findViewById(R.id.password);
  this.interest = (TextView) this.findViewById(R.id.interest);
  this.country = (TextView) this.findViewById(R.id.country);
  this.gender = (TextView) this.findViewById(R.id.gender);
  String userinfo = this.getIntent().getExtras().getString("userinfo");
  try {
   JSONObject json = new JSONObject(userinfo);
   username.setText(json.getString("username"));
   password.setText(json.getString("password"));
   interest.setText(json.getString("interest").replace("0", "足球")
     .replace("1", "籃球").replace("2", "排球"));
   country.setText(json.getString("country").replace("0", "中國")
     .replace("1", "美國").replace("2", "小日本"));
   gender.setText(json.getString("gender").replace("0", "男")
     .replace("1", "女"));
  } catch (JSONException e) {
   e.printStackTrace();
  }
 }
}

這些都是常規(guī)的android開發(fā)代碼，我就不多解釋了。
另外，還要在布局文件中添加以下權(quán)限：

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

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

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

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

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

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

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

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

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

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

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

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

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

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

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

關(guān)于混合開發(fā)這一塊涉及內(nèi)容太多，我后面會陸續(xù)寫文介紹。

原文鏈接：http://blog.csdn.net/u012702547/article/details/45727329

源碼下載：http://xiazai.jb51.net/201606/yuanma/webViewTest(jb51.net).rar

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

相關(guān)文章

  • Android實(shí)現(xiàn)美女拼圖游戲詳解

    Android實(shí)現(xiàn)美女拼圖游戲詳解

    這篇文章給大家用實(shí)例介紹了利用Android如何實(shí)現(xiàn)美女拼圖游戲，對大家開發(fā)拼圖游戲具有一定的參考借鑒價值，感興趣的朋友們一起來看看吧。
    2016-09-09
  • android商戶掃碼槍讀取手機(jī)二維碼

    android商戶掃碼槍讀取手機(jī)二維碼

    這篇文章主要為大家詳細(xì)介紹了android商戶掃碼槍讀取手機(jī)二維碼，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2021-09-09
  • Android開發(fā)之React Navigation 導(dǎo)航欄樣式調(diào)整+底部角標(biāo)消息提示

    Android開發(fā)之React Navigation 導(dǎo)航欄樣式調(diào)整+底部角標(biāo)消息提示

    這篇文章主要介紹了React Navigation 導(dǎo)航欄樣式調(diào)整+底部角標(biāo)消息提示的相關(guān)知識，非常不錯，具有一定的參考借鑒價值 ,需要的朋友可以參考下
    2019-05-05
  • Android編程中黑名單的實(shí)現(xiàn)方法

    Android編程中黑名單的實(shí)現(xiàn)方法

    這篇文章主要介紹了Android編程中黑名單的實(shí)現(xiàn)方法,結(jié)合實(shí)例形式詳細(xì)分析了Android通過對比通信錄及自動掛斷電話等技巧實(shí)現(xiàn)黑名單功能的功能,需要的朋友可以參考下
    2016-02-02
  • Android?TabLayout?自定義樣式及使用詳解

    Android?TabLayout?自定義樣式及使用詳解

    這篇文章主要為大家介紹了Android?TabLayout?自定義樣式及使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2022-09-09
  • Android?Jetpack組件ViewModel基本用法詳解

    Android?Jetpack組件ViewModel基本用法詳解

    這篇文章主要為大家介紹了Android?Jetpack組件ViewModel基本用法詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪
    2023-01-01
  • Android自定義Animation實(shí)現(xiàn)View搖擺效果

    Android自定義Animation實(shí)現(xiàn)View搖擺效果

    這篇文章主要為大家詳細(xì)介紹了Android自定義Animation實(shí)現(xiàn)View搖擺效果，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2017-01-01
  • TabLayout關(guān)聯(lián)ViewPager后不顯示文字的解決方法

    TabLayout關(guān)聯(lián)ViewPager后不顯示文字的解決方法

    這篇文章主要為大家詳細(xì)介紹了TabLayout關(guān)聯(lián)ViewPager后不顯示文字的解決方法，具有一定的參考價值，感興趣的小伙伴們可以參考一下
    2017-11-11
  • Android中正確使用字體圖標(biāo)(iconfont)的方法

    Android中正確使用字體圖標(biāo)(iconfont)的方法

    IconFont字體不僅僅流行于Web開發(fā)，在移動開發(fā)中也漸漸的使用的范圍更廣泛。這篇文章主要介紹了在Android開發(fā)中使用icon font的代碼和方法。對大家學(xué)習(xí)使用iconfont有一定的參考借鑒價值，有需要的朋友們下面來一起看看吧。
    2016-10-10
  • 詳解Android安全防護(hù)之加密算法

    詳解Android安全防護(hù)之加密算法

    Android應(yīng)用對安全防范這方面要求越來越高了。特別是金融行業(yè)，如果app沒有沒有做好安全處理，那些很容易被一些Hacker（黑客）所攻擊。并不是說做了這些安全防范，這個應(yīng)用就百分之百的安全的。只是說能夠盡可能加大破解難度。本文將詳細(xì)介紹Android安全防護(hù)之加密算法。
    2021-06-06

最新評論