【Flutter】 인기 패키지 사용법 ~ url_launcher 편 ~

머리

2020년 들어가고 나서 Flutter의 공부를 처음으로 왔습니다.
앞으로 여러가지 패키지를 더 공부해 나가고 싶기 때문에, 인기있는 것을 아웃풋으로서 기사로 해 나가고 싶습니다.

이번에는 url_launcher라는 패키지를 소개합니다.

지금까지 올린 기사
- shared_preferences 소개
- url_launcher 소개 ← 지금 이것
- flutter_slidable

url_launcher

앱에서 지정한 URL을 여는 패키지
URL을 여는 방법에는 세 가지가 있습니다.
- 앱 내에서 열기
- 브라우저로 전환하여 열기
- 유니버설 링크로 앱으로 직접 전환 (iOS 전용)

각 샘플을 준비했습니다.

그 밖에도 전화, SMS, 메일도 할 수 있는 것 같습니다만, 이번에는 그것들은 취급하지 않습니다.
전화는 별로 사용하는 이미지가 없는 것과 SMS와 메일은 잘 모르는데,,,

샘플

import 'dart:async';

import 'package:flutter/material.dart';
import 'package:url_launcher/url_launcher.dart';
import 'dart:core';

class SampleUrlLauncher extends StatefulWidget {
  @override
  State<StatefulWidget> createState() => _SampleUrlLauncher();
}

class _SampleUrlLauncher extends State<SampleUrlLauncher> {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('url_launcher'),
      ),
      body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
        children: [
          RaisedButton(
            child: Text('アプリ内でURLを開く'),
            onPressed: () {
              _launchInApp();
            },
          ),
          RaisedButton(
            child: Text('ブラウザでURLを開く'),
            onPressed: () {
              _launchInBrowser();
            },
          ),
          RaisedButton(
            child: Text('iOSのユニバーサルリンクを開く'),
            onPressed: () {
              _launchUniversalLinkIos();
            },
          ),
          RaisedButton(
            child: Text('5秒たったら閉じる'),
            onPressed: () {
              _launchInApp();
              Timer(
                const Duration(seconds: 5),
                () {
                  closeWebView();
                },
              );
            },
          ),
        ],
      )),
    );
  }

// アプリ内で開く
  _launchInApp() async {
    const url = 'https://pub.dev/packages/url_launcher';
    if (await canLaunch(url)) {
      await launch(
        url,
        forceSafariVC: true,
        forceWebView: true,
      );
    } else {
      throw 'このURLにはアクセスできません';
    }
  }

// ブラウザで開く
  _launchInBrowser() async {
    const url = 'https://pub.dev/packages/url_launcher';
    if (await canLaunch(url)) {
      await launch(
        url,
        forceSafariVC: false,
        forceWebView: false,
      );
    } else {
      throw 'このURLにはアクセスできません';
    }
  }

// ユニバーサルリンク
  _launchUniversalLinkIos() async {
    const url = 'https://www.youtube.com/';
    if (await canLaunch(url)) {
      await launch(
        url,
        forceSafariVC: false,
        forceWebView: false,
        universalLinksOnly: true,
      );
    } else {
      throw 'このURLにはアクセスできません';
    }
  }
}

설명

RaisedButton 각 패턴을 만들었습니다.

canLaunch : URL이 열릴지 어떨지를 판단하는 메소드

launch : URL을 여는 방법

또한 launch에서 링크를 여는 방법을 결정합니다.

forceSafariVC : iOS에서 인앱 또는 브라우저 중 하나에서 URL을 열지 결정합니다. true이 앱에서 열립니다. 기본적으로 true

forceWebView : Android에서 인앱 또는 브라우저에서 URL을 열지 결정합니다. true이 앱에서 열립니다. 기본적으로 true

universalLinksOnly : URL이 유니버설 링크와 그렇지 않을 때의 거동을 결정한다. forceSafariVC가 false 일 때만 사용할 수 있습니다. (iOS 전용)

false

유니버설 링크시 네이티브 앱 시작

범용 링크가 아닌 경우 브라우저에서 열기

true

범용 링크에서 앱이 기기에 설치되어 있으면 네이티브 앱 시작

범용 링크가 아닌 경우 PlatformException에서 오류가 발생합니다. (앱이 설치되어 있지 않아도 오류)

유니버설 링크는 URL을 열면 자동으로 앱이 시작되는 링크입니다!
Youtube나 Instagram등이군요!
약간 true/false에서의 거동의 차이가 이해하기 어렵기 때문에 주의를!

또한 closeWebView()에서 앱에서 열린 URL을 닫을 수 있습니다.

RaisedButton(
  child: Text('5秒たったら閉じる'),
  onPressed: () {
    _launchInApp();
    Timer(
      const Duration(seconds: 5),
      () {
        closeWebView();
      },
    );
  },
),

이 코드에서 Timer를 사용하여 5초 후에 closeWebView()가 움직이도록 했습니다.
따라서 버튼을 누르면 _launchInApp() URL이 열리고 5 초 후에 닫히고 원래 화면으로 돌아갑니다.

이번에는 사용하지 않지만 launch에는 statusBarBrightness라는 iOS에서 URL을 연 후 앱 상태 표시 줄의 밝기를 설정하는 것도 있습니다.

Brightness.dark

Brightness.light

로 설정합니다.

사용할 수 있는 장면

이용 약관이나 링크가 변동하지 않을 때 사용할 수 있습니까?