21个最佳Flutter软件包,用于简化Flutter应用开发

介绍

Flutter中,各开发人员提供了对共享软件包的支持,这使我们能够轻松构建应用程序。它可以避免开发人员从头开始开发。我们可能使用它们来请求网络(HTTP),API集成以及使用第三方平台。在本文中,我会列出21个Flutter软件包以简化Flutter的开发,一起来看一下(这些都在以下网站列出):

https://pub.dev/

21个最佳Flutter软件包,用于简化Flutter应用开发

Path_provider

这是一个用于在iOS和Android开发环境中的文件系统上定位文件的Flutter插件包

代码示例:

Directory tempDir = await getTemporaryDirectory();
String tempPath = tempDir.path;Directory appDocDir = await getApplicationDocumentsDirectory();String appDocPath = appDocDir.path;

Url_launcher

这是一个Flutter插件,用于在移动平台中启动URL。它主要支持iOS和Android开发平台。要使用url_launcher,请在pubspec.yaml文件中添加为依赖项。

代码示例:

import \'package:flutter/material.dart\';
import \'package:url_launcher/url_launcher.dart\';void main() {runApp(Scaffold(body: Center(child: RaisedButton(onPressed: _launchURL,child: Text(\'...\'),),),));}_launchURL() async {const url = \'...\';if (await canLaunch(url)) {await launch(url);} else {throw \'...\';}}

Image_picker

Image_picker是一用于在iOS和Android库中选择图像,用户也可以拍摄新图像的flutter插件

代码示例:

