👋
flutterでSNSシェアする方法(iOSアプリのみ)
Xでリンクを共有する方法
social_shareパッケージを使用して下記コードのように実装
import 'package:social_share/social_share.dart';
Future<void> xPost(String url) async {
await SocialShare.shareTwitter(url);
}
LINEでリンクを共有する方法
リンク文字列を編集して、url_launcherパッケージを使用して下記コードのように実装
import 'package:url_launcher/url_launcher.dart';
Future<void> lineMessage(String url) async {
final encodedText = Uri.encodeComponent(url);
final lineUrl = Uri(
scheme: 'https',
host: 'line.me',
path: 'R/msg/text/$encodedText',
);
if (await canLaunchUrl(lineUrl)) {
await launchUrl(lineUrl, mode: LaunchMode.externalApplication);
} else {
print('Could not launch $lineUrl');
}
}
}
facebookストリーズに画像を投稿する方法
基本的な流れは下記の通り
1.Meta for Developersにアプリの登録をして、アプリIDを取得
2.Info.plistを編集
<key>LSApplicationQueriesSchemes</key>
<array>
<string>facebook-stories</string>
</array>
<key>FacebookAppID</key>
<string>{1で取得したアプリID}</string>
3.Podfileに下記を追加
target 'Runner' do
pod 'FBSDKCoreKit'
pod 'FBSDKLoginKit'
pod 'FBSDKShareKit'
end
4.Widgetを画像化する
Future<String> _createImageWithText(
String imagePath, String text, Directory documentDirectory) async {
final ui.PictureRecorder recorder = ui.PictureRecorder();
final Canvas canvas = Canvas(recorder);
final Paint paint = Paint();
// 元の画像をCanvasに描画する
final ui.Image originalImage = await _loadImage(File(imagePath));
canvas.drawImage(originalImage, Offset.zero, paint);
// テキストを描画する
final textSpan = TextSpan(
style: TextStyle(
color: Colors.white,
fontSize: 40,
),
text: text,
);
final textPainter = TextPainter(
text: textSpan,
textDirection: TextDirection.ltr,
);
textPainter.layout();
textPainter.paint(canvas, const Offset(100, 100)); // テキストの位置を調整
// 新しい画像を生成する
final ui.Image finalImage = await recorder
.endRecording()
.toImage(originalImage.width, originalImage.height);
final byteData =
await finalImage.toByteData(format: ui.ImageByteFormat.png);
final pngBytes = byteData!.buffer.asUint8List();
// 新しい画像をファイルとして保存する
final File imgFile = File('${documentDirectory.path}/image_with_text.png');
await imgFile.writeAsBytes(pngBytes);
return imgFile.path;
}
Future<ui.Image> _loadImage(File file) async {
final data = await file.readAsBytes();
return await decodeImageFromList(data);
}
5.path_provider,social_share,httpパッケージを使用する
import 'package:path_provider/path_provider.dart';
import 'package:social_share/social_share.dart';
import 'package:http/http.dart' as http;
Future<void> facebookStories(String imageUri) async {
final response = await http.get(Uri.parse(imageUri));
final documentDirectory = await getTemporaryDirectory();
final originalImageFile = File('${documentDirectory.path}/tempImage.jpg');
await originalImageFile.writeAsBytes(response.bodyBytes);
final String imagePathWithText = await _createImageWithText(
originalImageFile.path,
'好きな文字列',
documentDirectory,
);
await SocialShare.shareFacebookStory(
appId: '1で取得したアプリID',
imagePath: imagePathWithText,
backgroundTopColor: '#ffffff',
backgroundBottomColor: '#000000',
);
}
facebookフィードにリンクを投稿する方法
公式ドキュメント
基本的な流れは下記の通り
1.Meta for Developersにアプリの登録をして、アプリIDを取得
2.Info.plistを編集
<key>LSApplicationQueriesSchemes</key>
<array>
<string>fbapi</string>
</array>
<key>FacebookAppID</key>
<string>{1で取得したアプリID}</string>
3.flutterからネイティブコードを呼び出し
import 'package:flutter/services.dart';
Future<void> facebookPost(String url) async {
const MethodChannel('facebook').invokeMethod(
'facebookPost',
<String, dynamic>{
'linkUrl': url,
},
);
}
4.AppDelegate.swiftを編集
import Flutter
var controller: FlutterViewController?;
var facebook: Facebook?
self.controller = (window?.rootViewController as! FlutterViewController);
let eventChannel = FlutterEventChannel(name: EVENT_CHANNEL_NAME, binaryMessenger: controller!.binaryMessenger)
if let viewController = self.window?.rootViewController {
self.facebook = Facebook(with: controller!.binaryMessenger, viewController: viewController)
} else {
// 適切なエラーハンドリング...
}
5.facebookフィードに投稿する為の実装(ios/Runner/Component下にFacebook.swiftファイルを新規作成)
import Foundation
import Flutter
import FBSDKShareKit
class Facebook: SharingDelegate {
private var channel: FlutterMethodChannel?
private weak var viewController: UIViewController?
init(with binaryMessenger: FlutterBinaryMessenger, viewController: UIViewController) {
self.viewController = viewController
channel = FlutterMethodChannel(name: "facebook", binaryMessenger: binaryMessenger)
channel?.setMethodCallHandler(handle)
}
private func handle(_ call: FlutterMethodCall, result: @escaping FlutterResult) {
switch call.method {
case "facebookPost":
let content = ShareLinkContent()
guard let args = call.arguments as? [String: String],
let linkUrl = args["linkUrl"] as String?,
let url = URL(string: linkUrl) else {
result(false)
return
}
content.contentURL = url
let dialog = ShareDialog(viewController: viewController, content: content, delegate: self)
dialog.show()
default:
result(FlutterMethodNotImplemented)
}
}
// SharingDelegateのメソッド
@objc func sharer(_ sharer: Sharing, didCompleteWithResults results: [String : Any]) {
print("Share completed with results: \(results)")
}
@objc func sharer(_ sharer: Sharing, didFailWithError error: Error) {
print("Share failed with error: \(error)")
}
@objc func sharerDidCancel(_ sharer: Sharing) {
print("Share cancelled")
}
}
Discussion