移动应用程序开发的未来:Flutter

并再次输出:

I printed right away!

Waited 3 seconds to return this without blocking execution.

有了异步操作,我们在执行需要比较久才能完成的代码的同时,其余代码的执行也不会被妨碍。

二、只写一次代码,就能同时在Android和iOS上运行

========================================================================================

考虑到需要为Android和iOS使用不同的代码库,开发移动应用程序可能需要花费大量时间。除非您使用像Flutter这样的SDK,这样您就将拥有一个能适配两个操作系统的代码库。不仅如此,你还可以完全原生地运行它们。这意味着诸如浏览页面和导航之类的东西,完美配合不同的操作系统。

一言以蔽之,只要您有个设备或模拟器在运行着,Flutter就可以使构建和运行您的应用程序来进行测试的过程简单到动动手指就能完成。

三、UI开发

==================================================================

UI开发几乎是我最不期待的事情之一。我更像是一个后端开发人员,所以当涉及到严重依赖它的东西时,我只想要一些简单的东西。这就是Flutter在我眼中闪耀的地方。

UI通过将不同的小部件组合在一起并修改它们以适合你的App外观来创建。你几乎可以完全控制这些小部件的显示方式,因此你最终总是会得偿所愿。为了布局UI,可以使用诸如Row,Column和Container之类的小部件。对于内容,有诸如Text和RaisedButton之类。这只是Flutter提供的小部件中的几个,除这些之外还有很多。使用这些小部件,我们可以构建一个非常简单的UI:

@override

Widget build(BuildContext context) {

return Scaffold(

appBar: AppBar(

title: Text(‘Flutter App’),

centerTitle: true,

elevation: 0,

),

body: Row(

mainAxisAlignment: MainAxisAlignment.center,

children: [

Column(

mainAxisAlignment: MainAxisAlignment.center,

children: [

Container(

child: Text(‘Some text’),

),

Container(

child: RaisedButton(

onPressed: () {

// Do something on press

},

child: Text(‘PRESS ME’),

),

),

],

),

],

),

);

}