import \'package:image_picker/image_picker.dart\';
class MyHomePage extends StatefulWidget {@override_MyHomePageState createState() => _MyHomePageState();}class _MyHomePageState extends State {File _image;Future getImage() async {var image = await ImagePicker.pickImage(source: ImageSource.camera);setState(() {_image = image;});}@overrideWidget build(BuildContext context) {return Scaffold(appBar: AppBar(title: Text(\'Image Picker Example\'),),body: Center(child: _image == null? Text(\'No image selected.\'): Image.file(_image),),floatingActionButton: FloatingActionButton(onPressed: getImage,tooltip: \'Pick Image\',child: Icon(Icons.add_a_photo),),);}}

sqflite

SQLite插件,支持iOS和Android开发平台

import ‘package: sqflite/sqflite.dart;
// 使用getDatabasePath获取路径var databasesPath = await getDatabasesPath();String path = join(databasesPath, \'demo.db\');// 删除数据库await deleteDatabase(path);// 打开数据库Database database = await openDatabase(path, version: 1,onCreate: (Database db, int version) async {// 创建数据库时,也要创建表await db.execute(\'CREATE TABLE Test (id INTEGER PRIMARY KEY, name TEXT, value INTEGER, num REAL)\');});

cached_network_image

这是一个用于显示缓存目录中保存的来自互联网的图像的Flutter插件

代码示例:

CachedNetworkImage(
imageUrl: "http://via.placeholder.com/350x150",placeholder: (context, url) => new CircularProgressIndicator(),errorWidget: (context, url, error) => new Icon(Icons.error),),Image(image: new CachedNetworkImageProvider(url))

Google_maps_flutter

用于在iOS和Android应用程序上集成Google地图。对于Android或iOS,请在应用清单中指定API密钥,如下所示:

android/app/src/main/AndroidManifest.xml:
--ios/Runner/AppDelegate.m:

代码示例:

ios/Runner/AppDelegate.m:
#include "AppDelegate.h"#include "GeneratedPlug-inRegistrant.h"#import "GoogleMaps/GoogleMaps.h"@implementation AppDelegate- (BOOL)application:(UIApplication *)applicationdidFinishLaunchingWithOptions:(NSDictionary *)launchOptions {[GMSServices provideAPIKey:@"YOUR KEY HERE"];[GeneratedPlug-inRegistrant registerWithRegistry:self];return [super application:application didFinishLaunchingWithOptions:launchOptions];}@end

Scope model

这些是用于将数据模型从父窗口小部件传递到其后代的实用程序集。更新模型时,它将重建自己的子代

/**
创建一个拥有一些视图状态的类计数器从0开始,可以递增。注意:它必须从Model扩展。*/class CounterModel extends Model {int _counter = 0;int get counter => _counter;void increment() {// 首先,增加计数器_counter  ;// 然后通知所有侦听器。notifyListeners();}}class CounterApp extends StatelessWidget {@overrideWidget build(BuildContext context) {return new ScopedModel(model: new CounterModel(),child: new Column(children: [new ScopedModelDescendant(builder: (context, child, model) => new Text(\'${model.counter}\'),),new Text("Another widget that doesn\'t depend on the CounterModel")]));}}

Provider

这是一个为小部件构建的依赖项注入系统。

代码示例:

  • 公开一个值:

小部件包装到包中的提供程序小部件中,然后将其传递给变量,以便所有新的提供程序都可以访问变量

Provider.value(
value: \'Hello World!\',child: MaterialApp(home: Home(),))
  • 读取一个值
Provider.value(
value: \'Hello World\',child: Consumer(builder: (context, value, child) => Text(value),),);
  • 多个Provider
Provider.value(
value: foo,child: Provider.value(value: bar,child: Provider.value(value: baz,child: someWidget,)))

firebase_storage

这是用于Firebase云存储API的flutter插件,它是功能强大,简单且经济高效的对象存储服务,适用于Android和iOS。要使用此插件,pubspec.yaml文件中将添加firebase_ storgage为依赖项,此插件仍在开发中,某些API可能尚不可用。

Flutter_webview_plug-in

这是一个允许flutter与本机Webview进行通信flutter插件。下面是一个使用flutter导航启动全屏Webview的示例。当页面加载时,hidden和initialChild可用于显示其他内容。

new MaterialApp(
routes: {"/": (_) => new WebviewScaffold(url: "https://...",appBar: new AppBar(title: new Text("Widget webview"),),),},);

Package_info

这是一个提供用于在Android和iOS上查询应用程序包信息的API的插件

Import \'package: package_info/package_info.dart\';
PackageInfo packageInfo = await PackageInfo.fromPlatform();String appName = packageInfo.appName;String packageName = packageInfo.packageName;String version = packageInfo.version;String buildNumber = packageInfo.buildNumber;

device_info

用于提供有关设备的详细信息,例如品牌,型号以及Android或iOS版本的插件。它提供有关手头设备的当前信息。

Import \'package:device_info/device_info.dart\';
DeviceInfoPlugin deviceInfo = DeviceInfoPlugin();AndroidDeviceInfo androidInfo = await deviceInfo.androidInfo;print(\'Running on ${androidInfo.model}\');IosDeviceInfo iosInfo = await deviceInfo.iosInfo;print(\'Running on ${iosInfo.utsname.machine}\');

bloCbuilder

一个Flutter小部件,它简化了业务逻辑组件设计模式的实现。这是一个需要Bloc和Builder功能的Flutter小部件。BlocBuilder负责根据新状态下的响应来构建窗口小部件。BlockBuilder与streamBuilder相似,但由于其简单的API,因此所需的代码量更少。例:

BlocBuilder(
 bloc: BlocA(),  builder: (context, state) {  //根据BlocA的状态返回小部件  })

webview_flutter

可在iOS和Android上提供Webview小部件。WKWwebview在iOS上支持webview,而webView在Android上支持webview

Location

可处理iOS Android上的实时位置。它还提供性能和电池优化设置。

import \'package:location/location.dart\';
var currentLocation = LocationData;var location = new Location();try {currentLocation = await location.getLocation();} on PlatformException catch (e) {if (e.code == \'PERMISSION_DENIED\') {error = \'Permission denied\';}currentLocation = null;}
var location = new Location();
location.onLocationChanged().listen((LocationData currentLocation) {print(currentLocation.latitude);print(currentLocation.longitude);});

Flutter Spinkit

它是一组loading加载器,这些loading随着抖动而动起来,以便在加载过程继续进行时为用户提供漂亮的外观。

SpinKitFadingCircle(
itemBuilder: (_, int index) {return DecoratedBox(decoration: BoxDecoration(color: index.isEven ? Colors.red : Colors.green,),);},);

AudioPlayers

用于在Android和iOS中同时播放多个音频文件。

audioplayers: ^0.13.0
AudioPlayer audioPlayer = AudioPlayer ();AudioPlayer audioPlayer = AudioPlayer (mode: playermode.LOW_LATENCY);

Image_cropper

它是适用于iOS和Android的Flutter插件,支持裁剪图片。

Connectivity

允许Flutter应用发现网络连接并进行相应配置。该插件具有区分蜂窝连接和WiFi连接的能力。

import \'package:connectivity/connectivity.dart\';
var connectivityResult = await (Connectivity().checkConnectivity());if (connectivityResult == ConnectivityResult.mobile) {//我已连接到移动网络} else if (connectivityResult == ConnectivityResult.wifi) {//我已连接到WIFI}

Shimmer

提供了一种在flutter项目中添加闪烁效果的简便方法。

SizedBox(
width: 200.0,height: 100.0,child: Shimmer.fromColors(baseColor: Colors.red,highlightColor: Colors.yellow,child: Text(\'Shimmer\',textAlign: TextAlign.center,style: TextStyle(fontSize: 40.0,fontWeight:FontWeight.bold,),),),);

Share Plug-in

用于通过共享对话框共享来自flutter应用程序的内容。它包装了Android上的ACTION_SEND intent和iOS上的UIActivityViewController。

import \'package:share/share.dart\';
Share.share(check out my website https://....com\');

总结

Flutter软件包使我们能够快速构建应用程序,并节省宝贵的时间来构建产品,大大提升了工作效率。

内容出处:,

声明:本网站所收集的部分公开资料来源于互联网,转载的目的在于传递更多信息及用于网络分享,并不代表本站赞同其观点和对其真实性负责,也不构成任何其他建议。如果您发现网站上有侵犯您的知识产权的作品,请与我们取得联系,我们会及时修改或删除。文章链接:http://www.yixao.com/share/10827.html

发表评论

登录后才能评论