Sharing on Instagram Stories, Facebook stories and more direct shares in Flutter using social_share plugin.

Shekar Mudaliyar💙 — Mon, 23 Dec 2019 08:10:41 +0000

A Flutter plugin including a wide variety of sharing options you'll need to share directly to certain popular apps or just share with default native share.
You can use this plugin to share on Instagram Stories, Facebook Stories, Twitter, Sms, Copy to clipboard, Whatsapp, and also default share with or without an image.

This plugin is iOS only! Android is still in progress

So, without wasting more time on intros. Let's start

Create a new Flutter project flutter create social_share_example

Setup

Add the social_share plugin in your pubspec.yaml file

dependencies:
  social_share: ^1.0.0

To install plugins run

flutter pub get

Import plugin to your file

import 'package:social_share/social_share.dart';

Add this to your `Info.plist` to use the share on Instagram and facebook story

<key>LSApplicationQueriesSchemes</key>
    <array>
    <string>instagram-stories</string>
    <string>facebook-stories</string>
    <string>facebook</string>
    <string>instagram</string>
    <string>twitter</string>
    <string>whatsapp</string>
    </array>

Add this if you are using the share on facebook. For this, you have to create an app on https://developers.facebook.com/ and get the App ID

<key>FacebookAppID</key>
<string>xxxxxxxxxxxxxxx</string>

This is all you need to integrate this plugin in your project now lets start using it.

Click-Click-Click

I'm using screenshot plugin to capture the screen.

Let's install that too in your pubspec.yaml file

dependencies:
  screenshot: ^0.1.1

and then

flutter pub get

Then create a raised button to make a button when on clicked we can share.

RaisedButton(
                  onPressed: () async {
                    await screenshotController.capture().then((image) async {
                     // sharing methods here !!
                    });
                  },
                  child: Text("Share"),
                ),

inside the await screentshot function you can add the methods from the plugin using Socialshare class.

shareInstagramStory

SocialShare.shareInstagramStory(imageFile.path, "#ffffff",
                              "#000000", "https://deep-link-url");

shareInstagramStorywithBackground

 SocialShare.shareInstagramStorywithBackground(image.path, "https://deep-link-url",
                              backgroundImagePath: backgroundimage.path);

shareFacebookStory

SocialShare.shareFacebookStory(image.path,"#ffffff","#000000",
                              "https://deep-link-url","facebook-app-id");

copyToClipboard

SocialShare.copyToClipboard("This is Social Share plugin");

shareTwitter

//without hashtags
SocialShare.shareTwitter("This is Social Share plugin");

//with hashtags
SocialShare.shareTwitter(
                              "This is Social Share twitter example",
                              hashtags: ["hello", "world", "foo", "bar"]);

shareSms

//without url link in the message
SocialShare.shareSms("This is Social Share Sms example");

//with url link in message
SocialShare.shareSms("This is Social Share Sms example",url: "https://micro.volvmedia.com/");

shareWhatsapp

SocialShare.shareWhatsapp("Hello World");

shareOptions

This will open the default native share options

//without an image
SocialShare.shareOptions("Hello world");

//with an image
SocialShare.shareOptions("Hello world",imagePath: image.path);

That's it now you can use the sharing feature on Flutter.

Buy me a ☕ !!

((More coffee == more code) == more fast updates)

Get in touch!

Feel free to get in touch with me regarding any questions or queries.

DEV Community: Shekar Mudaliyar💙