Phonegap 原生控件(Android)与html混合-阿里云开发者社区

开发者社区> zting科技> 正文

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

简介:
+关注继续查看

1. 用命令创建cordova项目

cordova coreate hello com.example.hello hello

 

2.打开MainActivity

在onCreate方法中加入

setContentView(R.layout.main_activity);

 

3. main_activity文件如下:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
<?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="@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方法

1
2
3
4
5
6
@Override
  protected CordovaWebView makeWebView() {
      SystemWebView webView = (SystemWebView) findViewById(R.id.cordovaWebView);
      CordovaWebView cordovaWebView = new CordovaWebViewImpl(new SystemWebViewEngine(webView));
      return cordovaWebView;
  }

  cordovaWebView对于xml里的SystemWebView 控件

 

1
2
3
4
5
6
7
8
9
10
@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. 效果图

 



本文转自Work Hard Work Smart博客园博客,原文链接:http://www.cnblogs.com/linlf03/p/7088821.html,如需转载请自行联系原作者

版权声明:本文内容由阿里云实名注册用户自发贡献,版权归原作者所有,阿里云开发者社区不拥有其著作权,亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容,填写侵权投诉表单进行举报,一经查实,本社区将立刻删除涉嫌侵权内容。

相关文章
阿里云服务器怎么设置密码?怎么停机?怎么重启服务器?
如果在创建实例时没有设置密码,或者密码丢失,您可以在控制台上重新设置实例的登录密码。本文仅描述如何在 ECS 管理控制台上修改实例登录密码。
10071 0
使用NAT网关轻松为单台云服务器设置多个公网IP
在应用中,有时会遇到用户询问如何使单台云服务器具备多个公网IP的问题。 具体如何操作呢,有了NAT网关这个也不是难题。
26787 0
阿里云服务器ECS远程登录用户名密码查询方法
阿里云服务器ECS远程连接登录输入用户名和密码,阿里云没有默认密码,如果购买时没设置需要先重置实例密码,Windows用户名是administrator,Linux账号是root,阿小云来详细说下阿里云服务器远程登录连接用户名和密码查询方法
11606 0
windows server 2008阿里云ECS服务器安全设置
最近我们Sinesafe安全公司在为客户使用阿里云ecs服务器做安全的过程中,发现服务器基础安全性都没有做。为了为站长们提供更加有效的安全基础解决方案,我们Sinesafe将对阿里云服务器win2008 系统进行基础安全部署实战过程! 比较重要的几部分 1.
9157 0
阿里云服务器如何登录?阿里云服务器的三种登录方法
购买阿里云ECS云服务器后如何登录?场景不同,阿里云优惠总结大概有三种登录方式: 登录到ECS云服务器控制台 在ECS云服务器控制台用户可以更改密码、更换系.
13879 0
阿里云服务器ECS登录用户名是什么?系统不同默认账号也不同
阿里云服务器Windows系统默认用户名administrator,Linux镜像服务器用户名root
4500 0
阿里云ECS云服务器初始化设置教程方法
阿里云ECS云服务器初始化是指将云服务器系统恢复到最初状态的过程,阿里云的服务器初始化是通过更换系统盘来实现的,是免费的,阿里云百科网分享服务器初始化教程: 服务器初始化教程方法 本文的服务器初始化是指将ECS云服务器系统恢复到最初状态,服务器中的数据也会被清空,所以初始化之前一定要先备份好。
7361 0
+关注
3550
文章
0
问答
文章排行榜
最热
最新
相关电子书
更多
《2021云上架构与运维峰会演讲合集》
立即下载
《零基础CSS入门教程》
立即下载
《零基础HTML入门教程》
立即下载