zshshr closed pull request #272: formate sytle for integrate-to-your-app
URL: https://github.com/apache/incubator-weex-site/pull/272
 
 
   

This is a PR merged from a forked repository.
As GitHub hides the original diff on merge, it is displayed below for
the sake of provenance:

As this is a foreign pull request (from a fork), the diff is supplied
below (as it won't show otherwise due to GitHub magic):

diff --git a/docs/.vuepress/config.js b/docs/.vuepress/config.js
index f21102283..588c166a5 100644
--- a/docs/.vuepress/config.js
+++ b/docs/.vuepress/config.js
@@ -53,7 +53,8 @@ module.exports = {
               children: [
                 ['develop/setup-develop-environment', 'Setup Develop 
Environment'],
                 ['develop/create-a-new-app', 'Create a New App'],
-                ['develop/integrate-to-your-app', 'Integrate to Your App']
+                ['develop/integrate-to-android-app', 'Integrate to Android'],
+                ['develop/integrate-to-iOS-app', 'Integrate to iOS']
               ]
             },
             {
@@ -203,56 +204,57 @@ module.exports = {
         sidebar: {
           '/zh/guide/': [
             {
-              title: 'Getting Started',
+              title: '快速上手',
               collapsable: false,
               children: [
-                ['introduction', 'Introduction'],
-                ['front-end-frameworks', 'Front-End Frameworks'],
-                ['platform-difference', 'Platform Difference'],
-                ['use-vue-in-weex', 'Use Vue in Weex'],
-                ['use-rax-in-weex', 'Use Rax in Weex']
+                ['introduction', '简介'],
+                ['front-end-frameworks', '前端框架'],
+                ['platform-difference', '平台差异'],
+                ['use-vue-in-weex', '在Weex中使用Vue.js'],
+                ['use-rax-in-weex', '在Weex中使用Rax.js']
               ]
             },
             {
-              title: 'Develop',
+              title: '开发',
               collapsable: false,
               children: [
-                ['develop/setup-develop-environment', 'Setup Develop 
Environment'],
-                ['develop/create-a-new-app', 'Create a New App'],
-                ['develop/integrate-to-your-app', 'Integrate to Your App']
+                ['develop/setup-develop-environment', '设置开发环境'],
+                ['develop/create-a-new-app', '创建一个新的app'],
+                ['develop/integrate-to-android-app', '集成到Android应用'],
+                ['develop/integrate-to-iOS-app', '集成到iOS应用']
               ]
             },
             {
-              title: 'Debug',
+              title: '调试',
               collapsable: false,
               children: [
-                ['debug/integrate-devtool-to-android', 'Integrate Devtool to 
Android'],
-                ['debug/integrate-devtool-to-ios', 'Integrate Devtool to iOS'],
+                ['debug/integrate-devtool-to-android', '集成Devtool到Android'],
+                ['debug/integrate-devtool-to-ios', '集成Devtool到iOS'],
                 ['debug/debug', 'Debug']
               ]
             },
             {
-              title: 'Extend',
+              title: '扩展',
               collapsable: false,
               children: [
-                ['extend/extend-android', 'Extend Android'],
-                ['extend/extend-ios', 'Extend iOS'],
-                ['extend/extend-ios-with-swift', 'Extend iOS with swift'],
-                ['extend/extend-web', 'Extend Web Renderer'],
-                ['extend/extend-framework', 'Extend JS framework']
+                ['extend/extend-android', '扩展Android能力'],
+                ['extend/extend-ios', '扩展iOS能力'],
+                ['extend/extend-ios-with-swift', '使用Swift进行module 扩展'],
+                ['extend/extend-web', '扩展Web组件'],
+                ['extend/extend-framework', '扩展JS framework']
               ]
             },
             {
-              title: 'Advanced',
+              title: '高阶特性',
               collapsable: false,
               children: [
-                ['advanced/asset-path', 'Asset Path'],
-                ['advanced/downgrade', 'Downgrade'],
-                ['advanced/use-vuex-and-vue-router', 'Use Vuex and vue-router']
+                ['advanced/asset-path', '资源路径'],
+                ['advanced/downgrade', '降级方案'],
+                ['advanced/use-vuex-and-vue-router', '使用Vuex和vue-router']
               ]
             },
             {
-              title: 'Contribute',
+              title: '贡献',
               collapsable: false,
               children: [
                 ['contribute/how-to-contribute', 'How To Contribute'],
diff --git a/docs/guide/develop/integrate-to-android-app.md 
b/docs/guide/develop/integrate-to-android-app.md
new file mode 100644
index 000000000..b3ed87b9c
--- /dev/null
+++ b/docs/guide/develop/integrate-to-android-app.md
@@ -0,0 +1,156 @@
+---
+title: Integrate to Your App
+type: guide
+group: Overview
+order: 1.3
+version: 2.1
+---
+
+<!-- toc -->
+
+# Integrate to Android App
+
+
+The following documents assume that you already have a certain Android 
development experience.
+
+
+## 1. Configure dependency 
+
+edit `build.gradle`
+
+```javascript
+dependencies {
+    ...
+    // weex sdk and fastjson
+    compile 'com.taobao.android:weex_sdk:0.20.0.2@aar'
+    compile 'com.alibaba:fastjson:1.1.46.android'
+
+    //support library dependencies
+    compile 'com.android.support:recyclerview-v7:23.1.1'
+    compile 'com.android.support:support-v4:23.1.1'
+    compile 'com.android.support:appcompat-v7:23.1.1'
+}
+```
+
+## 2. Configure proguard
+
+proguard rules are as follows,recommended reference to [__the latest source 
configuration__](https://github.com/apache/incubator-weex/blob/master/android/sdk/proguard-rules.pro)
+
+```
+-keep class com.taobao.weex.bridge.** { *; }
+-keep class com.taobao.weex.layout.** { *; }
+-keep class com.taobao.weex.WXSDKEngine { *; }
+-keep class com.taobao.weex.base.SystemMessageHandler { *; }
+-dontwarn com.taobao.weex.bridge.**
+```
+
+## 3. Add permissions 
+
+Add required permissions in your AndroidManifest.xml
+
+```xml
+<uses-permission android:name="android.permission.INTERNET"/>
+<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
+<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
+<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+```
+
+## 4. Init Weex SDK
+
+Init Weex SDK When Application Create
+
+```java
+InitConfig config = new InitConfig.Builder()
+                                       //imageLib interface 
+                               .setImgAdapter(new FrescoImageAdapter())
+                               //network lib interface
+                               .setHttpAdapter(new InterceptWXHttpAdapter())
+                               .build();
+WXSDKEngine.initialize(applicationContext,config);
+```
+
+- [demo init 
case](https://github.com/apache/incubator-weex/blob/master/android/playground/app/src/main/java/com/alibaba/weex/WXApplication.java)
+- [extend-android doc](/guide/extend/extend-android.html)
+
+
+## 5. Create an WXSDKInstance
+
+- create an WXSDKInstance add IWXRenderListener and activity lifecycle on it. 
+- load weex bundle url. when  page load success; 
+- target view will be send for you on  onViewCreated callback, set target view 
to activity contentView.
+
+```java
+public class MainActivity extends AppCompatActivity implements 
IWXRenderListener {
+  WXSDKInstance mWXSDKInstance;
+  @Override
+  protected void onCreate(Bundle savedInstanceState) {
+    super.onCreate(savedInstanceState);
+    setContentView(R.layout.activity_main);
+    mWXSDKInstance = new WXSDKInstance(this);
+    mWXSDKInstance.registerRenderListener(this);
+    /**
+    * bundleUrl source http://dotwe.org/vue/38e202c16bdfefbdb88a8754f975454c
+    */
+    String pageName = "WXSample";
+    String bundleUrl = 
"http://dotwe.org/raw/dist/38e202c16bdfefbdb88a8754f975454c.bundle.wx";;
+    mWXSDKInstance.renderByUrl(pageName, bundleUrl, null, 
null,WXRenderStrategy.APPEND_ASYNC);
+  }
+  @Override
+  public void onViewCreated(WXSDKInstance instance, View view) {
+    setContentView(view);
+  }
+  @Override
+  public void onRenderSuccess(WXSDKInstance instance, int width, int height) {
+  }
+  @Override
+  public void onRefreshSuccess(WXSDKInstance instance, int width, int height) {
+  }
+  @Override
+  public void onException(WXSDKInstance instance, String errCode, String msg) {
+  }
+  @Override
+  protected void onResume() {
+    super.onResume();
+    if(mWXSDKInstance!=null){
+      mWXSDKInstance.onActivityResume();
+    }
+  }
+  @Override
+  protected void onPause() {
+    super.onPause();
+    if(mWXSDKInstance!=null){
+       mWXSDKInstance.onActivityPause();
+    }
+  }
+  @Override
+  protected void onStop() {
+    super.onStop();
+    if(mWXSDKInstance!=null){
+      mWXSDKInstance.onActivityStop();
+    }
+  }
+  @Override
+  protected void onDestroy() {
+    super.onDestroy();
+    if(mWXSDKInstance!=null){
+      mWXSDKInstance.onActivityDestroy();
+    }
+  }
+}
+```
+
+## 6. Run
+
+Run app ,start activity, then you will see hello world demo. well done.
+
+[Hello World Demo 
Source](http://dotwe.org/vue/38e202c16bdfefbdb88a8754f975454c)
+
+Tip: Click QRCode Image in Demo Source Page, your will see compiled bundle js.
+
+## 7. Extend-Android 
+
+Weex supports module-extend、component-extend and adapter-extend
+
+[Extend Android Doc](/guide/extend/extend-android.html)
+
+
diff --git a/docs/guide/develop/integrate-to-iOS-app.md 
b/docs/guide/develop/integrate-to-iOS-app.md
new file mode 100644
index 000000000..f36123b05
--- /dev/null
+++ b/docs/guide/develop/integrate-to-iOS-app.md
@@ -0,0 +1,146 @@
+---
+title: Integrate to Your App
+type: guide
+group: Overview
+order: 1.3
+version: 2.1
+---
+
+<!-- toc -->
+
+# Integrate to iOS App
+
+Through the [CocoaPods](https://cocoapods.org/) or 
[Carthage](https://github.com/Carthage/Carthage) integrated Weex iOS SDK to 
your project.
+First assume that you have finished installing the [iOS development 
environment](https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/AppStoreDistributionTutorial/Setup/Setup.html)
 and [CocoaPods](https://guides.cocoapods.org/using/getting-started.html)(or 
[Carthage](https://github.com/Carthage/Carthage#installing-carthage)).
+
+## Step 1: Add Dependencies
+
+Import Weex iOS SDK to your existing project, if not, you can create a new 
project according to the 
[tutorial](https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/AppStoreDistributionTutorial/Setup/Setup.html)).
+Before proceeding, make sure that the Podfile file is under the project file. 
If not, create one and open with  text editor(if Carthage, please ensure the 
[`Cartfile`](https://github.com/Carthage/Carthage/blob/master/Documentation/Artifacts.md#cartfile)
 in your project directory). You can choose one of Integration method.
+
+### using [CocoaPods](https://cocoapods.org/)
+
+WeexSDK The latest version on cocoaPods can be obtained 
[here](https://cocoapods.org/pods/WeexSDK) .
+       Add the following to the Podfile file:
+
+       ```object-c
+       source '[email protected]:CocoaPods/Specs.git'
+       target 'YourTarget' do
+           platform :ios, '7.0'
+           pod 'WeexSDK', '0.17.0'   ## latest Weex SDK recommended
+       end
+       ```
+       Open the command line, switch to the directory of the Podfile file, and 
run the pod install command. If there are no errors, it means that the 
environment has been configured.
+       
+### using [Carthage](https://github.com/Carthage/Carthage)
+
+- [here](https://github.com/apache/incubator-weex/tags) you can get the latest 
version of WeexSDK.
+- Add `github "apache/incubator-weex"` to 
[`Cartfile`](https://github.com/Carthage/Carthage/blob/master/Documentation/Artifacts.md#cartfile)
+- Open the command line, switch to the directory of the Cartfile, and run 
`carthage update`.
+
+[Add Carthage build framework to your 
project](https://github.com/Carthage/Carthage#adding-frameworks-to-an-application)
+
+
+## Step 2: Initialize the Weex environment
+
+In the AppDelegate.m file to do the initialization operation, usually in the 
didFinishLaunchingWithOptions method as follows to add.
+
+```object-c
+//business configuration
+[WXAppConfiguration setAppGroup:@"AliApp"];
+[WXAppConfiguration setAppName:@"WeexDemo"];
+[WXAppConfiguration setAppVersion:@"1.0.0"];
+//init sdk environment
+[WXSDKEngine initSDKEnvironment];
+//register custom module and component,optional
+[WXSDKEngine registerComponent:@"MyView" withClass:[MyViewComponent class]];
+[WXSDKEngine registerModule:@"event" withClass:[WXEventModule class]];
+//register the implementation of protocol, optional
+[WXSDKEngine registerHandler:[WXNavigationDefaultImpl new] 
withProtocol:@protocol(WXNavigationProtocol)];
+//set the log level
+[WXLog setLogLevel: WXLogLevelAll];
+```
+
+## Step 3: Render weex Instance
+
+Weex supports both full page rendering and partial rendering. What you need to 
do is render Weex's view with the specified URL and add it to its parent 
container. The parent container is generally a viewController.
+
+```object-c
+#import <WeexSDK/WXSDKInstance.h>
+- (void)viewDidLoad
+{
+    [super viewDidLoad];
+    _instance = [[WXSDKInstance alloc] init];
+    _instance.viewController = self;
+    _instance.frame = self.view.frame;
+    __weak typeof(self) weakSelf = self;
+    _instance.onCreate = ^(UIView *view) {
+        [weakSelf.weexView removeFromSuperview];
+        weakSelf.weexView = view;
+        [weakSelf.view addSubview:weakSelf.weexView];
+    };
+    _instance.onFailed = ^(NSError *error) {
+        //process failure
+    };
+    _instance.renderFinish = ^ (UIView *view) {
+        //process renderFinish
+    };
+    NSURL *url = [[NSBundle mainBundle] URLForResource:@"main" 
withExtension:@"js"];
+    [_instance renderWithURL:url options:@{@"bundleUrl":[self.url 
absoluteString]} data:nil];
+}
+```
+
+WXSDKInstance is a very important class that provides a basic method and some 
callbacks, such as renderWithURL, onCreate, onFailed, etc., can be found in 
WXSDKInstance.h.
+
+## Step 4: Destroy Weex Instance
+
+In the dealloc phase of the viewController destroyed Weex instance, can play a 
role in avoiding memory leaks.
+
+```object-c
+- (void)dealloc
+{
+    [_instance destroyInstance];
+}
+```
+
+## 5. Extend-iOS
+
+Weex SDK provides only rendering capabilities, rather than have other 
capabilities. There are some internal components, modules and handlers. If you 
want these features which weexSDK doesn't provide, you can to extend.
+
+
+- [Extend iOS](../extend/extend-ios.html)
+- [Extend iOS with swift](../extend/extend-ios-with-swift.html)
+
+## More: Build framework
+
+more, Build your own WeexSDK.framework and Import to your project.
+
+The Weex SDK can be compiled from the source code. You can try the latest 
feature in the new feature or bugfix branch.
+
+- `git clone https://github.com/apache/incubator-weex.git'
+  you can use SSH
+
+       ```
+       git clone [email protected]:apache/incubator-weex.git
+       ```
+  or use https
+
+       ```
+       git clone https://github.com/apache/incubator-weex.git
+       ```
+
+- open WeexSDK.xcodeproj in `weex/ios/sdk`
+  switch target just below
+  
![img](http://img1.tbcdn.cn/L1/461/1/4fe050b36e7fea52f121e73790b1fdb7ea934e97)
+
+- Build this project or just use the xcode default hot key `⌘ + b`
+
+- Finally you can find `Products` directory in `weex/ios/sdk`, 
`WeexSDK.framework` was here
+  
![img](http://img4.tbcdn.cn/L1/461/1/52594fea03ee1154845d0f897558b81b4b5bef2e)
+
+- Add `js-framework`(which is in the `WeexSDK.framework` and renamed to 
`native-bundle-main.js`) to your main bundle
+  
![img](http://img1.tbcdn.cn/L1/461/1/bb3998595bafe9c9336411160c0b6bd3eeb843ef)
+- Import the framework you get above and import system framework
+  
![img](http://img1.tbcdn.cn/L1/461/1/ce309c54c7b3dd3607d7a3d07c44bfd0e0e10f86)
+- add `-ObjC` to your project settings,just like this
+![img](http://img3.tbcdn.cn/L1/461/1/430ae522f5031ff728c95efea49219a11e6852b3)
diff --git a/docs/zh/guide/develop/integrate-to-android-app.md 
b/docs/zh/guide/develop/integrate-to-android-app.md
new file mode 100644
index 000000000..c4b6129c8
--- /dev/null
+++ b/docs/zh/guide/develop/integrate-to-android-app.md
@@ -0,0 +1,160 @@
+---
+title: Integrate to Your App
+type: guide
+group: Overview
+order: 1.3
+version: 2.1
+---
+
+<!-- toc -->
+
+# 集成到Android应用
+
+在执行以下步骤之前,请先确认您的Android开发环境是ok的。
+
+## 1. 设置gradle依赖
+
+
+```
+dependencies {
+    ...
+    // weex sdk and fastjson
+    compile 'com.taobao.android:weex_sdk:0.20.0.2@aar'
+    compile 'com.alibaba:fastjson:1.1.46.android'
+
+    //support library dependencies
+    compile 'com.android.support:recyclerview-v7:23.1.1'
+    compile 'com.android.support:support-v4:23.1.1'
+    compile 'com.android.support:appcompat-v7:23.1.1'
+}
+```
+
+## 2. 配置混淆规则
+
+混淆规则如下,建议参考[__最新的源码配置__](https://github.com/apache/incubator-weex/blob/master/android/sdk/proguard-rules.pro)
+
+```
+-keep class com.taobao.weex.bridge.** { *; }
+-keep class com.taobao.weex.layout.** { *; }
+-keep class com.taobao.weex.WXSDKEngine { *; }
+-keep class com.taobao.weex.base.SystemMessageHandler { *; }
+-dontwarn com.taobao.weex.bridge.**
+```
+
+## 3. 声明权限
+
+在`AndroidManifest.xml`中声明权限 
+
+```xml
+//网络
+<uses-permission android:name="android.permission.INTERNET"/>
+<uses-permission android:name="android.permission.ACCESS_NETWORK_STATE"/>
+
+//sd卡读写
+<uses-permission android:name="android.permission.WRITE_EXTERNAL_STORAGE"/>
+<uses-permission android:name="android.permission.READ_EXTERNAL_STORAGE"/>
+```
+
+## 4. 初始化sdk
+
+```java
+InitConfig config = new InitConfig.Builder()
+                                       //图片库接口
+                               .setImgAdapter(new FrescoImageAdapter())
+                               //网络库接口
+                               .setHttpAdapter(new InterceptWXHttpAdapter())
+                               .build();
+WXSDKEngine.initialize(applicationContext,config);
+
+```
+
+- 
[demo初始化源码](https://github.com/apache/incubator-weex/blob/master/android/playground/app/src/main/java/com/alibaba/weex/WXApplication.java)
+- [其它扩展配置看这里](/guide/extend/extend-android.html)
+
+
+## 5. 创建WXSDKInstance 
+
+`WXSDKInstance`是weex渲染页面的基本单元,
+
+- 通过`instance.render(url)`拉取bundle,
+- 在回调`IWXRenderListener`的`onViewCreated `返回创建的view,
+- 将返回的view 添加到Activity的view上(rootView)
+
+参见源码: 
[WXPageActivity](https://github.com/apache/incubator-weex/blob/master/android/playground/app/src/main/java/com/alibaba/weex/WXPageActivity.java)
+
+```java
+public class MainActivity extends AppCompatActivity implements 
IWXRenderListener {
+  WXSDKInstance mWXSDKInstance;
+  @Override
+  protected void onCreate(Bundle savedInstanceState) {
+    super.onCreate(savedInstanceState);
+    setContentView(R.layout.activity_main);
+    mWXSDKInstance = new WXSDKInstance(this);
+    mWXSDKInstance.registerRenderListener(this);
+    /**
+    * bundleUrl source http://dotwe.org/vue/38e202c16bdfefbdb88a8754f975454c
+    */
+    String pageName = "WXSample";
+    String bundleUrl = 
"http://dotwe.org/raw/dist/38e202c16bdfefbdb88a8754f975454c.bundle.wx";;
+    mWXSDKInstance.renderByUrl(pageName, bundleUrl, null, 
null,WXRenderStrategy.APPEND_ASYNC);
+  }
+  @Override
+  public void onViewCreated(WXSDKInstance instance, View view) {
+    setContentView(view);
+  }
+  @Override
+  public void onRenderSuccess(WXSDKInstance instance, int width, int height) {
+  }
+  @Override
+  public void onRefreshSuccess(WXSDKInstance instance, int width, int height) {
+  }
+  @Override
+  public void onException(WXSDKInstance instance, String errCode, String msg) {
+  }
+  @Override
+  protected void onResume() {
+    super.onResume();
+    if(mWXSDKInstance!=null){
+      mWXSDKInstance.onActivityResume();
+    }
+  }
+  @Override
+  protected void onPause() {
+    super.onPause();
+    if(mWXSDKInstance!=null){
+       mWXSDKInstance.onActivityPause();
+    }
+  }
+  @Override
+  protected void onStop() {
+    super.onStop();
+    if(mWXSDKInstance!=null){
+      mWXSDKInstance.onActivityStop();
+    }
+  }
+  @Override
+  protected void onDestroy() {
+    super.onDestroy();
+    if(mWXSDKInstance!=null){
+      mWXSDKInstance.onActivityDestroy();
+    }
+  }
+}
+```
+
+## 6. 运行app
+
+运行app,您将会看到一个 `hello world` 页面。
+
+- [Hello World Demo 源码](http://dotwe.org/vue/38e202c16bdfefbdb88a8754f975454c)
+- 提示: 点击二维码, 可以看到最终编译的代码产物。
+
+## 7. 扩展Android能力
+
+Weex 提供了[能力扩展机制]((/guide/extend/extend-android.html)),可以根据自己的业务进行定制自己的功能。 主要分为:
+
+- Module 扩展, 非 UI 的特定功能。例如 sendHttp、openURL 等。
+- Component 扩展, 实现特别功能的 Native 控件。例如:RichTextview,RefreshListview 等。
+- Adapter 扩展, Weex 对一些基础功能实现了统一的接口,可实现这些接口来定制自己的业务。例如:图片下载等。
+
+
diff --git a/docs/zh/guide/develop/integrate-to-iOS-app.md 
b/docs/zh/guide/develop/integrate-to-iOS-app.md
new file mode 100644
index 000000000..6e8e556ac
--- /dev/null
+++ b/docs/zh/guide/develop/integrate-to-iOS-app.md
@@ -0,0 +1,149 @@
+---
+title: Integrate to Your App
+type: guide
+group: Overview
+order: 1.3
+version: 2.1
+---
+
+<!-- toc -->
+
+# 集成到iOS应用
+
+
+通过 [CocoaPods](https://cocoapods.org/) 或者 
[Carthage](https://github.com/Carthage/Carthage) 集成 Weex iOS SDK 到您的项目中。
+
+首先确认您的开发环境是OK的
+
+- [iOS development 
environment](https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/AppStoreDistributionTutorial/Setup/Setup.html)
 
+- [CocoaPods](https://guides.cocoapods.org/using/getting-started.html) 或者 
[Carthage](https://github.com/Carthage/Carthage#installing-carthage)).
+
+## 1. 添加依赖
+
+集成 Weex iOS SDK 到您现有的工程中, 如果没有的话, 
可以参照[tutorial](https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/AppStoreDistributionTutorial/Setup/Setup.html))创建一个新的工程。
+
+在开始之前,确认您的工程下有podfile文件,如果没有,手动创建一个。(如果使用的是`Cartfile`,确认[`Cartfile`](https://github.com/Carthage/Carthage/blob/master/Documentation/Artifacts.md#cartfile)在您的工程下)
+
+选择一种方式集成
+
+### 使用[CocoaPods](https://cocoapods.org/)
+
+修改您的podfile    
+
+```object-c
+       source '[email protected]:CocoaPods/Specs.git'
+       target 'YourTarget' do
+           platform :ios, '7.0'
+           pod 'WeexSDK', '0.17.0'   ## 建议使用最新的版本
+       end
+```
+
+可以从这里查[weex最新的版本地址](https://cocoapods.org/pods/WeexSDK) .
+
+在podfile目录下,运行命令
+```
+pod install
+```
+如果没有`error`提示的话,集成完毕
+
+### 使用 [Carthage](https://github.com/Carthage/Carthage)
+
+- 获取[weex最新的版本地址](https://github.com/apache/incubator-weex/tags) .
+- 添加 `github "apache/incubator-weex"` 到 
[`Cartfile`](https://github.com/Carthage/Carthage/blob/master/Documentation/Artifacts.md#cartfile)
+- 打开命令行,cd 到 artfile所在目录, 运行 `carthage update`.
+
+[使用Carthage添加framework](https://github.com/Carthage/Carthage#adding-frameworks-to-an-application)
+
+
+## 2. 初始化WEEX
+
+同常在 `AppDelegate.m`的 `didFinishLaunchingWithOptions`方法中进行初始化工作。 
+
+
+```object-c
+//业务设置
+[WXAppConfiguration setAppGroup:@"AliApp"];
+[WXAppConfiguration setAppName:@"WeexDemo"];
+[WXAppConfiguration setAppVersion:@"1.0.0"];
+//初始化weex sdk
+[WXSDKEngine initSDKEnvironment];
+//注册自定义的组件 和模块
+[WXSDKEngine registerComponent:@"MyView" withClass:[MyViewComponent class]];
+[WXSDKEngine registerModule:@"event" withClass:[WXEventModule class]];
+//注册接口实现,如网络库、图片库
+[WXSDKEngine registerHandler:[WXNavigationDefaultImpl new] 
withProtocol:@protocol(WXNavigationProtocol)];
+//设置log等级
+[WXLog setLogLevel: WXLogLevelAll];
+```
+
+[__初始化源码case__ 
](https://github.com/apache/incubator-weex/blob/master/ios/playground/WeexDemo/AppDelegate.m)
+
+## 3. 创建instnace
+
+我们同时支持全页页面 和 部分卡片渲染方式。您只需要在调用函数时,制定需要展示的尺寸,并且讲view 添加到容器view上。
+
+
+```object-c
+#import <WeexSDK/WXSDKInstance.h>
+- (void)viewDidLoad
+{
+    [super viewDidLoad];
+    _instance = [[WXSDKInstance alloc] init];
+    _instance.viewController = self;
+    _instance.frame = self.view.frame;
+    __weak typeof(self) weakSelf = self;
+    _instance.onCreate = ^(UIView *view) {
+        [weakSelf.weexView removeFromSuperview];
+        weakSelf.weexView = view;
+        [weakSelf.view addSubview:weakSelf.weexView];
+    };
+    _instance.onFailed = ^(NSError *error) {
+        //process failure
+    };
+    _instance.renderFinish = ^ (UIView *view) {
+        //process renderFinish
+    };
+    NSURL *url = [[NSBundle mainBundle] URLForResource:@"main" 
withExtension:@"js"];
+    [_instance renderWithURL:url options:@{@"bundleUrl":[self.url 
absoluteString]} data:nil];
+}
+```
+
+WXSDKInstance 是一个非常重要的类,提供很多功能,比如渲染函数renderWithURL,各种事件回调, 比如, onCreate, 
onFailed, etc., 
具体函数参见[WXSDKInstance](https://github.com/apache/incubator-weex/blob/master/ios/sdk/WeexSDK/Sources/Model/WXSDKInstance.h)
+
+## 4. 销毁 Instance
+
+在`viewController `销毁时,需要同步调用instance的`destroyInstance`方法,weex会做内存回收,否则会出现内存泄漏。
+
+```object-c
+- (void)dealloc
+{
+    [_instance destroyInstance];
+}
+```
+
+## 5. 扩展iOS能力
+
+Weex SDK 只提供渲染,提供了一些默认的组件和能力,如果你需要一些特性但 Weex 并未提供,可以通过扩展自定义的一些插件来实现,通过 WeexSDK 
加载。
+
+- [Extend iOS](../extend/extend-ios.html)
+- [Extend iOS with swift](../extend/extend-ios-with-swift.html)
+
+## 进阶:构建framework
+
+构建framework并且引入到您的工程中
+
+如果您需要尝试最新的feature或者其它需求,可以根据master上最新的源码进行构建
+
+- `git clone https://github.com/apache/incubator-weex.git`
+- 打开 WeexSDK.xcodeproj in `weex/ios/sdk`,选择target
+  
![img](http://img1.tbcdn.cn/L1/461/1/4fe050b36e7fea52f121e73790b1fdb7ea934e97)
+- 点击编译图标 或者使用快捷键`⌘ + b`
+- 产物在  `weex/ios/sdk/Products `
+  
![img](http://img4.tbcdn.cn/L1/461/1/52594fea03ee1154845d0f897558b81b4b5bef2e)
+
+- 添加 `js-framework` 到工程中
+  
![img](http://img1.tbcdn.cn/L1/461/1/bb3998595bafe9c9336411160c0b6bd3eeb843ef)
+- 导入framework 和依赖的系统framework
+  
![img](http://img1.tbcdn.cn/L1/461/1/ce309c54c7b3dd3607d7a3d07c44bfd0e0e10f86)
+- 添加`-ObjC` 到工程设置
+![img](http://img3.tbcdn.cn/L1/461/1/430ae522f5031ff728c95efea49219a11e6852b3)


 

----------------------------------------------------------------
This is an automated message from the Apache Git Service.
To respond to the message, please log on GitHub and use the
URL above to go to the specific comment.
 
For queries about this service, please contact Infrastructure at:
[email protected]


With regards,
Apache Git Services

Reply via email to