Flutter LINE SDKをインストール

フフフ・・・こんな簡単なこともわからなかったので書き残しておくのですよ。

FlutterでAndroid/iOS両方のアプリを作りたいのですが、LINEログインをしたい。ということ。その組み込み方。よく読むと公式に書いてるんですけどね・・・

flutter_line_sdk 自身はこちらで開発されています。

が、、、こちらを読む限り関係ないのですね・・・インストール方法を読む限り、pubspec.ymlに必要事項を記入しflutter pub getを実行すれば依存関係がダウンロードされるらしい。Mavenみたいですね。楽ちんです。初めどこかからかライブラリをダウンロードして自前でフォルダに入れるのかとか、化石みたいな事を思ってしまった僕はもう淘汰されるべき人間なのかもしれません。

1.Open the pubspec.yaml file in your app folder and, under dependencies, add flutter_line_sdk:.
2.Install it by running this in a terminal: flutter pub get

プラグイン自身はこちらで管理されているらしく・・・ここで flutter_line_sdk を検索すると出てきます。

pub.dev

検索されたflutter_line_sdkはこちらですね。
pub.dev

install自身は簡単で、プロジェクトのpubspec.ymlのdependenciesに以下を記載し、プロジェクトフォルダ内でflutter pub get を実行します。またはAndroid Studioを使っているのであればpubspec.ymlを開いているテキストエディタの右上に「pub get」ボタンがあるのでそれを押します。

dependencies:
  flutter_line_sdk: ^1.3.0       <----- これを追加

プロジェクト内を確認するとExternal Librariesに追加されてますね。
f:id:arcanum_jp:20201106113416p:plain

あとはLINE SDKを使うファイル内でインポートします。

import 'package:flutter_line_sdk/flutter_line_sdk.dart';

ここで一旦実行してみましょう。

あれ？エラーがでるぞ？minSdk を21以上にしろって。

	Suggestion: use a compatible library with a minSdk of at most 16,
		or increase this project's minSdk version to at least 21,
		or use tools:overrideLibrary="com.linecorp.flutter_line_sdk" to force usage (may lead to runtime failures)

ということで、build.gradleのminSdkVersionの値を16->21にして実行してみます。

    defaultConfig {
        // TODO: Specify your own unique Application ID (https://developer.android.com/studio/build/application-id.html).
        applicationId "jp.arcanum.tomiya_gomi_app"
       //  minSdkVersion 16
        minSdkVersion 21             <------------ ここ！
        targetSdkVersion 29
        versionCode flutterVersionCode.toInteger()
        versionName flutterVersionName
    }

とりあえずコンパイルは完了して実行はできたようです。
f:id:arcanum_jp:20201106112646p:plain

flutter_line_sdkのページをもう一回よく読むと前提に書いてますね。minSdkVersion set to 21 or higher って。こういう所はpubspec.ymlとかじゃなくて実際のプラットフォーム側の設定ファイルに書く必要があるのですね。

Prerequisites 
　　iOS 10.0 or later as the deployment target
　　Android minSdkVersion set to 21 or higher (Android 5.0 or later)  <----ここ！
　　LINE Login channel linked to your app

さて次に実際にログインしてみます。

サンプルコードを書き書きします。main関数でLineSDKのセットアップが必要なようです。ここでチャネルIDを指定してセットアップします。

void main() {
  WidgetsFlutterBinding.ensureInitialized();
  LineSDK.instance.setup('1234567890').then((_) {
    print("LineSDK Prepared");
  });
  runApp(MyApp());
}

どこかのボタンとかのイベントでログインするコード。非同期的なコードが同期的に書けるようです。これは素晴らしい。

  void _incrementCounter() async {
    try {
      final result = await LineSDK.instance.login();
      setState(() {
        print(result.userProfile.userId);
        print(result.userProfile.displayName);
        print(result.userProfile.pictureUrl);
        print(result.userProfile.pictureUrlLarge);
        print(result.userProfile.pictureUrlSmall);
        print(result.userProfile.statusMessage);

      });
    }
    on PlatformException catch(e) {
      print(e);
    }
  }

LINE Developer側でも設定が必要です。LINEログイン設定の項目でAndroidであればパッケージを入力しておきます。
f:id:arcanum_jp:20201106161553p:plain

以下はFlutterのデモ画面にあるボタンに上記のログイン機能を組み込んでみました。右下のボタンをタップするとLINEログインします。
f:id:arcanum_jp:20201106161747p:plain

これはLINEアプリが入っていないシミュレーターなのでLINEのWebログイン画面が表示されます。LINEアプリが入っている端末の場合はLINEアプリでのログイン画面になります。
f:id:arcanum_jp:20201106161857p:plain

ID/PASS入力後こんな感じでアプリに権限を与えるかの画面が表示されますのでAllowを押します。押すとFlutterアプリに戻ってきます。やったね！
f:id:arcanum_jp:20201106162158p:plain

arcanum_jp’s blog

おっさんの日記

Flutter LINE SDKをインストール