项目初始化
1、没有现成的工程的话新建iOS项目
![](http://s1.VeVb.com/20170206/fhtqveojj2b20.png)
命令行cd到项目根目录 执行 pod init,会创建一个pod配置文件
![](http://s1.VeVb.com/20170206/i0qbbibvbt520.png)
用编辑器打开,加上 pod 'WeexSDK', :path=>'./sdk/'
![](http://s1.VeVb.com/20170206/l5a5hzs13q121.png)
下载最新的weexSDK https://github.com/alibaba/weex
![](http://s1.VeVb.com/20170206/jhj3240e4o322.png)
在ios目录下有个sdk文件夹,把它复制到ios项目根目录,和podFile里配置的路径一致
![](http://s1.VeVb.com/20170206/532ijtrijwr23.png)
关掉xcode,在当前目录,命令行执行pod install,
![](http://s1.VeVb.com/20170206/0vlwu4tq5ne23.png)
现在项目目录变成了这样,以后点击xcworkspace文件打开项目
![](http://s1.VeVb.com/20170206/gdmolqtl5y525.png)
创建一个新目录weex,命令行cd到weex目录,执行weex init,会提示你输入项目名称
![](http://s1.VeVb.com/20170206/0getdhhtcr425.png)
自动创建的文件:
![](http://s1.VeVb.com/20170206/sv0jpu5413e25.png)
在当前目录命令行执行npm install,安装依赖库
创建一个文件夹js,命令行执行weex src -o js生成最终需要的js文件
也可以weex src/main.we在浏览器预览
或者weex src/main.we --qr 生成二维码,用playground App 扫描预览
加载weex页面
xcode打开workspace项目文件
![](http://s1.VeVb.com/20170206/dpu2r4igu4226.png)
打开AppDelegate.m添加一下内容
![](http://s1.VeVb.com/20170206/v3baw0zmkca27.png)
将之前创建的js文件夹拖到xcode工程的文件列表
![](http://s1.VeVb.com/20170206/uu3wo01udpq27.png)
效果是这样的
![](http://s1.VeVb.com/20170206/ljfdglwqnbp28.png)
weex视图控制器的初始化
ViewController.h:
[objc] view plain copy ![在CODE上查看代码片](http://s1.VeVb.com/20170206/kfbwvhvilkk28.png)
// // ViewController.h // weexDemo3 // // Created by admin on 16/8/3. // Copyright © 2016年 admin. All rights reserved. // #import <UIKit/UIKit.h> @interface ViewController : UIViewController - (instancetype)initWithJs:(NSString *)filePath; @end ViewController.m:
[objc] view%20plain copy ![在CODE上查看代码片]()
// // ViewController.m // weexDemo3 // // Created by admin on 16/8/3. // Copyright © 2016年 admin. All rights reserved. // #import "ViewController.h" #import <WeexSDK/WXSDKInstance.h> @interface ViewController () @PRoperty (nonatomic, strong) WXSDKInstance *instance; @property (nonatomic, strong) UIView *weexView; @end @implementation ViewController{ NSURL *jsUrl; } - (instancetype)initWithJs:(NSString *)filePath { self = [super init]; if (self) { //远程js文件 // NSString *path=[NSString stringWithFormat:@"http://192.168.232.13:8080/examples/js/%@",filePath]; //本地js文件 NSString *path=[NSString stringWithFormat:@"file://%@/js/%@",[NSBundle mainBundle].bundlePath,filePath]; NSLog(@"-----path:%@",path); jsUrl=[NSURL URLWithString:path]; } return self; } - (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) { NSLog(@"加载错误"); }; _instance.renderFinish = ^ (UIView *view) { NSLog(@"加载完成"); }; if (!jsUrl) { return; } [_instance renderWithURL: jsUrl]; self.view.backgroundColor=[UIColor whiteColor]; } - (void)didReceiveMemoryWarning { [super didReceiveMemoryWarning]; // Dispose of any resources that can be recreated. } - (void)dealloc { [_instance destroyInstance]; } @end 再打开AppDelegate.m创建导航控制器引入头文件
#import "ViewController.h"
创建导航视图:
[objc] view%20plain copy ![在CODE上查看代码片]()
- (BOOL)application:(UIApplication *)application didFinishLaunchingWithOptions:(NSDictionary *)launchOptions { //weex [self initWeex]; ViewController *vc=[[ViewController alloc]initWithJs:@"main.js"]; UINavigationController *nav=[[UINavigationController alloc]initWithRootViewController:vc]; self.window.rootViewController=nav; return YES; } 运行![]()
图片不显示是因为图片加载需要自己创建模块,可以直接把demo的代码和pod配置粘过来使用