Google Git
Sign in
apache / incubator-weex-site / refs/heads/asf-site / . / guide / extend / extend-android.html
blob: 54e5de0cd3d5a5ee250195fb6a31457ee51880ad [file] [log] [blame]
<!DOCTYPE html>
<html lang="en-US">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<title>Extend Android | WEEX</title>
<meta name="description" content="Weex">
<link rel="icon" href="//gw.alicdn.com/tps/TB1XNqxPXXXXXcSXVXXXXXXXXXX-64-63.png">
<script src="//g.alicdn.com/alilog/mlog/aplus_v2.js"></script>
<meta name="data-spm" dataSpmProtocol="i" content="a2c7j">
<meta name="aplus-ajax" content="chksum">
<meta name="aplus-waiting" content="MAN">
<meta name="google-site-verification" content="FbH8DPHpxdDJlfkKLKXuXWOu69DI8ZRRP8O2Phg8UKw">
<meta name="baidu-site-verification" content="WRr1iWvsYK">
<link rel="preload" href="/assets/css/styles.0ff943f0.css" as="style"><link rel="preload" href="/assets/js/app.0ff943f0.js" as="script"><link rel="preload" href="/assets/js/100.09076a87.js" as="script"><link rel="prefetch" href="/assets/css/1.styles.aa72e838.css"><link rel="prefetch" href="/assets/css/10.styles.1fff5b86.css"><link rel="prefetch" href="/assets/css/11.styles.a03faa50.css"><link rel="prefetch" href="/assets/css/2.styles.fc5d9892.css"><link rel="prefetch" href="/assets/css/21.styles.9ebad2b1.css"><link rel="prefetch" href="/assets/css/3.styles.6b94323a.css"><link rel="prefetch" href="/assets/css/36.styles.6dbb9d8c.css"><link rel="prefetch" href="/assets/css/4.styles.706a5607.css"><link rel="prefetch" href="/assets/css/7.styles.469d3b64.css"><link rel="prefetch" href="/assets/css/8.styles.b36167bf.css"><link rel="prefetch" href="/assets/css/9.styles.5bed6ebe.css"><link rel="prefetch" href="/assets/js/10.1fff5b86.js"><link rel="prefetch" href="/assets/js/101.71fa3538.js"><link rel="prefetch" href="/assets/js/102.8a9926d6.js"><link rel="prefetch" href="/assets/js/103.d6c3649e.js"><link rel="prefetch" href="/assets/js/104.adb2425b.js"><link rel="prefetch" href="/assets/js/105.a063ca34.js"><link rel="prefetch" href="/assets/js/106.620e227f.js"><link rel="prefetch" href="/assets/js/107.1c97d156.js"><link rel="prefetch" href="/assets/js/108.d1f236a9.js"><link rel="prefetch" href="/assets/js/109.10a909cc.js"><link rel="prefetch" href="/assets/js/11.a03faa50.js"><link rel="prefetch" href="/assets/js/110.6f9200c8.js"><link rel="prefetch" href="/assets/js/111.9c1831b3.js"><link rel="prefetch" href="/assets/js/112.e5c0d546.js"><link rel="prefetch" href="/assets/js/113.b1c17feb.js"><link rel="prefetch" href="/assets/js/114.c24b95ed.js"><link rel="prefetch" href="/assets/js/115.d7e38c3b.js"><link rel="prefetch" href="/assets/js/116.1aaa95ab.js"><link rel="prefetch" href="/assets/js/117.1a9e5539.js"><link rel="prefetch" href="/assets/js/118.8d915477.js"><link rel="prefetch" href="/assets/js/119.77f0a126.js"><link rel="prefetch" href="/assets/js/12.16a9b730.js"><link rel="prefetch" href="/assets/js/120.3cf0ba10.js"><link rel="prefetch" href="/assets/js/121.47fefbf1.js"><link rel="prefetch" href="/assets/js/122.3dd022e8.js"><link rel="prefetch" href="/assets/js/123.84abc63f.js"><link rel="prefetch" href="/assets/js/124.2568e233.js"><link rel="prefetch" href="/assets/js/125.5b665f24.js"><link rel="prefetch" href="/assets/js/126.25b58a0a.js"><link rel="prefetch" href="/assets/js/127.d62a58c6.js"><link rel="prefetch" href="/assets/js/128.e5774a02.js"><link rel="prefetch" href="/assets/js/129.9a813c06.js"><link rel="prefetch" href="/assets/js/13.f8bde866.js"><link rel="prefetch" href="/assets/js/130.edddc316.js"><link rel="prefetch" href="/assets/js/131.760aa65c.js"><link rel="prefetch" href="/assets/js/132.559d5ba7.js"><link rel="prefetch" href="/assets/js/133.cbdd35c7.js"><link rel="prefetch" href="/assets/js/134.c02d92e1.js"><link rel="prefetch" href="/assets/js/135.e6d5496a.js"><link rel="prefetch" href="/assets/js/136.8826af60.js"><link rel="prefetch" href="/assets/js/137.28b4573d.js"><link rel="prefetch" href="/assets/js/138.d370fc15.js"><link rel="prefetch" href="/assets/js/139.8d9150fc.js"><link rel="prefetch" href="/assets/js/14.a98602cc.js"><link rel="prefetch" href="/assets/js/140.f0a9b5e1.js"><link rel="prefetch" href="/assets/js/141.297fa6fe.js"><link rel="prefetch" href="/assets/js/142.82bbcbaa.js"><link rel="prefetch" href="/assets/js/143.2d1ed3b2.js"><link rel="prefetch" href="/assets/js/144.69a9bc6a.js"><link rel="prefetch" href="/assets/js/145.74d52c12.js"><link rel="prefetch" href="/assets/js/146.12ecdaf4.js"><link rel="prefetch" href="/assets/js/147.daad4b96.js"><link rel="prefetch" href="/assets/js/148.bb356182.js"><link rel="prefetch" href="/assets/js/149.56fdaace.js"><link rel="prefetch" href="/assets/js/15.ea6e5024.js"><link rel="prefetch" href="/assets/js/150.ee9c4994.js"><link rel="prefetch" href="/assets/js/151.2feae618.js"><link rel="prefetch" href="/assets/js/152.c7703521.js"><link rel="prefetch" href="/assets/js/153.3b555eab.js"><link rel="prefetch" href="/assets/js/154.c6329253.js"><link rel="prefetch" href="/assets/js/155.334c4ea4.js"><link rel="prefetch" href="/assets/js/156.1a29657f.js"><link rel="prefetch" href="/assets/js/157.ba8f07bc.js"><link rel="prefetch" href="/assets/js/158.a60a60ba.js"><link rel="prefetch" href="/assets/js/159.9ce96d49.js"><link rel="prefetch" href="/assets/js/16.14acc638.js"><link rel="prefetch" href="/assets/js/160.2a970224.js"><link rel="prefetch" href="/assets/js/161.a26e2b53.js"><link rel="prefetch" href="/assets/js/162.73535662.js"><link rel="prefetch" href="/assets/js/163.7518a0a5.js"><link rel="prefetch" href="/assets/js/164.17367778.js"><link rel="prefetch" href="/assets/js/165.46c8f055.js"><link rel="prefetch" href="/assets/js/166.1cc22037.js"><link rel="prefetch" href="/assets/js/167.3fbcb5c6.js"><link rel="prefetch" href="/assets/js/168.a3f80f1e.js"><link rel="prefetch" href="/assets/js/169.a6565c29.js"><link rel="prefetch" href="/assets/js/17.d6f2f3b8.js"><link rel="prefetch" href="/assets/js/170.566ddeda.js"><link rel="prefetch" href="/assets/js/171.4fd97bee.js"><link rel="prefetch" href="/assets/js/172.5295c6b9.js"><link rel="prefetch" href="/assets/js/173.ff25fd05.js"><link rel="prefetch" href="/assets/js/174.22ea6a1b.js"><link rel="prefetch" href="/assets/js/175.c6a04367.js"><link rel="prefetch" href="/assets/js/176.d3810924.js"><link rel="prefetch" href="/assets/js/177.facd2802.js"><link rel="prefetch" href="/assets/js/178.f4c6fbe9.js"><link rel="prefetch" href="/assets/js/179.1a3a2c12.js"><link rel="prefetch" href="/assets/js/18.83f6b39a.js"><link rel="prefetch" href="/assets/js/180.b54c8e90.js"><link rel="prefetch" href="/assets/js/181.88495b4c.js"><link rel="prefetch" href="/assets/js/182.8341d23c.js"><link rel="prefetch" href="/assets/js/183.332bcfe2.js"><link rel="prefetch" href="/assets/js/184.d8996a56.js"><link rel="prefetch" href="/assets/js/185.b8584f07.js"><link rel="prefetch" href="/assets/js/186.fa89e23f.js"><link rel="prefetch" href="/assets/js/187.90340eeb.js"><link rel="prefetch" href="/assets/js/188.efe631f8.js"><link rel="prefetch" href="/assets/js/189.72897b1a.js"><link rel="prefetch" href="/assets/js/19.94f071c0.js"><link rel="prefetch" href="/assets/js/190.1ec691ee.js"><link rel="prefetch" href="/assets/js/2.fc5d9892.js"><link rel="prefetch" href="/assets/js/20.13f7bbff.js"><link rel="prefetch" href="/assets/js/21.9ebad2b1.js"><link rel="prefetch" href="/assets/js/22.764b643d.js"><link rel="prefetch" href="/assets/js/23.f533737e.js"><link rel="prefetch" href="/assets/js/24.4eaa533c.js"><link rel="prefetch" href="/assets/js/25.e9877e57.js"><link rel="prefetch" href="/assets/js/26.8905d6a0.js"><link rel="prefetch" href="/assets/js/27.b199a955.js"><link rel="prefetch" href="/assets/js/28.524af0cf.js"><link rel="prefetch" href="/assets/js/29.b772949f.js"><link rel="prefetch" href="/assets/js/3.6b94323a.js"><link rel="prefetch" href="/assets/js/30.f5bcac64.js"><link rel="prefetch" href="/assets/js/31.c55e03aa.js"><link rel="prefetch" href="/assets/js/32.e575600a.js"><link rel="prefetch" href="/assets/js/33.3fff5656.js"><link rel="prefetch" href="/assets/js/34.82598567.js"><link rel="prefetch" href="/assets/js/35.8e1290ba.js"><link rel="prefetch" href="/assets/js/36.6dbb9d8c.js"><link rel="prefetch" href="/assets/js/37.d27fdc88.js"><link rel="prefetch" href="/assets/js/38.f8fc7b20.js"><link rel="prefetch" href="/assets/js/39.bf967d40.js"><link rel="prefetch" href="/assets/js/4.706a5607.js"><link rel="prefetch" href="/assets/js/40.e1864fd6.js"><link rel="prefetch" href="/assets/js/41.61bd3b64.js"><link rel="prefetch" href="/assets/js/42.34d8d61d.js"><link rel="prefetch" href="/assets/js/43.1aee493f.js"><link rel="prefetch" href="/assets/js/44.22177e9b.js"><link rel="prefetch" href="/assets/js/45.5c743d2f.js"><link rel="prefetch" href="/assets/js/46.4feffac9.js"><link rel="prefetch" href="/assets/js/47.367f9103.js"><link rel="prefetch" href="/assets/js/48.0c246d45.js"><link rel="prefetch" href="/assets/js/49.ee354be9.js"><link rel="prefetch" href="/assets/js/5.7d9779f7.js"><link rel="prefetch" href="/assets/js/50.bd81c7f0.js"><link rel="prefetch" href="/assets/js/51.a5f432dd.js"><link rel="prefetch" href="/assets/js/52.537aded4.js"><link rel="prefetch" href="/assets/js/53.84814584.js"><link rel="prefetch" href="/assets/js/54.5f780e97.js"><link rel="prefetch" href="/assets/js/55.9d44c91d.js"><link rel="prefetch" href="/assets/js/56.fc164b43.js"><link rel="prefetch" href="/assets/js/57.959b2d44.js"><link rel="prefetch" href="/assets/js/58.bd5c38e0.js"><link rel="prefetch" href="/assets/js/59.3eaece52.js"><link rel="prefetch" href="/assets/js/6.49a49457.js"><link rel="prefetch" href="/assets/js/60.4b8cb735.js"><link rel="prefetch" href="/assets/js/61.b54b9195.js"><link rel="prefetch" href="/assets/js/62.0116614c.js"><link rel="prefetch" href="/assets/js/63.85b1247d.js"><link rel="prefetch" href="/assets/js/64.8f1be6b5.js"><link rel="prefetch" href="/assets/js/65.6a241647.js"><link rel="prefetch" href="/assets/js/66.08c8bd13.js"><link rel="prefetch" href="/assets/js/67.002e0071.js"><link rel="prefetch" href="/assets/js/68.6c6a7c94.js"><link rel="prefetch" href="/assets/js/69.64d90e5d.js"><link rel="prefetch" href="/assets/js/7.469d3b64.js"><link rel="prefetch" href="/assets/js/70.b2c287c9.js"><link rel="prefetch" href="/assets/js/71.b7ad1135.js"><link rel="prefetch" href="/assets/js/72.7391b5c2.js"><link rel="prefetch" href="/assets/js/73.c5c77d81.js"><link rel="prefetch" href="/assets/js/74.96f80ffd.js"><link rel="prefetch" href="/assets/js/75.2920c7b7.js"><link rel="prefetch" href="/assets/js/76.a90bd3c9.js"><link rel="prefetch" href="/assets/js/77.3a0eeccd.js"><link rel="prefetch" href="/assets/js/78.6791678c.js"><link rel="prefetch" href="/assets/js/79.8b0c78e4.js"><link rel="prefetch" href="/assets/js/8.b36167bf.js"><link rel="prefetch" href="/assets/js/80.2641b89d.js"><link rel="prefetch" href="/assets/js/81.03d1925e.js"><link rel="prefetch" href="/assets/js/82.71061708.js"><link rel="prefetch" href="/assets/js/83.df220a8f.js"><link rel="prefetch" href="/assets/js/84.99fbef8f.js"><link rel="prefetch" href="/assets/js/85.dee8bcae.js"><link rel="prefetch" href="/assets/js/86.5200e4ce.js"><link rel="prefetch" href="/assets/js/87.96df0d82.js"><link rel="prefetch" href="/assets/js/88.e9171a32.js"><link rel="prefetch" href="/assets/js/89.53987bbc.js"><link rel="prefetch" href="/assets/js/9.5bed6ebe.js"><link rel="prefetch" href="/assets/js/90.8da0ff06.js"><link rel="prefetch" href="/assets/js/91.4bcce2cd.js"><link rel="prefetch" href="/assets/js/92.aca18707.js"><link rel="prefetch" href="/assets/js/93.93fdf568.js"><link rel="prefetch" href="/assets/js/94.e893b256.js"><link rel="prefetch" href="/assets/js/95.cb1d62b6.js"><link rel="prefetch" href="/assets/js/96.5529545c.js"><link rel="prefetch" href="/assets/js/97.d01eda68.js"><link rel="prefetch" href="/assets/js/98.384bebd6.js"><link rel="prefetch" href="/assets/js/99.fa349b8f.js"><link rel="prefetch" href="/assets/js/vendors~docsearch.aa72e838.js">
<link rel="stylesheet" href="/assets/css/styles.0ff943f0.css">
</head>
<body>
<div id="app" data-server-rendered="true"><div class="theme-container vuepress-theme-fast"><header class="navbar"><div class="sidebar-button"><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" role="img" viewBox="0 0 448 512" class="icon"><path fill="currentColor" d="M436 124H12c-6.627 0-12-5.373-12-12V80c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12zm0 160H12c-6.627 0-12-5.373-12-12v-32c0-6.627 5.373-12 12-12h424c6.627 0 12 5.373 12 12v32c0 6.627-5.373 12-12 12z"></path></svg></div><a href="/" class="home-link router-link-active"><img src="/logo@2x.svg" alt="WEEX" class="logo"></a><span class="version"><a href="/download/download.html" class="version-bg"><img src="/assets/img/version-bg.ab65ded9.svg" alt="v0.28"><span class="version-no">v0.28</span></a></span><div class="links"><form id="search-form" class="algolia-search-wrapper search-box"><input id="algolia-search-input" class="search-query"></form><nav class="nav-links can-hide"><div class="nav-item"><a href="/guide/" class="nav-link router-link-active">Guide</a></div><div class="nav-item"><a href="/docs/" class="nav-link">Docs</a></div><div class="nav-item"><a href="/tools/" class="nav-link">Third Party Tools</a></div><div class="nav-item"><a href="/download/" class="nav-link">Download</a></div><div class="nav-item"><a href="/community/" class="nav-link">Community</a></div><div class="nav-item"><a href="/blog/" class="nav-link">Blog</a></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Languages</span><span class="arrow right"></span></a><ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----><a href="/guide/extend/extend-android.html" class="nav-link router-link-exact-active router-link-active">English</a></li><li class="dropdown-item"><!----><a href="/zh/guide/extend/extend-android.html" class="nav-link">简体中文</a></li></ul></div></div></nav><a href="https://github.com/apache/incubator-weex" target="_blank" rel="noopener noreferrer" class="repo-link"><img src="/assets/img/github.7cb484a9.svg" alt="github" class="github-icon"></a></div></header><div class="sidebar-mask"></div><div class="sidebar"><nav class="nav-links"><div class="nav-item"><a href="/guide/" class="nav-link router-link-active">Guide</a></div><div class="nav-item"><a href="/docs/" class="nav-link">Docs</a></div><div class="nav-item"><a href="/tools/" class="nav-link">Third Party Tools</a></div><div class="nav-item"><a href="/download/" class="nav-link">Download</a></div><div class="nav-item"><a href="/community/" class="nav-link">Community</a></div><div class="nav-item"><a href="/blog/" class="nav-link">Blog</a></div><div class="nav-item"><div class="dropdown-wrapper"><a class="dropdown-title"><span class="title">Languages</span><span class="arrow right"></span></a><ul class="nav-dropdown" style="display:none;"><li class="dropdown-item"><!----><a href="/guide/extend/extend-android.html" class="nav-link router-link-exact-active router-link-active">English</a></li><li class="dropdown-item"><!----><a href="/zh/guide/extend/extend-android.html" class="nav-link">简体中文</a></li></ul></div></div></nav><ul class="sidebar-links"><li><div class="sidebar-group first"><p class="sidebar-heading"><span>Getting Started</span><!----></p><ul class="sidebar-group-items"><li><a href="/guide/introduction.html" class="sidebar-link">Introduction</a></li><li><a href="/guide/front-end-frameworks.html" class="sidebar-link">Front-End Frameworks</a></li><li><a href="/guide/platform-difference.html" class="sidebar-link">Platform Difference</a></li><li><a href="/guide/use-vue-in-weex.html" class="sidebar-link">Use Vue in Weex</a></li><li><a href="/guide/use-rax-in-weex.html" class="sidebar-link">Use Rax in Weex</a></li><li><a href="/guide/playground.html" class="sidebar-link">Playground App</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Develop</span><!----></p><ul class="sidebar-group-items"><li><a href="/guide/develop/setup-develop-environment.html" class="sidebar-link">Setup Develop Environment</a></li><li><a href="/guide/develop/create-a-new-app.html" class="sidebar-link">Create a New App</a></li><li><a href="/guide/develop/weex_cli.html" class="sidebar-link">Weex CLI</a></li><li><a href="/guide/develop/integrate-to-android-app.html" class="sidebar-link">Integrate to Android</a></li><li><a href="/guide/develop/integrate-to-iOS-app.html" class="sidebar-link">Integrate to iOS</a></li><li><a href="/guide/develop/weex_error_code.html" class="sidebar-link">WeexErrorCode</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Debug</span><!----></p><ul class="sidebar-group-items"><li><a href="/guide/debug/integrate-devtool-to-android.html" class="sidebar-link">Integrate Devtool to Android</a></li><li><a href="/guide/debug/integrate-devtool-to-ios.html" class="sidebar-link">Integrate Devtool to iOS</a></li><li><a href="/guide/debug/debug.html" class="sidebar-link">Debug</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading open"><span>Extend</span><!----></p><ul class="sidebar-group-items"><li><a href="/guide/extend/extend-android.html" class="active sidebar-link">Extend Android</a><ul class="sidebar-sub-headers"><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#jsenv-extend" class="sidebar-link">JSEnv Extend</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#module-extend" class="sidebar-link">Module extend</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#register-module" class="sidebar-link">Register module</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#javascript-callback" class="sidebar-link">Javascript callback</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#component-extension-adaptation" class="sidebar-link">Component extension adaptation</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#register-component" class="sidebar-link">Register component</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#extend-adapter" class="sidebar-link">Extend adapter</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#set-up-various-adapters" class="sidebar-link">Set up various adapters</a></li><li class="sidebar-sub-header"><a href="/guide/extend/extend-android.html#proguard-rules" class="sidebar-link">Proguard Rules</a></li></ul></li><li><a href="/guide/extend/extend-ios.html" class="sidebar-link">Extend iOS</a></li><li><a href="/guide/extend/extend-ios-with-swift.html" class="sidebar-link">Extend iOS with Swift</a></li><li><a href="/guide/extend/extend-web.html" class="sidebar-link">Extend Web Renderer</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Advanced</span><!----></p><ul class="sidebar-group-items"><li><a href="/guide/advanced/asset-path.html" class="sidebar-link">Asset Path</a></li><li><a href="/guide/advanced/downgrade.html" class="sidebar-link">Downgrade</a></li><li><a href="/guide/advanced/use-vuex-and-vue-router.html" class="sidebar-link">Use Vuex and vue-router</a></li><li><a href="/guide/advanced/multi-size-screen.html" class="sidebar-link">Fit for multi-size screen</a></li></ul></div></li><li><div class="sidebar-group"><p class="sidebar-heading"><span>Contribute</span><!----></p><ul class="sidebar-group-items"><li><a href="/guide/contribute/how-to-contribute.html" class="sidebar-link">Join Weex community</a></li><li><a href="/guide/contribute/thanks.html" class="sidebar-link">Thanks</a></li></ul></div></li></ul></div><div class="page"><div class="content"><h2 id="jsenv-extend"><a href="#jsenv-extend" class="header-anchor">#</a> JSEnv Extend</h2><h3 id="api"><a href="#api" class="header-anchor">#</a> Api</h3><div class="language- extra-class"><pre class="language-text"><code>
Map&lt;String, Object&gt; options = new HashMap();
options.set(&quot;testVlaue&quot;,&quot;hello&quot;);
//....
instance.render(pagename, template,options);
</code></pre></div><h3 id="usage"><a href="#usage" class="header-anchor">#</a> usage</h3><div class="language- extra-class"><pre class="language-text"><code>var value = weex.config.testValue;
console.log(value);
</code></pre></div><h2 id="module-extend"><a href="#module-extend" class="header-anchor">#</a> Module extend</h2><ol><li>Customize modules class must extend from WXModule.</li><li>Extended method must add @JSMethod (uiThread = false or true) annotation, which determines whether the method is run on UI thread.</li><li>The access level of method must be <code>public</code>.</li><li>Do not obfuscate code using tools like ProGuard.</li><li>Extended method suppport the data type of int, double, float, String, Map, List as its param.</li><li>Register the module: <code>WXSDKEngine.registerModule(&quot;MyModule&quot;, MyModule.class);</code>or else may report an error: <code>ReportException :undefined:9: TypeError: Object #&lt;Object&gt; has no method 'xxx'</code> .</li></ol><p>Refer to the following example:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token class-name">MyModule</span> <span class="token keyword">extends</span> <span class="token class-name">WXModule</span><span class="token punctuation">{</span>
<span class="token comment">//run ui thread</span>
<span class="token annotation punctuation">@JSMethod</span> <span class="token punctuation">(</span>uiThread <span class="token operator">=</span> <span class="token boolean">true</span><span class="token punctuation">)</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">printLog</span><span class="token punctuation">(</span><span class="token class-name">String</span> msg<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token class-name">Toast</span><span class="token punctuation">.</span><span class="token function">makeText</span><span class="token punctuation">(</span>mWXSDKInstance<span class="token punctuation">.</span><span class="token function">getContext</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">,</span>msg<span class="token punctuation">,</span><span class="token class-name">Toast</span><span class="token punctuation">.</span>LENGTH_SHORT<span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">show</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token comment">//run JS thread</span>
<span class="token annotation punctuation">@JSMethod</span> <span class="token punctuation">(</span>uiThread <span class="token operator">=</span> <span class="token boolean">false</span><span class="token punctuation">)</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">fireEventSyncCall</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
<span class="token comment">//implement your module logic here</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre></div><p>Register the module</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token class-name">WXSDKEngine</span><span class="token punctuation">.</span><span class="token function">registerModule</span><span class="token punctuation">(</span><span class="token string">&quot;MyModule&quot;</span><span class="token punctuation">,</span> <span class="token class-name">MyModule</span><span class="token punctuation">.</span><span class="token keyword">class</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Use this module in weex DSL
Now <code>event</code> moudle is avaiable in weex, use the module like this:</p><div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>text</span> <span class="token attr-name">onclick</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">&quot;</span>click<span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>testMyModule<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>text</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token punctuation">{</span>
methods<span class="token punctuation">:</span> <span class="token punctuation">{</span>
<span class="token function-variable function">click</span><span class="token punctuation">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
weex<span class="token punctuation">.</span><span class="token function">requireModule</span><span class="token punctuation">(</span><span class="token string">'MyModule'</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">printLog</span><span class="token punctuation">(</span><span class="token string">&quot;I am a weex Module!&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre></div><h2 id="register-module"><a href="#register-module" class="header-anchor">#</a> Register module</h2><p>registerModule(moduleName,moduleClass)</p><ul><li><code>return</code>(<em>bool</em>): register success</li><li><code>moduleName</code>(<em>String</em>): module name</li><li><code>moduleClass</code>(<em>Class</em>): the Java class of the module, which provide a constructor with an empty parameter.</li></ul><p>使用方式:</p><div class="language- extra-class"><pre class="language-text"><code>WXSDKEngine.registerModule(&quot;picker&quot;, WXPickersModule.class);
</code></pre></div><h2 id="javascript-callback"><a href="#javascript-callback" class="header-anchor">#</a> Javascript callback</h2><p>If the module need implement a callback to javascript, you just add <code>JSCallback</code> argument to the method you want expose to javascript:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token annotation punctuation">@WXModuleAnno</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">openURL</span><span class="token punctuation">(</span><span class="token class-name">String</span> url<span class="token punctuation">,</span><span class="token class-name">JSCallback</span> callback<span class="token punctuation">)</span><span class="token punctuation">{</span>
<span class="token comment">//implement your module logic here</span>
<span class="token class-name">Map</span><span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">String</span><span class="token punctuation">,</span><span class="token class-name">Object</span><span class="token punctuation">&gt;</span></span> resp <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">HashMap</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
resp<span class="token punctuation">.</span><span class="token function">put</span><span class="token punctuation">(</span><span class="token string">&quot;result&quot;</span><span class="token punctuation">,</span><span class="token string">&quot;ok&quot;</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
callback<span class="token punctuation">.</span><span class="token function">invoke</span><span class="token punctuation">(</span>resp<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
</code></pre></div><p>At the javascript side, call the module with javascript function to receive callback data:</p><div class="language-javascript extra-class"><pre class="language-javascript"><code>event<span class="token punctuation">.</span><span class="token function">openURL</span><span class="token punctuation">(</span><span class="token string">&quot;http://www.github.com&quot;</span><span class="token punctuation">,</span><span class="token keyword">function</span><span class="token punctuation">(</span><span class="token parameter">resp</span><span class="token punctuation">)</span><span class="token punctuation">{</span> console<span class="token punctuation">.</span><span class="token function">log</span><span class="token punctuation">(</span>resp<span class="token punctuation">.</span>result<span class="token punctuation">)</span><span class="token punctuation">;</span> <span class="token punctuation">}</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h2 id="component-extension-adaptation"><a href="#component-extension-adaptation" class="header-anchor">#</a> Component extension adaptation</h2><h3 id="weex-sdk-version-v0-19"><a href="#weex-sdk-version-v0-19" class="header-anchor">#</a> weex_sdk version &gt;= v0.19+</h3><h4 id="abstract"><a href="#abstract" class="header-anchor">#</a> Abstract</h4><p>The WXDomObject and Layout engines are sunk into WeexCore using C++, and the WXDomObject in Java code has been removed. The 0.19 version of the upgrade involves interface changes to WXComponent and WXDomObject.</p><h4 id="migration-guide"><a href="#migration-guide" class="header-anchor">#</a> Migration guide</h4><h5 id="setmeasurefunction-migrate"><a href="#setmeasurefunction-migrate" class="header-anchor">#</a> setMeasureFunction migrate</h5><p>The setMeasureFunction() method in WXDomObject was migrated to WXComponent:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">protected</span> <span class="token keyword">void</span> <span class="token function">setMeasureFunction</span><span class="token punctuation">(</span><span class="token keyword">final</span> <span class="token class-name">ContentBoxMeasurement</span> contentBoxMeasurement<span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>See: com.taobao.weex.layout.ContentBoxMeasurement.java</p><p>Demo: WXText.java / setMeasureFunction()</p><p>Note：ContentBoxMeasurement only supports leaf nodes.</p><h5 id="wxcomponent-interface-change"><a href="#wxcomponent-interface-change" class="header-anchor">#</a> WXComponent Interface change</h5><h6 id="getdomobject-delete"><a href="#getdomobject-delete" class="header-anchor">#</a> getDomObject [Delete]</h6><p>Since the WXDomObject sinks to WeexCore, the WXComponent's getDomObject() method has been removed.</p><h6 id="constructor-parameter-change"><a href="#constructor-parameter-change" class="header-anchor">#</a> Constructor [Parameter change]</h6><p>The constructor of WXComponent removes the parameter of type WXDomObject, adds a parameter of type BasicComponentData, and the remaining parameters remain unchanged:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token class-name">WXComponent</span><span class="token punctuation">(</span><span class="token class-name">WXSDKInstance</span> instance<span class="token punctuation">,</span> <span class="token class-name">WXVContainer</span> parent<span class="token punctuation">,</span> <span class="token keyword">int</span> type<span class="token punctuation">,</span> <span class="token class-name">BasicComponentData</span> basicComponentData<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token class-name">WXComponent</span><span class="token punctuation">(</span><span class="token class-name">WXSDKInstance</span> instance<span class="token punctuation">,</span> <span class="token class-name">WXVContainer</span> parent<span class="token punctuation">,</span> <span class="token class-name">BasicComponentData</span> basicComponentData<span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h5 id="wxdomobject-interface-change"><a href="#wxdomobject-interface-change" class="header-anchor">#</a> WXDomObject Interface change</h5><p>You can't access and inherit WXDomObject using Java code, (the ImmutableDomObject.java has also been removed), some of the methods in WXDomObject have been migrated to WXComponent if you need to use them:</p><h6 id="wxdomobject-gettype-wxcomponent-getcomponenttype-migrate"><a href="#wxdomobject-gettype-wxcomponent-getcomponenttype-migrate" class="header-anchor">#</a> WXDomObject.getType() -&gt; WXComponent.getComponentType() [Migrate]</h6><p>The getType() method in WXDomObject is used to get the type of Component (for example: list, div, text, img...). After migrating to WXComponent, it is renamed to:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token class-name">String</span> <span class="token function">getComponentType</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h6 id="some-methods-for-layout-results-migrate"><a href="#some-methods-for-layout-results-migrate" class="header-anchor">#</a> Some methods for Layout results [Migrate]</h6><p>Migrating from WXDomObject to WXComponent:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getCSSLayoutTop</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getCSSLayoutBottom</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getCSSLayoutLeft</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getCSSLayoutRight</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getLayoutWidth</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getLayoutHeight</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Remove two obsolete interfaces:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getLayoutY</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token keyword">float</span> <span class="token function">getLayoutX</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><h3 id="weex-sdk-version-v0-19-2"><a href="#weex-sdk-version-v0-19-2" class="header-anchor">#</a> weex_sdk version &lt; v0.19</h3><ol><li>Customize components must extend from WXComponent</li><li>Use the <code>@WXComponentProp(name = value(value is attr or style))</code> annotation to let the update of attribute or style be recognized automatically.</li><li>The access levels of method must be <strong>public</strong></li><li>Customize can not be obfuscated by tools like ProGuard</li><li>Component method with the annotation of <code>@JSMethod</code> can</li><li>Weex params can be int, double, float, String, Map, List, Array</li><li>Register your Component by <code>WXSDKEngine.registerComponent</code></li></ol><p>Refer to the following example</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token class-name">RichText</span> <span class="token keyword">extends</span> <span class="token class-name">WXComponent</span><span class="token generics"><span class="token punctuation">&lt;</span><span class="token class-name">TextView</span><span class="token punctuation">&gt;</span></span> <span class="token punctuation">{</span>
<span class="token keyword">public</span> <span class="token class-name">RichText</span><span class="token punctuation">(</span><span class="token class-name">WXSDKInstance</span> instance<span class="token punctuation">,</span> <span class="token class-name">WXDomObject</span> dom<span class="token punctuation">,</span> <span class="token class-name">WXVContainer</span> parent<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">super</span><span class="token punctuation">(</span>instance<span class="token punctuation">,</span> dom<span class="token punctuation">,</span> parent<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token annotation punctuation">@Override</span>
<span class="token keyword">protected</span> <span class="token class-name">TextView</span> <span class="token function">initComponentHostView</span><span class="token punctuation">(</span><span class="token annotation punctuation">@NonNull</span> <span class="token class-name">Context</span> context<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token class-name">TextView</span> textView <span class="token operator">=</span> <span class="token keyword">new</span> <span class="token class-name">TextView</span><span class="token punctuation">(</span>context<span class="token punctuation">)</span><span class="token punctuation">;</span>
textView<span class="token punctuation">.</span><span class="token function">setTextSize</span><span class="token punctuation">(</span><span class="token number">22</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
textView<span class="token punctuation">.</span><span class="token function">setTextColor</span><span class="token punctuation">(</span><span class="token class-name">Color</span><span class="token punctuation">.</span>BLACK<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">return</span> textView<span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token annotation punctuation">@WXComponentProp</span><span class="token punctuation">(</span>name <span class="token operator">=</span> <span class="token string">&quot;tel&quot;</span><span class="token punctuation">)</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">setTel</span><span class="token punctuation">(</span><span class="token class-name">String</span> telNumber<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token function">getHostView</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">setText</span><span class="token punctuation">(</span><span class="token string">&quot;tel: &quot;</span> <span class="token operator">+</span> telNumber<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre></div><p>Register your Component：</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token class-name">WXSDKEngine</span><span class="token punctuation">.</span><span class="token function">registerComponent</span><span class="token punctuation">(</span><span class="token string">&quot;richText&quot;</span><span class="token punctuation">,</span> <span class="token class-name">RichText</span><span class="token punctuation">.</span><span class="token keyword">class</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
</code></pre></div><p>Use this component in weex DSL：</p><div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>richText</span> <span class="token attr-name">tel</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">&quot;</span>12305<span class="token punctuation">&quot;</span></span><span class="token style-attr language-css"><span class="token attr-name"> <span class="token attr-name">style</span></span><span class="token punctuation">=&quot;</span><span class="token attr-value"><span class="token property">width</span><span class="token punctuation">:</span>200<span class="token punctuation">;</span><span class="token property">height</span><span class="token punctuation">:</span>100</span><span class="token punctuation">&quot;</span></span><span class="token punctuation">&gt;</span></span>12305<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>richText</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>div</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
</code></pre></div><h4 id="extend-component-method"><a href="#extend-component-method" class="header-anchor">#</a> Extend Component Method</h4><p>WeexSDK <code>(0.9.5+)</code> support the component method that can be invoked
for example：</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token annotation punctuation">@JSMethod</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">focus</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
<span class="token comment">//method implementation</span>
<span class="token punctuation">}</span>
</code></pre></div><p>after your registration for your own custom component, now you can call it in your js file.</p><div class="language-html extra-class"><pre class="language-html"><code><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>mycomponent</span> <span class="token attr-name">ref</span><span class="token attr-value"><span class="token punctuation">=</span><span class="token punctuation">'</span>mycomponent<span class="token punctuation">'</span></span><span class="token punctuation">&gt;</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>mycomponent</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>template</span><span class="token punctuation">&gt;</span></span>
<span class="token tag"><span class="token tag"><span class="token punctuation">&lt;</span>script</span><span class="token punctuation">&gt;</span></span><span class="token script"><span class="token language-javascript">
module<span class="token punctuation">.</span>exports <span class="token operator">=</span> <span class="token punctuation">{</span>
<span class="token function-variable function">created</span><span class="token punctuation">:</span> <span class="token keyword">function</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">this</span><span class="token punctuation">.</span>$refs<span class="token punctuation">.</span>mycomponent<span class="token punctuation">.</span><span class="token function">focus</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</span></span><span class="token tag"><span class="token tag"><span class="token punctuation">&lt;/</span>script</span><span class="token punctuation">&gt;</span></span>
</code></pre></div><h2 id="register-component"><a href="#register-component" class="header-anchor">#</a> Register component</h2><h3 id="registercomponent-type-class-appendtree"><a href="#registercomponent-type-class-appendtree" class="header-anchor">#</a><strong>registerComponent(type,class,appendTree)</strong></h3><ul><li><code>return</code>(<em>bool</em>): register success</li><li><code>type</code>(<em>String</em>): component's name,such as <code>div</code></li><li><code>class</code>(<em>Class</em>): ComponentClass，called when init component</li><li><code>appendTree</code>(<em>bool</em>): render option logic，default false
<ul><li>if true，render compoent tree one-time</li><li>if false，render component one by one</li></ul></li></ul><p>usage:</p><div class="language- extra-class"><pre class="language-text"><code>WXSDKEngine.registerComponent(&quot;video&quot;, WXVideo.class, false);
</code></pre></div><h3 id="registercomponent-holder-appendtree，-names"><a href="#registercomponent-holder-appendtree，-names" class="header-anchor">#</a><strong>registerComponent(holder,appendTree，...names)</strong></h3><ul><li><code>return</code>(<em>bool</em>): register success</li><li><code>holder</code>(<em>IFComponentHolder</em>): abstract factory designed for create Component, and <strong>SimpleComponentHolder</strong> is the a simple way to achieve IFComponentHolder.</li><li><code>appendTree</code>: see <code>registerComponent(type,class,appendTree)</code></li><li><code>names</code>(<em>String ...</em>): component's name in front end template file</li></ul><p>usage:</p><div class="language- extra-class"><pre class="language-text"><code>WXSDKEngine.registerComponent(
new SimpleComponentHolder(
WXText.class,
new WXText.Creator()
),
false,
&quot;text&quot;
);
</code></pre></div><h2 id="extend-adapter"><a href="#extend-adapter" class="header-anchor">#</a> Extend adapter</h2><h3 id="imagedownloadadapter"><a href="#imagedownloadadapter" class="header-anchor">#</a> ImagedownloadAdapter</h3><p>Weex SDK has no image download capability, you need to implement <code>IWXImgLoaderAdapter</code>.</p><p>Refer to the following example</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token class-name">ImageAdapter</span> <span class="token keyword">implements</span> <span class="token class-name">IWXImgLoaderAdapter</span> <span class="token punctuation">{</span>
<span class="token keyword">public</span> <span class="token class-name">ImageAdapter</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token punctuation">}</span>
<span class="token annotation punctuation">@Override</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">setImage</span><span class="token punctuation">(</span><span class="token keyword">final</span> <span class="token class-name">String</span> url<span class="token punctuation">,</span> <span class="token keyword">final</span> <span class="token class-name">ImageView</span> view<span class="token punctuation">,</span>
<span class="token class-name">WXImageQuality</span> quality<span class="token punctuation">,</span> <span class="token class-name">WXImageStrategy</span> strategy<span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token class-name">WXSDKManager</span><span class="token punctuation">.</span><span class="token function">getInstance</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span><span class="token function">postOnUiThread</span><span class="token punctuation">(</span><span class="token keyword">new</span> <span class="token class-name">Runnable</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token annotation punctuation">@Override</span>
<span class="token keyword">public</span> <span class="token keyword">void</span> <span class="token function">run</span><span class="token punctuation">(</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">if</span><span class="token punctuation">(</span>view<span class="token operator">==</span><span class="token keyword">null</span><span class="token operator">||</span>view<span class="token punctuation">.</span><span class="token function">getLayoutParams</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token operator">==</span><span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">{</span>
<span class="token keyword">return</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token keyword">if</span> <span class="token punctuation">(</span><span class="token class-name">TextUtils</span><span class="token punctuation">.</span><span class="token function">isEmpty</span><span class="token punctuation">(</span>url<span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
view<span class="token punctuation">.</span><span class="token function">setImageBitmap</span><span class="token punctuation">(</span><span class="token keyword">null</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token keyword">return</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token class-name">String</span> temp <span class="token operator">=</span> url<span class="token punctuation">;</span>
<span class="token keyword">if</span> <span class="token punctuation">(</span>url<span class="token punctuation">.</span><span class="token function">startsWith</span><span class="token punctuation">(</span><span class="token string">&quot;//&quot;</span><span class="token punctuation">)</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
temp <span class="token operator">=</span> <span class="token string">&quot;http:&quot;</span> <span class="token operator">+</span> url<span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token keyword">if</span> <span class="token punctuation">(</span>view<span class="token punctuation">.</span><span class="token function">getLayoutParams</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span>width <span class="token operator">&lt;=</span> <span class="token number">0</span> <span class="token operator">||</span> view<span class="token punctuation">.</span><span class="token function">getLayoutParams</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">.</span>height <span class="token operator">&lt;=</span> <span class="token number">0</span><span class="token punctuation">)</span> <span class="token punctuation">{</span>
<span class="token keyword">return</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token class-name">Picasso</span><span class="token punctuation">.</span><span class="token keyword">with</span><span class="token punctuation">(</span><span class="token class-name">WXEnvironment</span><span class="token punctuation">.</span><span class="token function">getApplication</span><span class="token punctuation">(</span><span class="token punctuation">)</span><span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">load</span><span class="token punctuation">(</span>temp<span class="token punctuation">)</span>
<span class="token punctuation">.</span><span class="token function">into</span><span class="token punctuation">(</span>view<span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span><span class="token punctuation">,</span><span class="token number">0</span><span class="token punctuation">)</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token punctuation">}</span>
</code></pre></div><h2 id="set-up-various-adapters"><a href="#set-up-various-adapters" class="header-anchor">#</a> Set up various adapters</h2><h3 id="imageadapter"><a href="#imageadapter" class="header-anchor">#</a> ImageAdapter</h3><p>Image adapter is responsible for loading images according to URLs. There are two types of image adapter:</p><ol><li>Loading a image to a view according to URL.</li><li>Loading a image to a specified object according to URL.</li></ol><p>In order to use image component, one must implement the first adapter, while the second adapter is optional.</p><h4 id="iwximgloaderadapter"><a href="#iwximgloaderadapter" class="header-anchor">#</a> IWXImgLoaderAdapter</h4><pre><code>public interface IWXImgLoaderAdapter {
void setImage(String url, ImageView view, WXImageQuality quality, WXImageStrategy strategy);
}
</code></pre><ul><li><code>WXImageQuality</code> that the quality of the picture variables, take the following values <code>LOW</code>, <code>NORMAL</code>, <code>HIGH</code>, <code>ORIGINAL</code> picture quality in turn higher. The default is <code>LOW</code>.</li><li><code>WXImageStrategy</code> is an extension class that indicates whether the image can be cut (isClipping) sharpening (isSharpen) placeholder (placeHolder) and so on.</li></ul><h4 id="idrawableloaderadapter"><a href="#idrawableloaderadapter" class="header-anchor">#</a> IDrawableLoaderAdapter</h4><p>This adapter is optional.</p><pre><code>void setDrawable(String url, DrawableTarget drawableTarget, DrawableStrategy drawableStrategy);
</code></pre><ul><li><code>DrawableTarget</code> is a object into where will load an image. <code>DrawableTarget</code> is one of <code>StaticTarget</code> or <code>AnimatedTarget</code>.</li></ul><h3 id="iwxhttpadapter"><a href="#iwxhttpadapter" class="header-anchor">#</a> IWXHttpAdapter</h3><p>Weex custom <code>WXRequest</code> and <code>OnHttpListener</code>, Native reload interface can be obtained from the Request URL, Header and other parameters, the network request can be completed through <code>OnHttpListener</code> callback notification. Weex provides the default network request: <code>DefaultWXHttpAdapter</code>, using <code>HttpURLConnection</code> for network requests.</p><p>The interface is defined as follows:</p><div class="language- extra-class"><pre class="language-text"><code>public interface IWXHttpAdapter {
void sendRequest(WXRequest request, OnHttpListener listener);
}
</code></pre></div><h4 id="wxrequest"><a href="#wxrequest" class="header-anchor">#</a> WXRequest</h4><ul><li><code>WXRequest</code> defines the parameters related to the network request, the request method, the request body, and the timeout time. Weex default timeout is 3s.</li></ul><h4 id="onhttplistener"><a href="#onhttplistener" class="header-anchor">#</a> OnHttpListener</h4><div class="language- extra-class"><pre class="language-text"><code> interface OnHttpListener {
/**
* start request
*/
void onHttpStart();
/**
* headers received
*/
void onHeadersReceived(int statusCode,Map&lt;String,List&lt;String&gt;&gt; headers);
/**
* post progress
* @param uploadProgress
*/
void onHttpUploadProgress(int uploadProgress);
/**
* response loaded length (bytes), full length should read from headers (content-length)
* @param loadedLength
*/
void onHttpResponseProgress(int loadedLength);
/**
* http response finish
* @param response
*/
void onHttpFinish(WXResponse response);
}
</code></pre></div><h3 id="iwxusertrackadapter"><a href="#iwxusertrackadapter" class="header-anchor">#</a> IWXUserTrackAdapter</h3><p>Weex related performance data (first screen loading time, JS-Native communication time, dom update time, etc.) and other general information (JSLib file size, Weex SDK version number, etc.).</p><div class="language- extra-class"><pre class="language-text"><code>public interface IWXUserTrackAdapter {
void commit(Context context, String eventId, String type, WXPerformance perf, Map&lt;String, Serializable&gt; params);
}
</code></pre></div><p>Native implementation interface can be obtained through <code>WXPerformance</code> and <code>params</code> corresponding information.</p><h3 id="iactivitynavbarsetter"><a href="#iactivitynavbarsetter" class="header-anchor">#</a> IActivityNavBarSetter</h3><p>Weex provided the ability of navigation through <code>WXNavigatorModule</code> which relys on IActivityNavBarSetter.</p><p>Usage:</p><div class="language- extra-class"><pre class="language-text"><code>WXSDKEngine.setActivityNavBarSetter(new IActivityNavBarSetter(){});
</code></pre></div><h3 id="iwxstorageadapter"><a href="#iwxstorageadapter" class="header-anchor">#</a> IWXStorageAdapter</h3><p>Weex provided the ability of local storage through <code>WXStorageModule</code> which depends on IWXStorageAdapter. One can use <code>DefaultWXStorage</code> as the default implementation of IWXStorageAdapter.</p><h3 id="iwxjsexceptionadapter"><a href="#iwxjsexceptionadapter" class="header-anchor">#</a> IWXJSExceptionAdapter</h3><p>IWXJSExceptionAdapter is used to handle weex exception.</p><ul><li>DownLoadException</li><li>WhiteSceenException</li><li>JSException</li><li>DownGradeException</li></ul><div class="language- extra-class"><pre class="language-text"><code>public interface IWXJSExceptionAdapter {
void onJSException(WXJSExceptionInfo exception);
}
</code></pre></div><p>usage：</p><div class="language- extra-class"><pre class="language-text"><code>WXSDKEngine.setJSExcetptionAdapter(new TestExceptionAdapter());
</code></pre></div><h2 id="proguard-rules"><a href="#proguard-rules" class="header-anchor">#</a> Proguard Rules</h2><p>If you want to using proguard to protect your source code, please add the following rules to your profile:</p><div class="language-java extra-class"><pre class="language-java"><code><span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span><span class="token class-name">WXDebugTool</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>devtools<span class="token punctuation">.</span>common<span class="token punctuation">.</span><span class="token class-name">LogUtil</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keepclassmembers <span class="token keyword">class</span> <span class="token operator">*</span><span class="token operator">*</span> <span class="token punctuation">{</span>
<span class="token annotation punctuation">@com</span><span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>ui<span class="token punctuation">.</span>component<span class="token punctuation">.</span><span class="token class-name">WXComponentProp</span> <span class="token keyword">public</span> <span class="token operator">*</span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>bridge<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>dom<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>adapter<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>common<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> <span class="token operator">*</span> <span class="token keyword">implements</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span><span class="token class-name">IWXObject</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>ui<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>ui<span class="token punctuation">.</span>component<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>utils<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span>
<span class="token keyword">public</span> <span class="token generics"><span class="token punctuation">&lt;</span>fields<span class="token punctuation">&gt;</span></span><span class="token punctuation">;</span>
<span class="token keyword">public</span> <span class="token generics"><span class="token punctuation">&lt;</span>methods<span class="token punctuation">&gt;</span></span><span class="token punctuation">;</span>
<span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>view<span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span><span class="token keyword">module</span><span class="token punctuation">.</span>*<span class="token operator">*</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token operator">*</span> <span class="token keyword">extends</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>common<span class="token punctuation">.</span><span class="token class-name">WXModule</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">public</span> <span class="token keyword">class</span> <span class="token operator">*</span> <span class="token keyword">extends</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>ui<span class="token punctuation">.</span>component<span class="token punctuation">.</span><span class="token class-name">WXComponent</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
<span class="token operator">-</span>keep <span class="token keyword">class</span> <span class="token operator">*</span> <span class="token keyword">implements</span> com<span class="token punctuation">.</span>taobao<span class="token punctuation">.</span>weex<span class="token punctuation">.</span>ui<span class="token punctuation">.</span><span class="token class-name">IExternalComponentGetter</span><span class="token punctuation">{</span><span class="token operator">*</span><span class="token punctuation">;</span><span class="token punctuation">}</span>
</code></pre></div></div><div class="page-nav"><p class="inner"><span class="prev">
←
<a href="/guide/debug/debug.html" class="prev">
Debug
</a></span><span class="next"><a href="/guide/extend/extend-ios.html">
Extend iOS
</a>
→
</span></p></div><div class="page-edit"><div class="last-updated"><span class="prefix">Last Updated: </span><span class="time">12/10/2020</span></div><div class="edit-link"><a href="https://github.com/apache/incubator-weex-site/edit/master/docs/guide/extend/extend-android.md" target="_blank" rel="noopener noreferrer">Edit this page</a><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg><a href="https://github.com/apache/incubator-weex-site/issues/new?body=https%3A%2F%2Fweex.io%2F" target="_blank" rel="noopener noreferrer" class="issueText">Suggest</a><svg xmlns="http://www.w3.org/2000/svg" aria-hidden="true" x="0px" y="0px" viewBox="0 0 100 100" width="15" height="15" class="icon outbound"><path fill="currentColor" d="M18.8,85.1h56l0,0c2.2,0,4-1.8,4-4v-32h-8v28h-48v-48h28v-8h-32l0,0c-2.2,0-4,1.8-4,4v56C14.8,83.3,16.6,85.1,18.8,85.1z"></path><polygon fill="currentColor" points="45.7,48.7 51.3,54.3 77.2,28.5 77.2,37.2 85.2,37.2 85.2,14.9 62.8,14.9 62.8,22.9 71.5,22.9"></polygon></svg></div><div class="score"><span class="choice"><img src="https://img.alicdn.com/tfs/TB1h7TSqpYqK1RjSZLeXXbXppXa-20-18.svg" class="score-icon">Excellent doc</span><span class="choice"><img src="https://img.alicdn.com/tfs/TB1h7TSqpYqK1RjSZLeXXbXppXa-20-18.svg" class="score-icon bad">Unusable doc</span></div></div><div class="license-wrap" style="display:none;"><footer class="footer-container" data-v-0ad13d84><div class="footer-body" data-v-0ad13d84><img src="/logo@2x.svg" class="logo" data-v-0ad13d84><img src="//img.alicdn.com/tfs/TB11BRiIW6qK1RjSZFmXXX0PFXa-365-365.png" class="apache" data-v-0ad13d84><div class="cols-container" data-v-0ad13d84><div class="col col-12" data-v-0ad13d84><h3 data-v-0ad13d84>Disclaimer</h3><p data-v-0ad13d84>Apache Weex is an effort undergoing incubation at The Apache Software Foundation (ASF), sponsored by the
Incubator. Incubation is required of all newly accepted projects until a further review indicates that the
infrastructure, communications, and decision making process have stabilized in a manner consistent with
other successful ASF projects. While incubation status is not necessarily a reflection of the completeness
or stability of the code, it does indicate that the project has yet to be fully endorsed by the ASF.</p></div><div class="col col-4" data-v-0ad13d84><dl data-v-0ad13d84><dt data-v-0ad13d84>ASF</dt><dd data-v-0ad13d84><a href="http://www.apache.org" target="_self" data-v-0ad13d84>Foundation</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/licenses/" target="_self" data-v-0ad13d84>License</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/events/current-event" target="_self" data-v-0ad13d84>Events</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/foundation/sponsorship.html" target="_self" data-v-0ad13d84>Sponsorship</a></dd><dd data-v-0ad13d84><a href="http://www.apache.org/foundation/thanks.html" target="_self" data-v-0ad13d84>Thanks</a></dd></dl></div><div class="col col-4" data-v-0ad13d84><dl data-v-0ad13d84><dt data-v-0ad13d84>Documentation</dt><dd data-v-0ad13d84><a href="/guide/develop/create-a-new-app.html" target="_self" data-v-0ad13d84>Quick start</a></dd><dd data-v-0ad13d84><a href="/guide/develop/setup-develop-environment.html" target="_self" data-v-0ad13d84>Developer guide</a></dd></dl></div><div class="col col-4" data-v-0ad13d84><dl data-v-0ad13d84><dt data-v-0ad13d84>Resources</dt><dd data-v-0ad13d84><a href="/blog/write-a-blog.html" target="_self" data-v-0ad13d84>Blog</a></dd><dd data-v-0ad13d84><a href="/community/" target="_self" data-v-0ad13d84>Community</a></dd><dd data-v-0ad13d84><a href="/guide/contribute/thanks.html" target="_self" data-v-0ad13d84>Thanks by Weex</a></dd><dd data-v-0ad13d84><a href="https://www.apache.org/security/" target="_self" data-v-0ad13d84>Security</a></dd></dl></div></div><div class="copyright" data-v-0ad13d84><span data-v-0ad13d84>Copyright © 2018-2019 The Apache Software Foundation. Apache and the Apache feather
logo are trademarks of The Apache Software Foundation.</span></div></div></footer></div></div><!----></div></div>
<script src="/assets/js/app.0ff943f0.js" defer></script><script src="/assets/js/100.09076a87.js" defer></script>
</body>
</html>