集成 Weex 到已有应用

通过cocoaPods 集成 Weex iOS SDK到你的项目

首先假设你已经完成了安装 iOS 开发环境 和 CocoaPods

第一步：添加依赖

导入 Weex iOS SDK 到你已有的项目, 如果没有，可以参考新建项目
在继续下面内容之前，确保你已有的项目目录有名称为 Podfile 文件，如果没有，创建一个，用文本编辑器打开

  • 集成 framework 

    WeexSDK 在 cocoaPods 上最新版本 可以在这获取 

    在 Podfile 文件中添加如下内容

           
       
    
        
        source 'git@github.com:CocoaPods/Specs.git' 
       
       
    
       
       
    
        
        target 'YourTarget' do
       
       
    
       
       
    
        
            platform :ios, '7.0' 
       
       
    
       
       
    
        
            pod 'WeexSDK', '0.9.5'   ## 建议使用WeexSDK新版本 
       
       
    
       
       
    
        
        end

  • 源码集成

    首先 拷贝 ios/sdk 目录到你已有项目目录 (此处以拷贝到你已有项目的根目录为例子)，然后在 Podfile 文件中添加

           
       
    
        
        source 'git@github.com:CocoaPods/Specs.git' 
       
       
    
       
       
    
        
        target 'YourTarget' do
       
       
    
       
       
    
        
            platform :ios, '7.0' 
       
       
    
       
       
    
        
            pod 'WeexSDK', :path=>'./sdk/' 
       
       
    
       
       
    
        
        end
第二步：安装依赖

打开命令行，切换到你已有项目 Podfile 这个文件存在的目录，执行 pod install，没有出现任何错误表示已经完成环境配置。

第三步：初始化 Weex 环境

在 AppDelegate.m 文件中做初始化操作，一般会在 didFinishLaunchingWithOptions 方法中如下添加。

     
     

      
      //business configuration
     
     

     
     

      
      [WXAppConfiguration setAppGroup:@"AliApp"];
     
     

     
     

      
      [WXAppConfiguration setAppName:@"WeexDemo"];
     
     

     
     

      
      [WXAppConfiguration setAppVersion:@"1.0.0"];
     
     

     
     

     
     

      
      //init sdk enviroment   
     
     

     
     

      
      [WXSDKEngine initSDKEnviroment];
     
     

     
     

     
     

      
      //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];
第四步：渲染 weex Instance

Weex 支持整体页面渲染和部分渲染两种模式，你需要做的事情是用指定的 URL 渲染 Weex 的 view，然后添加到它的父容器上，父容器一般都是 viewController。

     
     

      
      #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 等，可以参见 WXSDKInstance.h 的声明。

第五步：销毁 Weex Instance

在 viewController 的 dealloc 阶段 销毁掉 Weex instance，释放内存，避免造成内存泄露。

     
     

      
      - (void)dealloc
     
     

     
     

      
      {
     
     

     
     

      
          [_instance destroyInstance];
     
     

     
     

      
      }

导入 Weex SDK framework 到工程

可以通过源码编译出 Weex SDK，可以在新的 feature 或者 bugfix 分支，尝试最新的 feature。

地址 http://weex.apache.org/cn/guide/integrate-to-your-app.html
Logo
智屏生态联盟

智屏生态联盟致力于大屏生态发展，利用大屏快应用技术降低开发者开发、发布大屏应用门槛

更多推荐

taro 引用本地图片展示

import { Image } from ‘@tarojs/components’<引用标签>constructor(){super()this.state={img:require(’./case.png’)}}…

avatar 智屏生态联盟

Weex

Weex 是一个可以使用现代化的 Web 技术开发高性能原生应用的框架。快速开始高性能Weex 使用原生组件和原生模块，来最大化利用原生渲染的性能优势以及平台能力，所有的组件和模块都是可插拔、可扩展的。跨平台你可以使用同一份代码编译成不同目标文件分别在 Web、Android 和 iOS 平台上运行。原生的组件和模块在不同平台中有不同的实现，但是它们都提供了相同的...

avatar 智屏生态联盟

Taro写小程序总结

1.首先需要在『微信公众平台』注册帐号，我一直很困惑为啥，微信公众平台不能和微信开放平台整合，而且账号不能通用~https://mp.weixin.qq.com2.在微信公从平台里的->开发->服务器域名,可以配置小程序中可以访问的接口的域名3.在『成员管理』中可以添加开发者、体验者等成员。方便协作办工Taro的一些例子：1.转发在render中写&...

avatar 智屏生态联盟