您当前的位置:首页 > 电脑百科 > 程序开发 > 开源程序 > 百科

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

时间:2021-01-27 10:05:20  来源:  作者:

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

https://pub.dev/

 


 

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

 


Path_provider

这是一个用于在IOSAndroid开发环境中的文件系统上定位文件的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;
});
}

@override
Widget 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 *)application
didFinishLaunchingWithOptions:(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 {
@override
Widget build(BuildContext context) {
return new ScopedModel<CounterModel>(
model: new CounterModel(),
child: new Column(children: [
new ScopedModelDescendant<CounterModel>(
builder: (context, child, model) => new Text('${model.counter}'),
),
new Text("Another widget that doesn't depend on the CounterModel")
])
);
}
}

Provider

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

代码示例:

  • 公开一个值:

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

Provider<String>.value(
value: 'Hello World!',
child: MaterialApp(
home: Home(),
)
)
  • 读取一个值
Provider<String>.value(
value: 'Hello World',
child: Consumer<String>(
builder: (context, value, child) => Text(value),
),
);
  • 多个Provider
Provider<Foo>.value(
value: foo,
child: Provider<Bar>.value(
value: bar,
child: Provider<Baz>.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软件包使我们能够快速构建应用程序,并节省宝贵的时间来构建产品,大大提升了工作效率。



Tags:Flutter   点击:()  评论:()
声明:本站部分内容及图片来自互联网,转载是出于传递更多信息之目的,内容观点仅代表作者本人,如有任何标注错误或版权侵犯请与我们联系(Email:2595517585@qq.com),我们将及时更正、删除,谢谢。
▌相关推荐
在Flutter中,各开发人员提供了对共享软件包的支持,这使我们能够轻松构建应用程序。它可以避免开发人员从头开始开发。我们可能使用它们来请求网络(HTTP),API集成以及使用第三方平...【详细内容】
2021-01-27  Tags: Flutter  点击:(189)  评论:(0)  加入收藏
带你重新“玩转”FlutterFlutter作为一项已经逐渐进入规模化实践的技术,它的价值已经初步获得认可,后续应该有不错的生命力。作为较早期的Flutter实践者,我一直在思考Flutter的...【详细内容】
2021-01-13  Tags: Flutter  点击:(124)  评论:(0)  加入收藏
“一套代码,多端运行。”是很多开发团队的梦想,直到 2018 年 12 月 5 日,谷歌正式发布 Flutter 1.0 版本,前端开发者向这一梦想前进了一大步。Flutter 仅用了不到一年的时间就在...【详细内容】
2020-12-09  Tags: Flutter  点击:(150)  评论:(0)  加入收藏
谷歌的 Flutter 跨平台应用开发框架正迅速成为移动跨平台开发人员的最爱。尽管 Flutter 由于谷歌的大力支持正在迅速成熟,但社区仍然没有太多第三方开发工具可用。不过仔细挑...【详细内容】
2020-11-12  Tags: Flutter  点击:(99)  评论:(0)  加入收藏
大家好,我是章鱼猫。今天给大家推荐的这个开源项目,是来自于我们公众号读者的投稿,这个东西还挺好的。如果你作为读者,也有自己的开源项目或者你也有想推荐的开源项目,都可以向...【详细内容】
2020-09-15  Tags: Flutter  点击:(112)  评论:(0)  加入收藏
内存水位升高导致的稳定性问题严重影响app用户体验,所以开发者们非常关注Flutter的内存表现。随着Flutter业务越来越多,闲鱼也面临着oom导致的crash率提升的问题,下面我们结合...【详细内容】
2020-08-13  Tags: Flutter  点击:(66)  评论:(0)  加入收藏
介绍Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用...【详细内容】
2020-06-18  Tags: Flutter  点击:(149)  评论:(0)  加入收藏
Flutter 作为革命性的跨终端解决方案,于 2018 年 12 月正式发布,仅用了不到一年的时间就在 GitHub 和 StackOverflow 上获得了比 React Native 更高的知名度。那么所有项目都...【详细内容】
2020-06-05  Tags: Flutter  点击:(66)  评论:(0)  加入收藏
注意:在windows环境下开发flutter应用建议采用win10,因为有win7下缺少开发依赖的组件1、到flutter官网下载安装文件,https://flutter.dev/docs/get-started/install2、下载完成...【详细内容】
2019-11-21  Tags: Flutter  点击:(106)  评论:(0)  加入收藏
一、移动跨平台技术演进 1. 引言移动互联网发展十余年,伴随着 Android、iOS 等智能手机的不断普及,移动端已逐步取代 PC 端,成为兵家必争之地。正所谓“得移动端者得天下”,移动...【详细内容】
2019-11-08  Tags: Flutter  点击:(70)  评论:(0)  加入收藏
▌简易百科推荐
大家好,我是等天黑, 今天介绍一个开源免费的监控工具 Uptime Kuma, 简单实用, 主要用来监控 Web 和网络, 和 Prometheus 不一样的是, 它是轻量的, 基于Node.js 和 Vue 3 开发...【详细内容】
2021-12-16  全球技术精选    Tags:监控工具   点击:(13)  评论:(0)  加入收藏
Svelte https://svelte.dev/Svelte 是一种全新的构建用户界面的方法。传统框架如 React 和 Vue 在浏览器中需要做大量的工作,而 Svelte 将这些工作放到构建应用程序的编译阶...【详细内容】
2021-11-09  风吹草低见到喜洋洋    Tags:开源软件   点击:(73)  评论:(0)  加入收藏
开源精选》是我们分享Github、Gitee等开源社区中优质项目的栏目,包括技术、学习、实用与各种有趣的内容。本期推荐的是 Lilishop 商城系统 基于SpringBoot 研发,B2B2C多用户商...【详细内容】
2021-10-21  GitHub精选    Tags:Lilishop   点击:(225)  评论:(0)  加入收藏
前言一个基于spring boot的JAVA开源商城系统,是前后端分离、为生产环境多实例完全准备、数据库为b2b2c商城系统设计、拥有完整下单流程和精美设计的java开源商城系统https://...【详细内容】
2021-09-17  Java架构师知识    Tags:开源商城   点击:(119)  评论:(0)  加入收藏
Web项目开发中视频播放是一个非常常见的需求,需要播放器能够支持pc端和移动端的使用,并且支持常见的视频格式。我们从github上精选了5款优秀的Html5 播放器插件分享给大家。(排...【详细内容】
2021-09-17  IT宇哥    Tags:播放器   点击:(99)  评论:(0)  加入收藏
本文盘点了 7 月份比较火的几个开源项目,涉及 Java、Python、教程等,这些开源项目分别是:1. 主流技术栈原理2. 数据可视化分析工具3. Spring 手撸专栏4. 接口管理平台5. 直播源...【详细内容】
2021-08-04  一个快乐的摸鱼人    Tags:开源项目   点击:(79)  评论:(0)  加入收藏
今天,要和大家推荐一个Go 编写的开源推荐系统&mdash;&mdash;Gorse。 Gorse 旨在成为一个通用的开源推荐系统,可以快速引入各种在线服务。通过将商品、用户和交互数据导入 Gors...【详细内容】
2021-08-02  程序员吖  今日头条  Tags:推荐系统   点击:(104)  评论:(0)  加入收藏
什么是kubeedge:KubeEdge是一个开源系统,用于将容器化应用程序编排功能扩展到Edge的主机。它基于kubernetes构建,并为网络应用程序提供基础架构支持。云和边缘之间的部署和元...【详细内容】
2021-06-28  pythontaotao    Tags:kubeedge   点击:(225)  评论:(0)  加入收藏
什么是开源?开源(Open Source)全称是:开放源代码。在今天,不仅是软件的源代码,还有硬件的机械图、电路图、PCB图,甚至整个工程项目的源文件,也都是开源的对象。开源的目的,就是让用户...【详细内容】
2021-05-31  机电匠  今日头条  Tags:开源协议   点击:(228)  评论:(0)  加入收藏
近日,微软开源了AI安全风险评估工具Counterfit,该工具旨在帮助开发人员测试AI和机器学习系统的安全性。该公司表示,Counterfit可以使组织进行评估,以确保其业务中使用的算法是可...【详细内容】
2021-05-06    雷锋网  Tags:Counterfit源代码   点击:(234)  评论:(0)  加入收藏
最新更新
栏目热门
栏目头条