[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-gcd7ipPE-1594103092983)(https://upload-images.jianshu.io/upload_images/22436740-905dc24af6484113?imageMogr2/auto-orient/strip%7CimageView2/2/w/1240)]

Flutter像一个拥有各种各样道具的魔术师,使你能轻而易举地构建App的主题。你可以通过手动更改字体,颜色,并逐个设置所有内容,但这需要太长时间了。相反,Flutter为我们提供了一个名为ThemeData的东西,它允许我们为颜色,字体,输入字段等等设值。此功能在保持应用外观的一致性方面很出色。

theme: ThemeData(

brightness: Brightness.dark,

canvasColor: Colors.grey[900],

primarySwatch: Colors.teal,

primaryColor: Colors.teal[500],

fontFamily: ‘Helvetica’,

primaryTextTheme: Typography.whiteCupertino.copyWith(

display4: TextStyle(

color: Colors.white,

fontSize: 36,

),

),

),

使用此ThemeData,我们设置应用程序颜色,字体系列和一些文本样式。除文本样式之外的所有内容都将自动应用于整个app范围。每个小部件的文本样式必须手动地一个一个设置,但这仍然很简单:

child: Text(

‘Some text’,

style: Theme.of(context).primaryTextTheme.display4,

),

为了进一步提高效率,Flutter可以热重新加载应用程序,因此您无需在每次更改UI时重新打开它。您现在可以进行更改,保存,然后在大概一秒内就能看到更改后的效果。

四、库

===============================================================

Flutter提供了许多开箱即用的强大功能,但有时你需要更多功能。考虑到Dart和Flutter的大量可用的库,这根本不是问题。是否有兴趣在你的应用中投放广告?有这方面的库。想要新的小部件吗?有这方面的库。

如果你更喜欢自己动手DIY,可以创建自己的库并马上就能与社区其他人分享。向项目添加库很简单,可以通过向pubspec.yaml文件添加一行代码来完成。例如,如果要添加sqflite库:

dependencies:

flutter:

sdk: flutter

sqflite: ^1.0.0

将它添加到文件后,运行flutter packages get,这样就好了。各种各样的库使开发Flutter应用程序变得轻而易举,并为开发过程节省了大量时间。

五、后端开发

==================================================================

现在大多数App都依赖于某种数据,所有这些数据需要存储在某个地方,以便以后可以显示和使用。因此,在寻找使用新SDK(例如Flutter)创建应用时,牢记这一点非常重要。

再重复一次,Flutter App是使用Dart制作的,而Dart在后端开发方面非常出色。我在本文中谈到了很多简单易行的功能,Dart和Flutter的后端开发也不例外。不管是对于初学者还是专家,创建数据驱动的App都非常简单,但这种简单性并不等同于质量底下。

可以使用库,以便你使用所选择的数据库。使用sqflite库,我们可以非常快速地启动并运行SQLite数据库。感谢单件模式,我们可以访问数据库并从几乎任何地方都可以进行查询,而无需每次都重新创建一个对象。

class DBProvider {

// Singleton

DBProvider._();

// Static object to provide us access from practically anywhere

static final DBProvider db = DBProvider._();

Database _database;

Future get database async {

if (_database != null) {

return _database;

}

_database = await initDB();

return _database;

}

initDB() async {

// Retrieve your app’s directory, then create a path to a database for your app.

Directory documentsDir = await getApplicationDocumentsDirectory();

String path = join(documentsDir.path, ‘money_clip.db’);

return await openDatabase(path, version: 1, onOpen: (db) async {

// Do something when the database is opened

}, onCreate: (Database db, int version) async {

// Do something, such as creating tables, when the database is first created.

// If the database already exists, this will not be called.

}

}

}

从数据库中检索数据后,可以使用一个模型将其转换为对象。或者,如果要将对象存储在数据库中,可以使用相同的模型将其转换为JSON。

class User {

int id;

String name;

User({

this.id,

this.name,

});

factory User.fromJson(Map<String, dynamic> json) => new User(

id: json[‘id’],

name: json[‘name’],

);

Map<String, dynamic> toJson() => {

‘id’: id,

‘name’: name,

};

}

如果没有将其显示给用户的方法,这些数据就不是那么有用了。这就是Flutter带着诸如FutureBuilder或StreamBuilder这样的小部件登场的时候了。如果您对使用Flutter,SQLite和其他技术来创建数据驱动型App有兴趣做更深一步的了解,我建议你查看这方面的文章:

六、最后的一些思考

=====================================================================

有了Flutter,就有了几乎无穷无尽的可能性,因此即使是体量巨大的App也可以轻松地被创建出来。如果你是做移动App开发的并且尚未尝试过Flutter,我强烈建议你试一下,因为我相信你也会爱上它的。使用Flutter几个月之后,我认为可以说这是移动开发的未来。如果不能算未来的话,这也绝对是朝着正确方向迈出去的一步。

最最最后

================================================================

总结

写到这里也结束了,在文章最后放上一个小小的福利,以下为小编自己在学习过程中整理出的一个关于Flutter的学习思路及方向,从事互联网开发,最主要的是要学好技术,而学习技术是一条慢长而艰苦的道路,不能靠一时激情,也不是熬几天几夜就能学好的,必须养成平时努力学习的习惯,更加需要准确的学习方向达到有效的学习效果。
由于内容较多就只放上一个大概的大纲,需要更及详细的学习思维导图的
还有高级UI、性能优化、架构师课程、NDK、混合式开发(ReactNative+Weex)微信小程序、Flutter全方面的Android进阶实践技术资料,并且还有技术大牛一起讨论交流解决问题。

跨平台开发:Flutter.png
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》点击传送门,即可获取!
习过程中整理出的一个关于Flutter的学习思路及方向,从事互联网开发,最主要的是要学好技术,而学习技术是一条慢长而艰苦的道路,不能靠一时激情,也不是熬几天几夜就能学好的,必须养成平时努力学习的习惯,更加需要准确的学习方向达到有效的学习效果。
由于内容较多就只放上一个大概的大纲,需要更及详细的学习思维导图的
还有高级UI、性能优化、架构师课程、NDK、混合式开发(ReactNative+Weex)微信小程序、Flutter全方面的Android进阶实践技术资料,并且还有技术大牛一起讨论交流解决问题。**

[外链图片转存中…(img-ppFIz61N-1715116988938)]
《Android学习笔记总结+移动架构视频+大厂面试真题+项目实战源码》点击传送门,即可获取!

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值