react-native ios push 本地view

原创 2015年11月17日 18:41:12

IOS ViewController 切换笔记参考:http://onevcat.com/2013/10/vc-transition-in-ios7/


react-native JS端定义一个简单的button就可以了,点击调用IOS原生如下:

.h文件

#import <UIKit/UIKit.h>
#import "Base/RCTBridgeModule.h"
#import "RCTUtils.h"

#import "AppDelegate.h"

@interface XXX : NSObject <RCTBridgeModule>

@end


.m文件

#import "XXX.h"
#import "Base/RCTLog.h"

#import "TestViewController.h"

@implementation XXX

RCT_EXPORT_MODULE()

#pragma mark "API"

 RCT_EXPORT_METHOD(login:(RCTResponseSenderBlock)callback)
{
  [self presentRegistrationViewController];
}

- (void)presentRegistrationViewController {
  UIWindow *keyWindow = [[UIApplication sharedApplication] keyWindow];
  UIViewController *mainViewController = keyWindow.rootViewController;
  TestViewController *bceRegistrationViewController = [TestViewController new];
  dispatch_async(dispatch_get_main_queue(), ^{
    [mainViewController presentViewController:bceRegistrationViewController animated:YES completion:nil];
  });
}

@end

TestViewController.h

//
//  TestViewController.h
//  MagicWindowTest
//
//  Created by wangyanan on 15/11/17.
//  Copyright © 2015年 Facebook. All rights reserved.
//

#import <UIKit/UIKit.h>

@interface TestViewController : UIViewController

@end

TestViewController.m

//
//  TestViewController.m
//  MagicWindowTest
//
//  Created by wangyanan on 15/11/17.
//  Copyright © 2015年 Facebook. All rights reserved.
//

#import "TestViewController.h"
#import "RCTRootView.h"

@interface TestViewController ()

@end

@implementation TestViewController

- (void)viewDidLoad {
    [super viewDidLoad];
    // Do any additional setup after loading the view.
  
  CGRect viewSize=self.view.bounds;
  UIButton*loginButton=[[UIButton alloc]initWithFrame:CGRectMake(viewSize.size.width/2-50, viewSize.size.height/2, 100, 50)];
  
  [loginButton setTitle:@"登录" forState:UIControlStateNormal];
  loginButton.backgroundColor=[UIColor blueColor];
  [loginButton addTarget:self action:@selector(login) forControlEvents:UIControlEventTouchUpInside];
  [self.view addSubview:loginButton];
}

-(void) login
{
  NSLog(@"login");
  [self presentRegistrationViewController];
}

- (void)presentRegistrationViewController {
  NSURL *jsCodeLocation = [NSURL URLWithString:@"http://localHost:8081/index.ios.bundle?platform=ios&dev=true"];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"MagicWindowTest"
                                               initialProperties:nil
                                                   launchOptions:nil];
  
  UIWindow *keyWindow = [[UIApplication sharedApplication] keyWindow];
  UIViewController *mainViewController = keyWindow.rootViewController;
  mainViewController.view = rootView;
  [self.navigationController pushViewController:mainViewController animated:true];
  [self dismissViewControllerAnimated:YES completion:nil];
}

- (void)didReceiveMemoryWarning {
    [super didReceiveMemoryWarning];
    // Dispose of any resources that can be recreated.
}

/*
#pragma mark - Navigation

// In a storyboard-based application, you will often want to do a little preparation before navigation
- (void)prepareForSegue:(UIStoryboardSegue *)segue sender:(id)sender {
    // Get the new view controller using [segue destinationViewController].
    // Pass the selected object to the new view controller.
}
*/

@end


这样应用程序在进入的时候是js界面,点击Button跳转到我们自定义的TestView界面,点击TestView界面的Button的时候又返回js界面


主要方法为:

1.js -- native

- (void)presentRegistrationViewController {
  UIWindow *keyWindow = [[UIApplication sharedApplication] keyWindow];
  UIViewController *mainViewController = keyWindow.rootViewController;
  TestViewController *bceRegistrationViewController = [TestViewController new];
  dispatch_async(dispatch_get_main_queue(), ^{
    [mainViewController presentViewController:bceRegistrationViewController animated:YES completion:nil];
  });
}


2.native -- js

- (void)presentRegistrationViewController {
  NSURL *jsCodeLocation = [NSURL URLWithString:@"http://localHost:8081/index.ios.bundle?platform=ios&dev=true"];
  RCTRootView *rootView = [[RCTRootView alloc] initWithBundleURL:jsCodeLocation
                                                      moduleName:@"MagicWindowTest"
                                               initialProperties:nil
                                                   launchOptions:nil];
  
  UIWindow *keyWindow = [[UIApplication sharedApplication] keyWindow];
  UIViewController *mainViewController = keyWindow.rootViewController;
  mainViewController.view = rootView;
  [self.navigationController pushViewController:mainViewController animated:true];
  [self dismissViewControllerAnimated:YES completion:nil];
}




使用codepush进行ReactNative热部署

# 使用CodePush进行ReactNative热部署项目背景
  • u011151353
  • u011151353
  • 2016年02月18日 21:47
  • 10044

react-native-code-push热更新与app版本的关系

以下均是使用经验之谈,如果有不同意见的欢迎指出。 本人使用code-push做版本更新还是比较多的,确实是方便,只要不需要动到java层的代码,使用code-push来做版本迭代就是非常方便的; ...
  • zhuangchuming
  • zhuangchuming
  • 2017年03月19日 10:38
  • 1616

在iOS中创建React-Native页面,并跳转到原生页面

需求:     上一篇文章中,我们讲到怎么在iOS原生里面集成React-Native,这篇文章将讲解怎么在原生中创建React-Native页面,并且从RN页面跳转到原生页面。 我将项目更新...
  • sinat_17775997
  • sinat_17775997
  • 2017年05月04日 11:22
  • 1910

使用react-native-tab-navigator,push之后隐藏tabbar

  • 2017年02月20日 11:36
  • 296KB
  • 下载

React Native用Code Push 实现热更新

  • 2018年01月14日 00:51
  • 221KB
  • 下载

react-native热更新之在ubuntu上搭建code-push-server环境

想要实现热更新,服务器端必不可少,本文是用lisong开源的code-push-server项目来搭建服务器环境 要求node.js 版本必须大于6.0版本,更新node到最新版本  执行命令sud...
  • Zhang_junhui
  • Zhang_junhui
  • 2017年08月07日 17:46
  • 234

React Native & Code Push

本文主要实践了在已有项目中集成React native, 并且通过code push实现更新ReactNative页面。React NativeReact Native 结合了 Web 应用和 Nat...
  • very_caiing
  • very_caiing
  • 2016年03月18日 16:03
  • 1588

React Native ios android 开发指南_带书签_中文扫描完整版

  • 2017年12月28日 13:55
  • 61.78MB
  • 下载

React Native for iOS Development

  • 2017年09月04日 05:22
  • 1.64MB
  • 下载

58同城 App 在 React Native 上的开发实践-iOS 视角

  • 2016年09月28日 14:48
  • 11.72MB
  • 下载
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:react-native ios push 本地view
举报原因:
原因补充:

(最多只允许输入30个字)