开发者社区> zting科技> 正文
阿里云
为了无法计算的价值
打开APP
阿里云APP内打开

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,如需转载请自行联系原作者

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

相关文章
html通过js调用ios或android代码
html通过js调用ios或android代码
0 0
Android 基于Web Html实现webrtc 直播 调取Native操作
Android 基于Web Html实现webrtc 直播 调取Native操作
0 0
html通过js调用ios或android代码
html通过js调用ios或android代码
0 0
Android webview 加载html 页面缩放的问题
Android webview 加载html 页面缩放的问题
0 0
没错,你可以移动式编码了:4款最好的Android设备HTML编辑器
作为出色的应用平台,Android系统不仅可以用于登录Facebook或是玩“愤怒的小鸟”,它还可以为web开发人员提供可行的移动式解决方案。然而,web开发者是不可能对那些陈旧的文本编辑器表示满意的——他们需要使用专门的代码编辑器,以便让工作更快速更便捷地完成。下面我将要介绍4款名列前茅用于Android设备的HTML编辑器,任何web开发人员都能利用它们在平板电脑上处理大量工作,或是在智能手机上进行一些快速修改。
0 0
react native Android加载本地Html 问题
项目中有用到IP地址采集 用的是html5 webView的方式 请参考:react native 获取设备 真实ip地址 和 ip 映射的地理位置 这里留下的坑是 Android的release包 中获得ip是没反应的 一开始以为是Android WebView的缓存问题,后来改了还是没法获得,但是在开发中却可以拿到,很奇快.
1345 0
Android程序猿搞Web 之HTML(二)
1、表格的使用 1)、基本使用 作用:显示数据表示单元格的盒子; 数字表格 数字 123 ...
782 0
Android项目实战(十四):TextView显示html样式的文字
原文:Android项目实战(十四):TextView显示html样式的文字 项目需求: TextView显示一段文字,格式为:白雪公主(姓名,字数不确定)向您发来了2(消息个数,不确定)条消息 这段文字中名字和数字的长度是不确定的,还要求名字和数字各自有各自的颜色。
1373 0
+关注
文章
问答
文章排行榜
最热
最新
相关电子书
更多
天猫 HTML5 互动技术实践
立即下载
天猫HTML5互动技术实践
立即下载
《零基础HTML入门教程》
立即下载