Share your images to instagram and snapchat stories.
OS | Type | Supported |
---|---|---|
iOS | BASE64 | YES |
FILE | YES | |
Android | BASE64 | YES |
FILE | YES |
$ yarn add react-native-story-share
or
$ npm install react-native-story-share --save
Mostly automatic installation
or Manual installation
Integration
guide$ react-native link react-native-story-share
Libraries
➜ Add Files to [your project's name]
node_modules
➜ react-native-story-share
and add RNStoryShare.xcodeproj
libRNStoryShare.a
to your project's Build Phases
➜ Link Binary With Libraries
Cmd+R
)android/app/src/main/java/[...]/MainActivity.java
import com.jobeso.RNStorySharePackage;
to the imports at the top of the filenew RNStorySharePackage()
to the list returned by the getPackages()
methodandroid/settings.gradle
:
include ':react-native-story-share'
project(':react-native-story-share').projectDir = new File(rootProject.projectDir, '../node_modules/react-native-story-share/android')
android/app/build.gradle
:
compile project(':react-native-story-share')
<application ...>
...
...
add snap sdk
maven { url "https://storage.googleapis.com/snap-kit-build/maven" }
Build Settings
section Build Options
set Always Embed Swift Started Libraries
to true
library search paths
$(inherited)
$(TOOLCHAIN_DIR)/usr/lib/swift/$(PLATFORM_NAME)
instagram-stories
and snapchat
to the LSApplicationQueriesSchemes
key in your app's Info.plist....
<key>LSApplicationQueriesSchemes</key>
<array>
...
+ <string>instagram-stories</string>
+ <string>snapchat</string>
</array>
...
SCSDKClientId
to your Info.plist
pod 'SnapSDK', :subspecs => ['SCSDKCreativeKit']
to your Podfile with use_frameworks!
import RNStoryShare from "react-native-story-share";
RNStoryShare.isInstagramAvailable()
.then(isAvailable => {
if(isAvailable){
RNStoryShare.shareToInstagram({
type: RNStoryShare.BASE64, // or RNStoryShare.FILE
attributionLink: 'https://myproject.com',
backgroundAsset: 'data:image/png;base64,iVBO...',
stickerAsset: 'data:image/png;base64,iVBO...',
backgroundBottomColor: '#f44162',
backgroundTopColor: '#f4a142'
});
}
})
.catch(e => console.log(e));
import RNStoryShare from "react-native-story-share";
RNStoryShare.isSnapchatAvailable()
.then(isAvailable => {
if(isAvailable){
RNStoryShare.shareToSnapchat({
type: RNStoryShare.BASE64, // or RNStoryShare.FILE
attributionLink: 'https://myproject.com',
backgroundAsset: 'data:image/png;base64,iVBO...',
stickerAsset: 'data:image/png;base64,iVBO...',
captionText: 'text exemple',
media: "photo" // or "video"
stickerOptions: {
height: 900,
width: 900
}
});
}
})
.catch(e => console.log(e));
Name | Value |
---|---|
BASE64 | "base64" |
FILE | "file" |
isInstagramAvailable(): Promise<boolean>
Return a boolean indicating if Instagram is available on the phone.
isSnapchatAvailable(): Promise<boolean>
Return a boolean indicating if Snapchat is available on the phone.
shareToInstagram(config: ShareConfigObject): Promise<void>
type ShareConfigObject = {
type: "base64" || "file",
attributionLink: string,
backgroundAsset: string,
stickerAsset: string,
stickerOptions: {
height: integer,
width: integer
}
}
Shares a file or base64 image as background, sticker or both to Instagram. The background colors are only applyed when no background asset is set.
shareToSnapchat(config: ShareConfigObject): Promise<void>
type ShareConfigObject = {
type: "base64" || "file",
attributionLink: string,
backgroundAsset: string,
stickerAsset: string,
backgroundBottomColor: string,
backgroundTopColor: string
}
Shares a file or base64 image as background, sticker or both to Snapchat. stickerOptions
are only supported by Android.