DCloud_App_Array
DCloud_App_Array
  • 发布:2014-10-29 14:45
  • 更新:2022-11-01 18:28
  • 阅读:82685

Android平台以Widget方式集成HTML5+SDK方法

分类:5+ SDK
SDK

5+ SDKWidget方式集成WebView方式集成 将不再继续维护支持,相关功能已迁移到uni小程序 SDK,因此建议开发者尽快将应用升级到uni-app项目。

最新SDK下载地址
HTML5+ SDK 可以按照“独立应用”和“单页面”两种种方式进行集成,两种集成方式各有优点。

  • 独立应用集成方式:即Widget集成方式,开发者在集成后可在需要时启动HTML5+ SDK,显示指定目录下的5+ WebAPP。原生App中集成uni-app也需使用本集成方式。

  • 单页面集成方式:即Webview集成方式,用户可在需要时显示一个支持5+扩展API的Webview页面。使用单页面方式集成5+ SDK,在页面内不能调用plus.webview的API创建新的页面,其他5+API的使用不受影响。

集成代码请参考SDK内HBuilder-Integrate工程 点击下载最新SDK

集成步骤

一 将5+SDK导入现有原生工程

点击下载最新 5+ SDK
开发者需要根据WebApp中将要用到的5+API,将涉及的5+SDK的jar包和资源文件导入到现有的Android原生工程中,并根据需求修改工程的Androidmanifest.xml文件。
注意:集成SDK时需要将DCloudApplication配置到AndroidManifest.xml 的application节点中。也可继承DCloudApplication实现自己的application并配置。不配置DCloudApplication会导致SDK中业务逻辑无法正常运行!!!!

<application  
        android:name="io.dcloud.application.DCloudApplication" >

各API需要导入的资源和AndroidManifest.xml文件需要修改地方请点击查看以下文档
基础插件配置
推送插件配置
分享插件配置
授权登陆插件配置
地图插件配置
支付插件配置
定位插件配置

二 将WebApp导入现有原生工程

5+Webapp的导入现有工程的方法可以参考Android平台离线打包配置文档

三 5+SDK集成代码编写

1 创建一个继承自ICoreStatusListener的类,并实现其中的方法

ICoreStatusListener类用来监听5+内核的运行事件,当5+内核运行状态发生变化时会触发相应的方法,包含以下几个方法:

void onCoreReady(ICore arg0)
说明:
5+内核开始初始化时触发
SDK的方法必须在调用SDK.init()之后才可以调用,在使用中通常在onCoreReady方法触发时初始化5+SDK。
代码示例:

@Override  
    public void onCoreReady(ICore coreHandler) {  
        // 调用SDK的初始化接口,初始化5+ SDK  
        SDK.initSDK(coreHandler);  
        // 设置当前应用可使用的5+ API  
        SDK.requestAllFeature();  
    }

void onCoreInitEnd(ICore arg0)
说明:
5+内核初始化完成时触发
开发者要在5+内核初始化完成后才能调用SDK.startWebApp()等接口启动指定目录下的5+Webapp

boolean onCoreStop()
说明:
5+内核关闭时触发

Object onCreateSplash(Context pContextWrapper)
说明:
Splash页面创建时触发

void onCloseSplash()
说明:
Splash页面关闭时触发

2 调用SDK.startWebApp方法创建并启动5+WebApp

在5+内核初始化完毕后可调用SDK.startWebApp() 方法启动5+WebApp,方法会创建并返回一个IApp对象。开发者可通过调用IApp对象的方法获取该应用内已经打开的页面的IWebView对象也可以关闭这个5+WebApp。

应用创建后需要将应用的主页面添加到要显示该应用的父View中。

在调用startWebApp方法时可以传入一个IWebviewStateListener用来监听WebApp首页面加载的进度。

IApp对象创建成功后我们可以添加一个IAppStatusListener用来监听当前创建的IAPP对象的运行状态。

