1.0.10 • Published 10 years ago

react-native-snapshot-view v1.0.10

Weekly downloads
34
License
-
Repository
github
Last release
10 years ago

react-native-snapshot-view

A component can generate to image (.png only now) for ios + android.

exampleSnapshot

##Install npm install react-native-image-picker@latest --save

##Link ###React Native >= 0.29 $react-native link NOTE: if you are using $react-native link and there is a error in cannot find symbol import com.cn.weiyisheng.SnapShotViewPackage;, please change the package to import com.cn.weiyisheng.snapshot.SnapShotViewPackage;, lose ".snapshot". ###React Native < 0.29 ,follow: ####ios 1.In the XCode's "Project navigator", right click on your project's Libraries folder ➜ Add Files to <...> 2.Go to node_modulesreact-native-snapshot-viewiosRCTSnapShotView ➜ select RCTSnapShotView.xcodeproj 3.Add RCTSnapShotView.a to Build Phases -> Link Binary With Libraries 4.Compile and have fun ####android

//file: android/settings.gradle
...

include ':react-native-snapshot-view'
project(':react-native-snapshot-view').projectDir = new File(settingsDir, '../node_modules/react-native-snapshot-view/android/app')
//file: android/app/build.gradle
dependencies {
  ...
  compile project(':react-native-snapshot-view')
}
// file: android/app/src/main/java/com/<...>/MainApplication.java
...

import com.cn.weiyisheng.snapshot.SnapShotViewPackage; // <-- add this import

  public class MainApplication extends Application implements ReactApplication {
      @Override
      protected List<ReactPackage> getPackages() {
          return Arrays.<ReactPackage>asList(
              new MainReactPackage(),
              new SnapShotViewPackage() // <-- add this line
          );
      }
  ...
}

##Usage

import SnapShotView from 'react-native-snapshot-view'

<TouchableOpacity 
  onPress={() => {
    const shootNum = this.state.shootNum + 1
    this.setState({
      shootNum
    })
 }}>
 </TouchableOpacity>

<SnapShotView
  fileName={"MyImage"}
  shotNumber={this.state.shootNum}
  onShoted={events => {
    console.log(' onShoted : ', events.nativeEvent.filePath); // filePath is the .png path
  }}
  style={...}>
  {YOUR CHILDREN}
</SnapShotView>

SnapShotView will generate one MyImage.png when you touch TouchableOpacity (onPress func), and you can get MyImage.png filePath at SnapShotView onShoted callback.

##Note I have not used this library in any production yet, that means this library may have some bugs and lack of ability. So, issues and advices wanted.

1.0.10

10 years ago

1.0.8

10 years ago

1.0.7

10 years ago

1.0.6

10 years ago

1.0.5

10 years ago

1.0.1

10 years ago

1.0.3

10 years ago

1.0.2

10 years ago