文章目录 一、url_launcher 插件搜索与安装1、搜索 url_launcher 插件2、安装 url_launcher 插件 二、url_launcher 插件官方示例三、打开浏览器四、打开第三方应用五、完整代码示例六、相关资源
一、url_launcher 插件搜索与安装
1、搜索 url_launcher 插件
借助 url_launcher 第三方插件 , 可以打开第三方应用 ;
该插件是 Flutter 官方提供的用于打开第三方应用的插件 ;
在 https://pub.dev/packages 搜索并安装 url_launcher 插件 ;
该插件的地址是 https://pub.dev/packages/url_launcher
2、安装 url_launcher 插件
安装插件 : 在 https://pub.dev/packages/url_launcher/install 页面有该插件的安装方法 ;
1 . 配置依赖 : 在 pubspec.yaml 配置文件中配置依赖 ;
dependencies: url_launcher: ^5.7.10
2 . 获取插件 : 点击右上角的 ” Pub get ” 按钮获取该插件 , 在下面的 Message 面板中显示 Running “flutter pub get” in flutter_cmd… 0.5s , 说明插件下载成功 ;
3 . 导入头文件 :
import ‘package:url_launcher/url_launcher.dart’;
二、url_launcher 插件官方示例
官方示例 : 这是 https://pub.dev/packages/url_launcher 页面提供的官方示例代码 ;
import ‘package:flutter/material.dart’;import ‘package:url_launcher/url_launcher.dart’;void main() { runApp(Scaffold( body: Center( child: RaisedButton( onPressed: _launchURL, child: Text(‘Show Flutter homepage’), ), ), ));}_launchURL() async { const url = ‘https://flutter.dev’; if (await canLaunch(url)) { await launch(url); } else { throw ‘Could not launch $url’; }}
三、打开浏览器
设置 RaisedButton 按钮组件 , 点击该按钮 , 自动打开浏览器 , 并打开本博客主页 ;
// 打开浏览器按钮RaisedButton( // 匿名函数 onPressed: () async { const url = ‘https://blog.csdn.net/shulianghan’; if (await canLaunch(url)) { await launch(url); } else { throw ‘Could not launch $url’; } }, // 按钮显示的组件 child: Text(“打开浏览器”),),
四、打开第三方应用
打开第三方应用的前提是 , 知道该应用的 schema 或 url , 这些都是由第三方 app 的开发者提供 ;
谷歌地图的 scheme 是 “geo:精度,维度” ;
苹果地图的 url 是 “http://maps.apple.com/?ll=精度,维度”
// 打开 Google 地图RaisedButton( // 匿名函数 onPressed: () async { // Android 谷歌地图的 scheme , 后面是北京市海淀区的经纬度 const url = ‘geo:116.3,39.95’; if (await canLaunch(url)) { // Android 手机, 打开 Google 地图 await launch(url); } else { // 如果安卓手机打不开说明是苹果手机 const url_ios = ‘http://maps.apple.com/?ll=116.3,39.95’; if (await canLaunch(url_ios)) { await launch(url_ios); } else { throw ‘Could not launch $url’; } } }, // 按钮显示的组件 child: Text(“打开地图”),),
五、完整代码示例
完整代码示例 :
import ‘package:flutter/material.dart’;import ‘package:url_launcher/url_launcher.dart’;class LauncherPage extends StatefulWidget { @override _LauncherPageState createState() => _LauncherPageState();}class _LauncherPageState extends State<LauncherPage> { @override Widget build(BuildContext context) { return MaterialApp( title: “第三方应用跳转”, theme: ThemeData(primarySwatch: Colors.blue), home: Scaffold( appBar: AppBar( title: Text(“第三方应用跳转”), leading: GestureDetector( onTap: (){ Navigator.pop(context); }, child: Icon(Icons.arrow_back_ios), ), ), body: Container( // 居中显示 alignment: Alignment.center, // 垂直线性布局 child: Column( mainAxisAlignment: MainAxisAlignment.center, children: <Widget>[ // 打开浏览器按钮 RaisedButton( // 匿名函数 onPressed: () async { const url = ‘https://blog.csdn.net/shulianghan’; if (await canLaunch(url)) { await launch(url); } else { throw ‘Could not launch $url’; } }, // 按钮显示的组件 child: Text(“打开浏览器”), ), // 打开 Google 地图 RaisedButton( // 匿名函数 onPressed: () async { // Android 谷歌地图的 scheme , 后面是北京市海淀区的经纬度 const url = ‘geo:116.3,39.95’; if (await canLaunch(url)) { // Android 手机, 打开 Google 地图 await launch(url); } else { // 如果安卓手机打不开说明是苹果手机 const url_ios = ‘http://maps.apple.com/?ll=116.3,39.95’; if (await canLaunch(url_ios)) { await launch(url_ios); } else { throw ‘Could not launch $url’; } } }, // 按钮显示的组件 child: Text(“打开地图”), ), ], ), ), ), ); }}
运行效果 :
六、相关资源
参考资料 :
Flutter 官网 : https://flutter.dev/Flutter 插件下载地址 : https://pub.dev/packagesFlutter 开发文档 : https://flutter.cn/docs ( 强烈推荐 )官方 GitHub 地址 : https://github.com/flutterFlutter 中文社区 : https://flutter.cn/Flutter 实用教程 : https://flutter.cn/docs/cookbookFlutter CodeLab : https://codelabs.flutter-io.cn/Dart 中文文档 : https://dart.cn/Dart 开发者官网 : https://api.dart.dev/Flutter 中文网 ( 非官方 , 翻译的很好 ) : https://flutterchina.club/ , http://flutter.axuer.com/docs/Flutter 相关问题 : https://flutterchina.club/faq/ ( 入门阶段推荐看一遍 )
博客源码下载 :
GitHub 地址 : https://github.com/han1202012/flutter_cmd ( 随博客进度一直更新 , 有可能没有本博客的源码 )
博客源码快照 : https://download.csdn.net/download/han1202012/15541330 ( 本篇博客的源码快照 , 可以找到本博客的源码 )
