首页 > 代码库 > Phonegap 原生控件(Android)与html混合

Phonegap 原生控件(Android)与html混合

1. 用命令创建cordova项目

cordova coreate hello com.example.hello hello

 

2.打开MainActivity

在onCreate方法中加入

setContentView(R.layout.main_activity);

技术分享

 

3. main_activity文件如下:

<?xml version="1.0" encoding="utf-8"?><LinearLayout xmlns:android="http://schemas.android.com/apk/res/android"    android:layout_width="match_parent"    android:layout_height="match_parent"    android:orientation="vertical" >    <RelativeLayout        android:layout_width="fill_parent"        android:layout_height="45dip"        android:background="#25C28B" >        <ImageButton            android:id="@+id/cordova_back"            android:layout_width="wrap_content"            android:layout_height="match_parent"            android:background="#00FFFFFF"            android:paddingLeft="10dp"            android:paddingRight="20dp"            android:src="http://www.mamicode.com/@drawable/back_all" />        <TextView            android:id="@+id/cordova_title"            android:layout_width="wrap_content"            android:layout_height="wrap_content"            android:layout_centerInParent="true"            android:text="原生头部"            android:textColor="#FFFFFF"            android:textSize="20sp" />        <Button            android:id="@+id/btn_report"            android:layout_width="wrap_content"            android:layout_height="match_parent"            android:layout_alignParentRight="true"            android:background="#00FFFFFF"            android:paddingLeft="10dp"            android:paddingRight="20dp"            android:text="报告"            android:textColor="#FFFFFF"            android:textSize="20sp" />    </RelativeLayout>    <org.apache.cordova.engine.SystemWebView        android:id="@+id/cordovaWebView"        android:layout_width="match_parent"        android:layout_height="match_parent" /></LinearLayout>

  SystemWebView是一个扩展的webview

 

4. 重新makeWebView方法和createViews方法

  @Override    protected CordovaWebView makeWebView() {        SystemWebView webView = (SystemWebView) findViewById(R.id.cordovaWebView);        CordovaWebView cordovaWebView = new CordovaWebViewImpl(new SystemWebViewEngine(webView));        return cordovaWebView;    }

  cordovaWebView对于xml里的SystemWebView 控件

 

   @Override    protected void createViews() {        if (preferences.contains("BackgroundColor")) {            int backgroundColor = preferences.getInteger("BackgroundColor", Color.BLACK);            // Background of activity:            appView.getView().setBackgroundColor(backgroundColor);        }        appView.getView().requestFocusFromTouch();    }  

  

 

5. 效果图

技术分享

 

 

Phonegap 原生控件(Android)与html混合