Help us understand the problem. What is going on with this article?

Flutterでのshare機能の実装について

More than 1 year has passed since last update.

※この記事は「Dart Advent Calendar 2018」の15日目の記事になります。

概要

この記事はFlutterにおいて、share機能を実装するための解説記事になります。
share機能とは次の画像の様に、アプリに登録してある情報を他のアプリに対して転記する機能になります。
share_1.jpg

実装方法

大まかなステップは次の通りになります。
1. shareプラグインを追加する。
2. コード内にShare.share()を追加し、共有したい内容を記載する。

shareプラグインを追加する。

共有機能を追加するためにShareプラグインを追加します。

pubspec.yaml
  dependencies:
    flutter:
      sdk: flutter
      ・・・
    share: ^0.5.3

import文の追記する

「main.dart」の文頭に次の一文を追記します。

main.dart
import 'package:share/share.dart';

コード内にShare.share()を追記する

main.dart
IconButton(
 icon: Icon(Icons.share),
  onPressed: () {
   if (_formKey.currentState.validate()) {
      _formKey.currentState.save();
        Share.share(
        "シェアしたい内容を記入"
        );
   }
 },
)

サンプル

今回紹介したshare機能を使用して、入力した内容を他のアプリに共有する簡単なアプリを作成しました。

import 'package:flutter/material.dart';
import 'package:share/share.dart';

void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Demo share'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key key, this.title}) : super(key: key);
  final String title;
  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> {
  final GlobalKey<FormState> _formKey = GlobalKey<FormState>();
  String _text = "";

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text(widget.title),
      ),
      body: SafeArea(
         child: Form(
           key: _formKey,
           child: ListView(
             padding: const EdgeInsets.all(20.0),
             children: <Widget>[

            TextFormField(
              decoration: const InputDecoration(
                hintText: 'シェアしたい内容',
                labelText: 'シェアしたい内容',
              ),
              onSaved: (String value) {
                _text = value;
              },

            ),
            IconButton(
              icon: Icon(Icons.share),
              onPressed: () {
                if (_formKey.currentState.validate()) {
                  _formKey.currentState.save();
                  Share.share(
                      _text
                  );
                }
              }
            ),
          ],
        ),
        ),
      ),
    );
  }
}

実行すると、次の画像の様に入力した内容を他のアプリに共有することができます。

画面遷移.png

最後に

今回紹介したプラグインを使用すると簡単にshare機能の実装ができるので、試してみてはいかがでしょうか!

宣伝になりますが、先日FlutterとFirebaeを使ったアプリ作成の入門書を作成しました!
興味がありましたら、ぜひBoothにてお買い求めください。
Firebaseとの連携や多言語化対応など取り扱っています。

スクリーンショット 2018-12-15 午前3.49.53.png

https://booth.pm/ja/items/1040806

shimopata
臥薪嘗胆な感じでやっていき
crowdworks
21世紀の新しいワークスタイルを提供する日本最大級のクラウドソーシング「クラウドワークス」のエンジニアチームです!
https://crowdworks.co.jp/
Why not register and get more from Qiita?
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
Comments
No comments
Sign up for free and join this conversation.
If you already have a Qiita account
Why do not you register as a user and use Qiita more conveniently?
You need to log in to use this function. Qiita can be used more conveniently after logging in.
You seem to be reading articles frequently this month. Qiita can be used more conveniently after logging in.
  1. We will deliver articles that match you
    By following users and tags, you can catch up information on technical fields that you are interested in as a whole
  2. you can read useful information later efficiently
    By "stocking" the articles you like, you can search right away
ユーザーは見つかりませんでした