开发原生安卓cordova插件(有原生界面)-程序员宅基地

技术标签: java  json  移动开发  

上文开发的插件没有调用原生界面,本文介绍开发带有activity的插件

 

本文很多操作与上文重复,重复部分会省略

 

首先打开plug1,先开发插件的原生代码

 

在以下命名空间创建一个activity

181602_sXjs_1251858.png

名称为Act1Activity

181606_HCvr_1251858.png

 

添加成功后,修改此文件

181611_KgZ5_1251858.png

内容如下:

package com.cesc.ewater.cordovaPlugin;

 

import android.support.v7.app.AppCompatActivity;

import android.os.Bundle;

import android.widget.TextView;

 

import com.cesc.ewater.plug1.R;

 

public class Act1Activity extends AppCompatActivity {

    @Override

    protected void onCreate(Bundle savedInstanceState) {

        super.onCreate(savedInstanceState);

        setContentView(R.layout.activity_act1);

 

        //以下实现获取打开此Activity时传进来的参数值(参数的key是thisText),并显示到一个TextView

        TextView txt = (TextView) this.findViewById(R.id.txtInput);

        txt.setText(this.getIntent().getStringExtra("thisText"));

    }

}

 

再修改他的layout,文件在此

181616_DlZI_1251858.png

内容如下:

<?xml version="1.0" encoding="utf-8"?>

<android.support.constraint.ConstraintLayout xmlns:android="http://schemas.android.com/apk/res/android"

    xmlns:app="http://schemas.android.com/apk/res-auto"

    xmlns:tools="http://schemas.android.com/tools"

    android:layout_width="match_parent"

    android:layout_height="match_parent"

    tools:context="com.cesc.ewater.cordovaPlugin.Act1Activity">

 

    <LinearLayout

        android:layout_width="368dp"

        android:layout_height="495dp"

        android:orientation="vertical"

        tools:layout_editor_absoluteX="8dp"

        tools:layout_editor_absoluteY="8dp">

 

        <TextView

            android:id="@+id/textView"

            android:layout_width="match_parent"

            android:layout_height="wrap_content"

            android:text="下面是传入参数例子" />

 

        <TextView

            android:id="@+id/txtInput"

            android:layout_width="match_parent"

            android:layout_height="wrap_content" />

    </LinearLayout>

</android.support.constraint.ConstraintLayout>

 

再创建plugin,类名为Act1Plugin,新建成功如下:

181623_CyoD_1251858.png

把文件内容修改为:

package com.cesc.ewater.cordovaPlugin;

 

import android.content.Intent;

 

import org.apache.cordova.CallbackContext;

import org.apache.cordova.CordovaArgs;

import org.apache.cordova.CordovaPlugin;

import org.json.JSONArray;

import org.json.JSONException;

 

public class Act1Plugin extends CordovaPlugin {

    @Override

    public boolean execute(String action, String rawArgs, CallbackContext callbackContext) throws JSONException {

        return super.execute(action, rawArgs, callbackContext);

    }

 

    @Override

    public boolean execute(String action, JSONArray args, CallbackContext callbackContext) throws JSONException {

        return super.execute(action, args, callbackContext);

    }

 

    @Override

    public boolean execute(String action, CordovaArgs args, CallbackContext callbackContext) throws JSONException {

        if (action.equals("show")) {

            //以下用原生代码打开一个Act1Activity(可以理解为让界面跳转到Act1Activity这个界面)

            //PS:原生很多地方都要获取当前Activity的实例对象(如果在Activity里就用this),在CordovaPlugin用的是cordova.getActivity()

            Intent intent = new Intent(cordova.getActivity(), Act1Activity.class);

            //传入参数,参数分别是key和value

            intent.putExtra("thisText", "哈哈哈");

            cordova.getActivity().startActivity(intent);

            return true;

        }

        return false;

    }

}

 

到此插件编码完成,以上编码的功能意思为,调用插件Act1Plugin时,会跳转到原生安卓界面Act1Activity

 

回到capp1,开始创建插件

 

命令行进入capp1目录,执行以下命令创建插件,插件命名为act1-plugin

