Under alpha version development.
react-universal-canvas
html5 canvas react component polyfill for android,ios. You can use canvas for android,ios without modification to browser code.
Usage
React
Install
npm install react-universal-canvas
Add it to your project
You can use rnpm
to add native dependencies automatically:
$ rnpm link
or do it manually as described below:
iOS
Cocoapods
add the following line to your Podfile:
pod 'UniversalCanvas', :path => '../node_modules/react-universal-canvas'
or:
Manually
- Open your project in XCode, right click on
Libraries
and clickAdd Files to "Your Project Name"
Look undernode_modules/react-universal-canvas
and addUniversalCanvas.xcodeproj
. - Add
libUniversalCanvas.a
toBuild Phases -> Link Binary With Libraries
. - Click on
UniversalCanvas.xcodeproj
inLibraries
and go theBuild Settings
tab. Double click the text to the right ofHeader Search Paths
and verify that it has$(SRCROOT)/../react-native/React
- if it isn't, then add it. This is so XCode is able to find the headers that theUniversalCanvas
source files are referring to by pointing to the header files installed within thereact-native
node_modules
directory.
Android
-
in
android/settings.gradle
...include ':react-universal-canvas'project(':react-universal-canvas').projectDir = new File(rootProject.projectDir, '../node_modules/react-universal-canvas/android') -
in
android/app/build.gradle
add:dependencies {...compile project(':react-universal-canvas')} -
and finally, in
android/src/main/java/com/{YOUR_APP_NAME}/MainActivity.java
for react-native < 0.29, orandroid/src/main/java/com/{YOUR_APP_NAME}/MainApplication.java
for react-native >= 0.29 add://...// <--- This!//...@Overrideprotected List<ReactPackage> {return Arrays.<ReactPackage>;
}
## License
MIT