美文网首页小程序
微信小程序原理

微信小程序原理

作者: 诺之林 | 来源:发表于2019-04-29 15:19 被阅读0次

    本文的示例代码参考XiaoChengXu

    目录

    IDE

    find /Applications/wechatwebdevtools.app/Contents/Versions/ -maxdepth 2 -name "*nwjs*"
    # /Applications/wechatwebdevtools.app/Contents/Versions//60.0.3112.113/nwjs Framework.framework
    

    更多关于nwjs可以参考NW.js文档

    DSL

    更多关于DSL可以参考谈谈 DSL 以及 DSL 的应用(以 CocoaPods 为例)

    XCX

    • WXML + WXSS => WebView => Dom

    • WXS + JS => JavaScriptCore => Native

    • WebView <=> Native <=> JavaScriptCore

    更多关于小程序宿主环境的介绍详见下图

    MiniProgram

    APP

    // MainActivity
    Intent intent = new Intent(MainActivity.this, XCXActivity.class);
    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_TASK);
    intent.addFlags(Intent.FLAG_ACTIVITY_NEW_DOCUMENT);
    startActivity(intent);
    
    // XCXActivity
    final WebView webView = findViewById(R.id.webview);
    webView.getSettings().setJavaScriptEnabled(true);
    webView.loadUrl("file:///android_asset/web/index.html");
    webView.addJavascriptInterface(new Object() {
        @JavascriptInterface
        public void localMethods(String arg) {
            Toast.makeText(XCXActivity.this, arg, Toast.LENGTH_SHORT).show();
        }
    }, "obj");
    
    Button button = findViewById(R.id.button);
    button.setOnClickListener(new View.OnClickListener() {
        @Override public void onClick(View view) {
            webView.loadUrl(String.format("javascript:javacalljs(\"%d\")", ++count));
        }
    });
    
    <html>
    
    <head>
        <script type="text/javascript">
            function javacalljs(arg) {
                document.getElementById("content").innerHTML = "内容显示: " + arg;
            }
            function jscalljava() {
                window.obj.localMethods(document.getElementById("content").innerHTML)
            }
        </script>
    </head>
    
    <body>
    <h1>
        <div id="content">内容显示:</div>
    </h1>
    <br/>
    <input type="button" value="调用Java代码" onclick="jscalljava()"/><br/>
    </body>
    
    </html>
    

    参考

    相关文章

      网友评论

        本文标题:微信小程序原理

        本文链接:https://www.haomeiwen.com/subject/zourbqtx.html