plugman create --name act1-plugin --plugin_id act1-plugin --plugin_version 1.0.0

 

在新建的插件文件夹下创建android文件夹

181631_fbKM_1251858.png

把插件相关的类文件和layout文件都拷到此目录下

PS:不用管原来的文件目录结构,都放在此目录下就行

181635_kGec_1251858.png

 

然后开始编辑plugin.xml ,修改成以下的内容(提供全文内容可以直接复制)

<?xml version='1.0' encoding='utf-8'?>

<plugin id="act1-plugin" version="1.0.0" xmlns="http://apache.org/cordova/ns/plugins/1.0" xmlns:android="http://schemas.android.com/apk/res/android">

    <!--插件名-->

       <name>act1-plugin</name>

       <!--js部分配置-->

    <js-module name="Act1Plugin" src="www/act1-plugin.js">

              <!--js调用的对象名-->

        <clobbers target="Act1Plugin" />

    </js-module>

      

       <!--添加安卓平台-->

    <platform name="android">

        <config-file target="res/xml/config.xml" parent="/*"> 

                     <!--js调用的对象名-->

            <feature name="Act1Plugin">

                            <!-- value=java类名全路径-->

                <param name="android-package" value="com.cesc.ewater.cordovaPlugin.Act1Plugin"/>

            </feature> 

        </config-file> 

              <!-- src:java源文件的路径, target-dir:插件安装好后,源文件的位置,要和上面的包名对应 -->

              <!--跟插件所有有关的类文件,layout文件等等都要一一配置在下方-->

        <source-file src="src/android/Act1Plugin.java" target-dir="src/com/cesc/ewater/cordovaPlugin" /> 

              <source-file src="src/android/Act1Activity.java" target-dir="src/com/cesc/ewater/cordovaPlugin" /> 

              <!--添加layout文件的例子,注意target-dir的值与改文件在as的目录是一样的-->

              <source-file src="src/android/activity_act1.xml" target-dir="res/layout" />    

    </platform>

</plugin>

 

 

然后开始编辑此文件

181642_n7fQ_1251858.png

内容如下,可以直接复制进去,

var exec = require('cordova/exec');

 

//一个exports.XXX代表插件的一个方法,exports后面和exec方法的参数4都是方法名称(此例都是show)

var exec = require('cordova/exec');

 

//一个exports.XXX代表插件的一个方法,exports后面和exec方法的参数4都是方法名称(此例都是show)

exports.show = function (arg0, success, error) {

       //参数1和参数2分别是调用插件成功和失败的回调方法(js)

       //参数3是插件名

       //参数4是方法名

       //参数5是js的传参

    exec(success, error, 'Act1Plugin', 'show', [arg0]);

};

 

打开控制台,进入插件目录,执行npm init

181646_PhjN_1251858.png

 

完成后插件目录多了个package.json文件,开始编辑他

 

添加此部分,下面有文本内容

PS:id是插件名称

181650_FoVZ_1251858.png

  "cordova": {

    "id": "act1-plugin",

    "platforms": [

      "android"

    ]

  },

 

插件修改到此结束,开始把插件添加到cordova应用

 

控制台进入capp1的安卓平台目录,输入以下命令cordova plugin add E:\project\201712cordovaTest\code\capp1\act1-plugin,命令中的路径是插件的目录

PS:此命令意思是把某个目录的插件添加capp1的cordova应用

181655_tapW_1251858.png

 

成功后capp1会多了如下文件,可以见到插件的文件

181658_7MgR_1251858.png

 

到此完成添加插件到cordova应用

 

接下来开始修改h5应用代码,在h5应用中使用js调用插件

 

打开vue1

找到主页的js文件

181703_tPKk_1251858.png

添加代码:Act1Plugin.show();

181708_gRCa_1251858.png

 

修改代码完毕,npm build一下

PS:从这段操作开始,在之前的 使用cordova把h5应用打包成apk 已经有说明,也就是h5应用修改后,通过一系列操作把他打包成apk,但在此也重复说明一次

181713_310p_1251858.png

 

打开www(用webstrom打开,之前有说过),把刚才生成的文件拷过去

PS:注意每次build生成的文件都会有一堆随机数,如果随机数变了就说明该文件内容有修改所以重新生成,反之就没变

