08.10.2020 Views

How to Create Bridge in React Native for iOS and Android?

React Native is developed in such a way that we will create a bridge between the language and therefore the JavaScript code. A “bridge” is nothing but how to line up communication between native platform and React Native.

React Native is developed in such a way that we will create a bridge between the language and therefore the JavaScript code. A “bridge” is nothing but how to line up communication between native platform and React Native.

SHOW MORE
SHOW LESS

Create successful ePaper yourself

Turn your PDF publications into a flip-book with our unique Google optimized e-Paper software.

Main thread: where UIKit work

Shadow queue: where the layout happens

JavaScript thread: where your JS code is really running

Every native module has its own GCD Queue except it determines otherwise. Now since this Native module will run on a

special thread and our main thread depends thereon , it's showing this warning. And to form this code to run on

MainQueue, open Bulb.swift and add this function.

@objc

static func requiresMainQueueSetup() -> Bool {

return true

}

You can explicitly mention return false to run this during a separate threat.

Step 3 - Accessing a variable in JavaScript from Swift and Callbacks

add the Bulb Status(ON or OFF) value to our React screen. to try to do so we'll add the getStatus function to Bulb.swift

and call that method from JavaScript code. we'll create this method as a callback.

Let's update the code in bold in Bulb.swift

Import Foundation

@oblc(Bulb)

Class Bulb :NSObject {

@objc

Static var isOn = false

@objc

Func turnOn () {

Bulb.isOn= true

Print (“Bulb is now ON”)

}

@objc

Func turnOFF(){

Bulb.isOn = false

Print (“”print Bulb is now OFF”)

}

Hooray! Your file is uploaded and ready to be published.

Saved successfully!

Ooh no, something went wrong!