How to Use share_plus in Flutter for Easy Content Sharing (Version 10.0.3)

How to Use the share plus Package in Flutter with GetX

Are you looking to add a share feature to your Flutter app? The share_plus package offers a seamless way to share text, files, and more across various platforms. This tutorial will show you how to integrate share_plus version 10.0.3 with GetX for clean state management and a full MVC structure, ensuring optimized performance.

Key Benefits of Using share_plus in Flutter

The share_plus package is one of the best options for content sharing in Flutter. Here are a few reasons why:

  • Cross-Platform Compatibility: Works on Android, iOS, Web, macOS, Windows, and Linux.
  • Simple API: Just a few lines of code to share content across different platforms.
  • Open Source: It’s free and open-source, maintained by the Flutter community.

Prerequisites

  1. Flutter SDK: Ensure you have Flutter installed.
  2. Add GetX: Install the get package for state management.
  3. Install share_plus: Add the package to your pubspec.yaml file.
 dependencies:
  flutter:
    sdk: flutter
  get: ^4.6.5
  share_plus: ^10.0.3

Run flutter pub get to install the dependencies.

Step 1: Setting up the Controller

The controller will handle the logic for sharing content. In this example, we’ll create a ShareController using GetX.

share_controller.dart

import 'package:get/get.dart';
import 'package:share_plus/share_plus.dart';

 class ShareController extends GetxController {
  // Function to share text content
  void shareText(String text) {
    Share.share(text);
  }

  // Function to share content with subject
  void shareWithSubject(String text, String subject) {
    Share.share(text, subject: subject);
  }

  // Function to share files
  void shareFile(String filePath, {String? text}) {
    Share.shareFiles([filePath], text: text);
  }
 }

In this controller:

  • shareText: This method is for sharing plain text.
  • shareWithSubject: This method adds a subject to the text.
  • shareFile: This method allows sharing a file with optional text.

Step 2: Setting up the View

The view will contain a simple UI to demonstrate sharing options. We will use a GetView<ShareController> for dependency injection.

share_view.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'share_controller.dart';

class ShareView extends GetView {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text('Share Plus Example'),
      ),
      body: Padding(
        padding: const EdgeInsets.all(16.0),
        child: Column(
          children: [
            TextField(
              controller: TextEditingController(),
              decoration: InputDecoration(labelText: 'Text to Share'),
              onChanged: (value) => controller.shareText(value),
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: () => controller.shareText("Hello from Flutter!"),
              child: const Text("Share Text"),
            ),
            const SizedBox(height: 20),
            ElevatedButton(
              onPressed: () => controller.shareWithSubject(
                "Hello from Flutter!",
                "Greetings",
              ),
              child: const Text("Share with Subject"),
            ),
          ],
        ),
      ),
    );
  }
 }

In this UI:

  • The text field accepts user input to share as text.
  • Buttons trigger the share functions using GetX binding.

Step 3: Binding the Controller

Next, bind the ShareController to the view using a custom binding.

share_binding.dart

 import 'package:get/get.dart';
 import 'share_controller.dart';

 class ShareBinding extends Bindings {
  @override
  void dependencies() {
    Get.lazyPut(() => ShareController());
  }
 }

Step 4: Configuring Routes and Running the App

Update your main.dart to use ShareBinding when navigating to ShareView.

main.dart

import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'share_view.dart';
import 'share_binding.dart';

void main() {
  runApp(MyApp());
}

 class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return GetMaterialApp(
      initialRoute: '/',
      getPages: [
        GetPage(
          name: '/',
          page: () => ShareView(),
          binding: ShareBinding(),
        ),
      ],
      title: 'Share Plus Example',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
    );
  }
 }

Wrapping Up

With the above code:

  1. You’ve set up a ShareController for handling sharing operations.
  2. You created a UI in ShareView to interact with the sharing functionality.
  3. The GetX bindings make sure everything is injected correctly.

The share_plus package, combined with the GetX architecture, allows you to easily implement content sharing across your Flutter app. Happy coding, and share your awesome content with ease!