<h2><strong>Hello Weex</strong></h2>    <h3>简介</h3>    <p>hello-weex包括一个Weex App，和自己扩展的WeexiOSKit。</p>    <p>weex version为v0.7.0 - 10月16日的版本</p>    <p>Weex App 的代码位于examples目录下</p>    <p>WeexiOSKit的代码位于 ios/playground/WeexDemo/WeexiOSKit 目录下</p>    <h3><strong>运行</strong></h3>    <ol>     <li>环境      <ol>       <li>安装 <a href="/misc/goto?guid=4958189735229147892" rel="nofollow,noindex">Node.js</a> 4.0+</li>       <li>在根目录下        <ol>         <li>npm install , 安装工程</li>         <li>./start 到这里web版已经运行起来，浏览器输入 http://localhost:12580/ 就能看到了。</li>        </ol> </li>       <li>Install <a href="/misc/goto?guid=4959721925366439090" rel="nofollow,noindex">iOS Environment</a></li>       <li>Install <a href="/misc/goto?guid=4958993381732790925" rel="nofollow,noindex">CocoaPods</a></li>      </ol> </li>     <li>运行 iOS playground      <ol>       <li>cd ios/playground</li>       <li>pod install</li>       <li>在 Xcode里打开 WeexDemo.xcworkspace</li>       <li>点击Xcode的 ( Run 按钮) 或者用快捷键 cmd + r</li>       <li>如果你想在真机上运行. 在 DemoDefine.h , 修改 CURRENT_IP 为你自己的IP</li>      </ol> </li>    </ol>    <h3><strong>Weex App: Monkey for GitHub</strong></h3>    <p>Monkey主要是用来展示GitHub上的开发者的排名，以及仓库的排名。</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/5a23114ecd236f077e4f500a14e9d330.png"> <img src="https://simg.open-open.com/show/1d3f4b6fecc8cf20730d00d44442bbb2.png"></p>    <h3><strong>WeexiOSKit</strong></h3>    <p>WeexiOSKit主要是扩展了一些iOS的Component和Module，这样在weex端就可以很好的使用了。</p>    <p>Component 包括segmented-control（UISegmentedControl）,stepper（UIStepper）,seek-bar（UISeekBar）,search-bar（UISearchBar）,date-picker（UIDatePicker）。</p>    <p>Module主要包括actionSheet（UIActionSheet），MBProgressHUD（MBProgressHUD，loading视图），geolocation（CLLocationManager坐标），vibration（震动）。</p>    <p><strong>Component</strong></p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/9805afcaa3170e648fb2a2100fbcd35a.png"> <img src="https://simg.open-open.com/show/7273ec2dff5f1d2c1abd856e2de769cc.png"></p>    <p><strong>Module</strong></p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/6d19e572596fcf8ec1cbf24675f44d4c.png"> <img src="https://simg.open-open.com/show/6e9c965ee31857ddedc9cdd90e1ac3c4.png"> <img src="https://simg.open-open.com/show/694baa5c5fb7eb3efc14baeaefb5ff70.png"></p>    <h3><strong>WeexiOSKit使用</strong></h3>    <p><strong>Component</strong></p>    <p>segmented-control:支持iOS & web</p>    <p>属性:items(segmented-control里的项目，以分号隔开)，momentary（是否设置选中状态），tint-color（颜色）</p>    <p>event: onchange</p>    <pre>  <code class="language-javascript"><segmented-control style="width: 240;height: 120;margin-top:20" items="hello;world" momentary= "false" tint-color= "red" onchange="onSCChangeAction"></segmented-control></code></pre>    <p>stepper</p>    <p>属性: value(当前的值)，step-value（默认为1），minimum-value（最小值），maximum-value="100（最大值），tint-color（颜色）</p>    <p>event: onchange</p>    <pre>  <code class="language-javascript"><stepper style="width: 240;height: 120;margin-top:20" value="20" step-value= "10" minimum-value="0" maximum-value="100" tint-color= "red" onchange="onChangeAction"></stepper></code></pre>    <p>seek-bar</p>    <p>属性: value(当前的值)，minimum-value（最小值），maximum-value="100（最大值），minimum-track-tint-color,maximum-track-tint-color, thumb-tint-color, minimum-track-image-src,maximum-track-image-src,thumb-image-src</p>    <p>event: onchange</p>    <pre>  <code class="language-javascript"><seek-bar style=" width: 400;height: 70;margin-top:20;margin-left:20" minimum-value="0" maximum-value="100" value="50" onchange="seekBarChange" minimum-track-tint-color="blue" maximum-track-tint-color="blue" thumb-tint-color="red" > sdsd</seek-bar>    <seek-bar style=" width: 160;height: 140;margin-top:20;margin-left:220" minimum-value="0" maximum-value="100" value="50" onchange="imageSeekBarChange"  thumb-image-src="https://simg.open-open.com/show/c5772030120d7ac51f72a42d4d6b9304.png" maximum-track-image-src="https://simg.open-open.com/show/cf138c09ff1ada617bf09c586af36e01.png" minimum-track-image-src="https://simg.open-open.com/show/da6c76b05a96485700675cd88c578a55.png"> sdsd</seek-bar></code></pre>    <p>search-bar</p>    <p>属性: tint-color（颜色）</p>    <p>event: onclick</p>    <pre>  <code class="language-javascript"><search-bar style="width: 300;height: 120;margin-top:20"  tint-color= "red" onclick="onclicksearch"></search-bar></code></pre>    <p>date-picker</p>    <p>属性: tint-color（颜色）</p>    <p>event: onchange</p>    <pre>  <code class="language-javascript"><date-picker style="width: 640;height: 400;margin-top:20"  tint-color= "red" onchange="onclickdatepicker" ></date-picker></code></pre>    <p><strong>Module</strong></p>    <p>MBProgressHUD为loading模块 函数：showHUD（显示HUD，参数为title，detail，mode[枚举值indicator/text]，cancelTitle，contentColor），hideHUD隐藏HUD（）</p>    <pre>  <code class="language-javascript">toast: function() {          var MBProgressHUD = require('@weex-module/MBProgressHUD');          MBProgressHUD.showHUD({title:"loading",contentColor:"red",mode:"indicator"});          setTimeout(function () {            MBProgressHUD.hideHUD();          }, 2000)        },</code></pre>    <p>actionSheet 函数：actionSheetShow（参数为cancelButtonTitle，destructiveButtonTitle，otherButtonTitles（数组），以及一个回调）</p>    <pre>  <code class="language-javascript">actionSheet: function() {          var me= this;          var actionSheet = require('@weex-module/actionSheet');          actionSheet.actionSheetShow({            'cancelButtonTitle': 'cancel',            'destructiveButtonTitle': 'destructive',            'otherButtonTitles': me.buttons          }, function(result) {          });        },</code></pre>    <p>geolocation 定位模块</p>    <p>函数getCurrentPosition（参数accuracy，distanceFilter）</p>    <pre>  <code class="language-javascript">geolocationAction: function() {          var me= this;          var geolocation = require('@weex-module/geolocation');          geolocation.getCurrentPosition({            'accuracy': '1000',            'distanceFilter': '10'          }, function(result) {            me.geolocationValue = JSON.stringify(result);          }, function(result) {          });        },</code></pre>    <p>vibration 函数：vibrate（真机震动）</p>    <pre>  <code class="language-javascript">vibrate: function() {          var vibration = require('@weex-module/vibration');          vibration.vibrate()        }</code></pre>    <h3><strong>weex-web-kit</strong></h3>    <p>weex-web-kit代码位于 html5/browser/weex-web-kit 目录下</p>    <p style="text-align:center"><img src="https://simg.open-open.com/show/b76fc10332bb1827238feb715573e4a6.png"></p>    <pre>  <code class="language-javascript"><segmented-control style="width: 240;height: 120;margin-top:20" items="hello;world" momentary= "false" tint-color= "red" onchange="onChangeAction"></segmented-control></code></pre>    <p><strong>Licenses</strong></p>    <p>All source code is licensed under the MIT License .</p>    <p> </p>    <p style="text-align:center"> </p>    <p> </p>    <p>来自：https://github.com/coderyi/hello-weex</p>    <p> </p>