代码示例

    class WebappModeListener implements ICoreStatusListener, IOnCreateSplashView {  
    Activity activity;  
    View splashView = null;  
    ViewGroup rootView;  
    IApp app = null;  
    ProgressDialog pd = null;  

    public WebappModeListener(Activity activity, ViewGroup rootView) {  
        this.activity = activity;  
        this.rootView = rootView;  
    }  

    @Override  
    public void onCoreInitEnd(ICore coreHandler) {  

        // 表示Webapp的路径在 file:///android_asset/apps/HelloH5  
        String appBasePath = "/apps/HelloH5";  

        // 设置启动参数,可在页面中通过plus.runtime.arguments;方法获取到传入的参数  
        String args = "{url:'http://www.baidu.com'}";  

        // 启动启动独立应用的5+ Webapp  
        app = SDK.startWebApp(activity, appBasePath, args, new IWebviewStateListener() {  
            // 设置Webview事件监听,可在监监听内获取WebIvew加载内容的进度  
            @Override  
            public Object onCallBack(int pType, Object pArgs) {  
                switch (pType) {  
                case IWebviewStateListener.ON_WEBVIEW_READY:  
                    // WebApp准备加载事件  
                    // 准备完毕之后添加webview到显示父View中,  
                    // 设置排版不显示状态,避免显示webview时html内容排版错乱问题  
                    View view = ((IWebview) pArgs).obtainApp().obtainWebAppRootView().obtainMainView();  
                    view.setVisibility(View.INVISIBLE);  
                    rootView.addView(view, 0);  
                    break;  
                case IWebviewStateListener.ON_PAGE_STARTED:  
                    pd = ProgressDialog.show(activity, "加载中", "0/100");  
                    break;  
                case IWebviewStateListener.ON_PROGRESS_CHANGED:  
                    // WebApp首页面加载进度变化事件  
                    if (pd != null) {  
                        pd.setMessage(pArgs + "/100");  
                    }  
                    break;  
                case IWebviewStateListener.ON_PAGE_FINISHED:  
                    // WebApp首页面加载完成事件  
                    if (pd != null) {  
                        pd.dismiss();  
                        pd = null;  
                    }  
                    // 页面加载完毕,设置显示webview  
                    app.obtainWebAppRootView().obtainMainView().setVisibility(View.VISIBLE);  
                    break;  
                }  
                return null;  
            }  
        }, this);  

        app.setIAppStatusListener(new IAppStatusListener() {  
            // 设置APP运行事件监听  
            @Override  
            public boolean onStop() {  
                // 应用运行停止时调用  
                rootView.removeView(app.obtainWebAppRootView().obtainMainView());  
                // TODO Auto-generated method stub  
                return false;  
            }  

            @Override  
            public void onStart() {  
                // 独立应用启动时触发事件  
            }  

            @Override  
            public void onPause(IApp arg0, IApp arg1) {  
                // WebApp暂停运行时触发事件  

            }  
        });  
    }  

    @Override  
    public void onCoreReady(ICore coreHandler) {  
        // 初始化SDK并将5+引擎的对象设置给SDK  
        SDK.initSDK(coreHandler);  
        //   
        SDK.requestAllFeature();  
    }  

    @Override  
    public boolean onCoreStop() {  
        // 当返回false时候回关闭activity  
        return false;  
    }  

    @Override  
    public Object onCreateSplash(Context pContextWrapper) {  
        splashView = new FrameLayout(activity);  
        splashView.setBackgroundResource(RInformation.DRAWABLE_SPLASH);  
        rootView.addView(splashView);  
        return null;  
    }  

    @Override  
    public void onCloseSplash() {  
        rootView.removeView(splashView);  
    }  
}

3 启动5+ 内核

5+SDK在使用前首先要进行5+内核的初始化,在启动时需要添加一个ICoreStatusListener用来监听5+内核启动状态。io.dcloud.feature.internal.sdk.SDK类的方法需要在5+内核初始化后才能够调用。

同时还需要在5+内核初始化后指定当前将要使用那种集成方式。独立应用集成方式使用SDK.IntegratedMode.WEBAPP 参数指定当前SDK将使用独立应用方式启动5+WebApp。

示例中5+ SDK是在Activity的onCreate方法中初始化,在具体使用中可在任意时刻初始化5+内核。

public class SDK_WebApp extends Activity {  

    boolean doHardAcc = true;  
    EntryProxy mEntryProxy = null;  

    @Override  
    public void onCreate(Bundle savedInstanceState) {  
        super.onCreate(savedInstanceState);  
        requestWindowFeature(Window.FEATURE_NO_TITLE);  
        if (mEntryProxy == null) {  
            FrameLayout f = new FrameLayout(this);  
            // 创建5+内核运行事件监听  
            WebappModeListener wm = new WebappModeListener(this, f);  
            // 初始化5+内核  
            mEntryProxy = EntryProxy.init(this, wm);  
            // 启动5+内核  
            mEntryProxy.onCreate(this, savedInstanceState, SDK.IntegratedMode.WEBAPP, null);  
            setContentView(f);  
        }  
    }  
}

