hybird混合式开发搭建

Posted 春风自是人间客

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了hybird混合式开发搭建相关的知识，希望对你有一定的参考价值。

1.xml

<?xml version="1.0" encoding="utf-8"?>
<WebView xmlns:android="http://schemas.android.com/apk/res/android"
    android:id="@+id/webview"
    android:layout_width="fill_parent"
    android:layout_height="fill_parent" />

2.activity

package com.firefly.hybirdapp;

import android.content.Intent;
import android.net.Uri;
import android.support.v7.app.AppCompatActivity;
import android.os.Bundle;
import android.view.KeyEvent;
import android.webkit.WebSettings;
import android.webkit.WebView;
import android.webkit.WebViewClient;
import android.widget.Toast;

public class HomeActivity extends AppCompatActivity {
    WebView myWebView;
    //    String loadUrl = "file:///android_assets/index.html";本地
    String netUrl = "http://172.16.46.114:14023/index.html/";

    @Override
    protected void onCreate(Bundle savedInstanceState) {
        super.onCreate(savedInstanceState);
        setContentView(R.layout.activity_home);
        myWebView = (WebView) findViewById(R.id.webview);
        myWebView.loadUrl(netUrl);//加载Url
        //设置WebView
        myWebView.setWebViewClient(new WebViewClient() {
            @Override
            public boolean shouldOverrideUrlLoading(WebView view, String url) {
                view.loadUrl(url);
                return true;
            }
        });
        //得到设置类
        WebSettings ws = myWebView.getSettings();
        ws.setjavascriptEnabled(true);//允许js脚本
        //把js调用的方法写在WebApp
        myWebView.addJavascriptInterface(new MyWebAppInterface(this), "android");
    }

    //按返回键返回上一页
    @Override
    public boolean onKeyDown(int keyCode, KeyEvent event) {
        // Check if the key event was the Back button and if there‘s history
        if ((keyCode == KeyEvent.KEYCODE_BACK) && myWebView.canGoBack()) {
            myWebView.goBack();
            return true;
        }
        return super.onKeyDown(keyCode, event);
    }
}

3.webApp类

package com.firefly.hybirdapp;

import android.content.Context;
import android.util.Log;
import android.webkit.JavascriptInterface;

/**
 * Created by pengdan on 2016/6/27.
 */
public class MyWebAppInterface {
    Context context;

    public MyWebAppInterface(Context context) {
        this.context = context;
    }

    @JavascriptInterface
    public String lookData(String data) {
        Log.e("TAG", data + "hello!!");
        //返回信息给html
        return "hello";
    }
}

4.html

<!DOCTYPE html>
<html>

    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
        <title></title>
        <script src="js/mui.min.js"></script>
        <link href="css/mui.min.css" rel="stylesheet" />
        <script type="text/javascript" charset="utf-8">
            mui.init();

            function look() {
                var ua = navigator.userAgent.toLocaleLowerCase();
                alert(ua);
                //判断是否android
                if (/android/.test(ua)) {
                    //发送消息
                    var msg = window.android.lookData(‘I am html5‘);
                    //把接收到的消息写到span里面
                    document.getElementById(‘span‘).innerHTML = msg;
                    alert(msg);
                }
            }
        </script>
    </head>

    <body>
        <h1>彭丹</h1>
        <button onclick="look()">点击</button>
        <span id="span"></span>
    </body>

</html>

 

以上是关于hybird混合式开发搭建的主要内容，如果未能解决你的问题，请参考以下文章

Flutter（六）Android与Flutter混合开发（Hybird）

Cordova+ionic 开发hybird App --- 开发环境搭建

开发框架-APP：Hybird App

错误记录Flutter 混合开发获取 BinaryMessenger 报错 ( FlutterActivityAndFragmentDelegate.getFlutterEngine() )(代码片段

求助，Windows 2008如何配置睡眠(Sleep)、休眠(hibernate)、混合休眠(Hybird Sleep)、标准睡眠(Standby)

flutter_hybird_webview 跨进程渲染的实践技术分享