181717_GAGF_1251858.png

 

然后修改indel.html文件里引用文件的文件名

181723_uzv6_1251858.png

 

然后开始cordova打包apk,命令行进入capp1的目录,运行命令cordova build android

181727_r1m3_1251858.png

 

然后build一下,会发现很多报错

181731_sQpz_1251858.png

这是因为capp1只有cordova的基础引用,跟完整的安卓应用的代码还是缺少很多引用

例如Act1Activity会报不能引用android.support.v7.app.AppCompatActivity

PS:以下解决编译错误的方法,估计不具有普遍性,解决以下问题需要一定的原生安卓开发能力

181735_9TNJ_1251858.png

 

把基类改为Activity

181740_oOwP_1251858.png

 

然后import com.cesc.ewater.plug1.R有错

把import com.cesc.ewater.plug1.R删掉,对R使用alt+enter import class

181745_MqnN_1251858.png

 

此时build没错了,插上手机,开始调试

PS:其实还有问题的,只是暂时还看不出来

 

手机开始调试,点击左上角的按钮,但是没有效果,在logcat发现报错

错误大意是找不到Act1Activity,后面还提示是否在AndroidManifest.xml里配置了此Activity

181749_63Aa_1251858.png

 

于是去capp1的AndroidManifest.xml,配置Act1Activity

181753_9Fk7_1251858.png

<activity android:name="com.cesc.ewater.cordovaPlugin.Act1Activity" />

181758_CBlg_1251858.png

 

然后再次调试,这次app直接崩掉,logcat报错,其中看到Didn't find class "android.support.constraint.ConstraintLayout,意思是找不到ConstraintLayout

181802_emF6_1251858.png

 

回到plug1,可以发现上面的类的引用配置

181806_tX0e_1251858.png

181809_yMYI_1251858.png

把这行拷到capp1的相同文件的相同位置

181815_o1OU_1251858.png

181819_eSi0_1251858.png

拷完后build一下,发现报错

181824_EXQn_1251858.png

这原因是plug1的gradle是4.1,而capp1是2.14.1,不同版本的gradle配置文件语法不同,因此这行应该修改成

compile  'com.android.support.constraint:constraint-layout:1.0.2'

181827_9Bnh_1251858.png

 

解决后再插上手机调试,这次终于成功了

点击左上角按钮

181832_kZwb_1251858.png

会跳转到下个界面

181835_kim0_1251858.png

 

到此开发完成

转载于:https://my.oschina.net/u/1251858/blog/1799007

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接:https://blog.csdn.net/weixin_33755649/article/details/92086138

智能推荐

pytorch中tensor.mean(axis, keepdim)参数理解小实验_tensor mean 多维-程序员宅基地

文章浏览阅读1.7w次,点赞13次,收藏35次。虽然没试过其他形式的多维数据,不过想来应该是一样的吧 ~~1.结论keepdim=True运算完之后的维度和原来一样,原来是三维数组现在还是三维数组(不过某一维度变成了1);keepdim=False运算完之后一般少一维度,求平均变为1的那一维没有了;axis=k按第k维运算,其他维度不遍,第k维变为1。2.实验import numpy as npimport torchx=..._tensor mean 多维

mfc连接mysql增删改查_MFC 数据库编程 增删改查的一个例子-程序员宅基地

文章浏览阅读478次。1.先看下效果图:主界面:一个最简单的1对多的表,一张Article(文章)表,一张Category(类别)表。有添加,修改,删除文章按钮。点击类别编辑按钮就会跳到第二个对话框。点击数据库配置就会跳到第三个对话框。类别编辑的对话框,类别做了防止重复数据添加的功能。数据库配置的对话框,记录会保存到文件中。2.保存数据库信息到文件中。//写一条记录WritePrivateProfileString(L..._mfc连接数据库

Python之7个常见的列表函数_python列表函数-程序员宅基地

文章浏览阅读1.1k次,点赞21次,收藏16次。Python之7个常见的列表函数_python列表函数

VMWare Player 建立的Ubuntu虚拟机突然显示网络连接激活失败_vmware player 网络不能激活-程序员宅基地