4 传递Activity事件给5+ SDK

开发者在集成5+SDK时可根据需要将Activity的事件传递给5+SDK引擎,5+引擎会将事件传递给监听事件的Webview,由Webview进行事件处理。

@Override  
    public boolean onCreateOptionsMenu(Menu menu) {  
        return mEntryProxy.onActivityExecute(this, SysEventType.onCreateOptionMenu, menu);  
    }  

    @Override  
    public void onPause() {  
        super.onPause();  
        mEntryProxy.onPause(this);  
    }  

    @Override  
    public void onResume() {  
        super.onResume();  
        mEntryProxy.onResume(this);  
    }  

    public void onNewIntent(Intent intent) {  
        super.onNewIntent(intent);  
        if (intent.getFlags() != 0x10600000) {  
        // 非点击icon调用activity时才调用newintent事件  
            mEntryProxy.onNewIntent(this, intent);  
        }  
    }  

    @Override  
    protected void onDestroy() {  
        super.onDestroy();  
        mEntryProxy.onStop(this);  
    }  

    @Override  
    public boolean onKeyDown(int keyCode, KeyEvent event) {  
        boolean _ret = mEntryProxy.onActivityExecute(this, SysEventType.onKeyDown, new Object[] { keyCode, event });  
        return _ret ? _ret : super.onKeyDown(keyCode, event);  
    }  

    @Override  
    public boolean onKeyUp(int keyCode, KeyEvent event) {  
        boolean _ret = mEntryProxy.onActivityExecute(this, SysEventType.onKeyUp, new Object[] { keyCode, event });  
        return _ret ? _ret : super.onKeyUp(keyCode, event);  
    }  

    @Override  
    public boolean onKeyLongPress(int keyCode, KeyEvent event) {  
        boolean _ret = mEntryProxy.onActivityExecute(this, SysEventType.onKeyLongPress, new Object[] { keyCode, event });  
        return _ret ? _ret : super.onKeyLongPress(keyCode, event);  
    }  

    public void onConfigurationChanged(Configuration newConfig) {  
        try {  
            int temp = this.getResources().getConfiguration().orientation;  
            if (mEntryProxy != null) {  
                mEntryProxy.onConfigurationChanged(this, temp);  
            }  
            super.onConfigurationChanged(newConfig);  
        } catch (Exception e) {  
            e.printStackTrace();  
        }  
    }  

    protected void onActivityResult(int requestCode, int resultCode, Intent data) {  
        mEntryProxy.onActivityExecute(this, SysEventType.onActivityResult, new Object[] { requestCode, resultCode, data });  
    }  

Android 平台5+SDK常用接口说明

Android 平台5+SDK常用接口及使用示例请点击

6 关注 分享
梓宏 前端吧 Trust 4***@qq.com 逆流而上2号 jzq84229

要回复文章请先登录注册

悠自在

悠自在

回复 2***@qq.com :
我也遇到同样的问题,请问解决了吗?
2019-12-07 17:00
t***@163.com

t***@163.com

离线打包的两种方式的场景,我真心没搞懂。一个只能打开一个webview,不让打开新的窗口,一个只能打开目录,无法指定页面。widget方式最新的sdk示例还有错。splashView.setBackgroundResource(R.drawable.splash); 现在提问也没人回答了。社区形同虚设。
2019-07-24 10:51
2***@qq.com

2***@qq.com

回复 4***@qq.com :
用activity。fragment启动的webapp会导致,webapp退出后短时间内再次打开就崩溃
2019-06-21 13:46
2***@qq.com

2***@qq.com

Android平台以Widget方式集成HTML5+SDK方法 html页面怎么跳转到原生界面,再怎么跳转回去?
2019-06-03 15:13
4***@qq.com

4***@qq.com

可以使用fragment集成么
2019-04-15 10:42
j***@163.com

j***@163.com

为什么按照文档导入了lib.5plus.base-release.aar包并重新编译了,找不到io.dcloud.common包?这到底是怎么玩的
2018-05-17 22:08
shanyeWard

shanyeWard

回复 4***@qq.com :
有什么解决方案没?
2018-05-16 15:10
shanyeWard

shanyeWard

回复 6***@qq.com :
怎么解决的?
2018-05-16 15:08
6***@qq.com

6***@qq.com

回复 w***@gmail.com :
解决了,但是忘了怎么解决的。
2018-03-27 15:13
1***@qq.com

1***@qq.com

回复 1***@qq.com :
有人两种方式都试过吗?
2018-02-08 09:29