文章浏览阅读1.3k次。VMWare Player 建立的Ubuntu虚拟机突然消失网络连接激活失败VMWare Player 建立的Ubuntu虚拟机突然消失网络连接激活失败昨天更新完以后突然无法上网,我就很难受,搞了几个小时,才发现问题所在原因是我昨天更新了player,一般来说我都是喜欢更新,但是这一次就出了问题,更新了player以后,vmware player 的vmnet1和vmnet8就是不正常了,..._vmware player 网络不能激活

ASP.NetCore+Layui 后台管理系统-简介_,net core后台管理系统-程序员宅基地

文章浏览阅读3.3k次,点赞2次,收藏19次。一、简介 1.使用技术: 使用技术 是否完成 备注 后端 ASP.Net Core 2.2 Y MemoryCache Y Log4Net Y EFCore 2.2 Y Redis N 基础操作方法保留,系统中已删除使用reids Swagger Y 前端 layui Y jquery Y echart..._,net core后台管理系统

swift 解析取得json中的数据_switf 取出json数据-程序员宅基地

文章浏览阅读1.4k次。搞了两天解析返回的json数据终于出来了,下面就方向给大家用到了第三的类库 SwiftHTTP (https://github.com/daltoniam/SwiftHTTP)做request get ,post ,put 等SwiftJson(https://github.com/SwiftyJSON/SwiftyJSON) 讲返回的数据解析为json关于第三方类_switf 取出json数据

随便推点

log4j的配置ConversionPattern详细讲解-程序员宅基地

文章浏览阅读1.3w次,点赞9次,收藏32次。原文来自https://blog.csdn.net/reserved_person/article/details/52849505感谢大佬先写下我一直没找到的ConversionPattern里面参数代表的详细含义参数 说明 例子 %c 列出logger名字空间的全称,如果加上{&lt;层数&gt;}表示列出从最内层算起的指定层数的名字空间 log4j配置文件..._conversionpattern

XNA做的一个游戏.-程序员宅基地

文章浏览阅读164次。有7M,传不到这么大,整2副图出来看哈.还没有整完.其实XNA的性能并没有想象中那么差./Files/liuzhiwei/game.rar需要安装.Net Framework 2.0和XNA Framework 1.0才可运行。 转载于:https://www.cnblogs.com/liuzhiwei/archive/2007/10/21/932332.html..._xna怎么做游戏

k210实现人脸检测(很详细)MaixDock -1|CSDN创作打卡_k210人脸识别例程-程序员宅基地

文章浏览阅读5.5k次,点赞10次,收藏103次。k210实现人脸检测(很详细)MaixDock -1_k210人脸识别例程

Android ScrollView滑动到顶部的三种方式_scrollview滚动到顶部-程序员宅基地

文章浏览阅读8.2k次。一、ScrollView.scrollTo(0,0) 直接置顶,瞬间回到顶部,没有滚动过程,其中Y值可以设置为大于0的值,使Scrollview停在指定位置; 二、ScrollView.fullScroll(View.FOCUS_UP) 类似于手动拖回顶部,有滚动过程; 三、ScrollView.smoothScrollTo(0, 0) 类似于手动拖回顶部,有滚动过程,其中Y值可以设置为大..._scrollview滚动到顶部

工单管理系统是什么?全面解析,提升客户服务效率的利器-程序员宅基地

文章浏览阅读313次,点赞8次,收藏10次。工单管理系统是一种用于跟踪、分派和管理工作任务或服务请求的软件系统。可以帮助组织高效地解决与处理客户服务难题,以确保任务获得适度的解决和跟踪。

SSM婚纱摄影网站java影楼管理系统JAVA|JSP|SSM|Springboot|web计算机毕业设计源码-程序员宅基地

文章浏览阅读62次。1、开发语言:JAVA/JSP(SSH、SSM、Springboot)、Aspnet、PHP、python、安卓。2、含有资料:毕业论文、开题报告、任务书、答辩稿PPT、数据库源代码、讲解视频、3、具体操作:远程调试、源码创建时间修改、bug修改、答辩问题准备。程序视频展示效果可以 点击下方链接 进入B站查看。