Flutter和SwiftUI比较
0.语言
- SwiftUI 毫无疑问是Swift语言编写,
-
- 在2019年正式推出,目前最新是Swift 5.9 (2023年9月),由Apple公司维护和发行;
-
- 该编程语言发明人已离职Apple。
-
- 语言官网:https://developer.apple.com/swift/ 最好用Xcode编写代码
- Flutter 一直使用Dart语言编写,
-
- 在2017年正式推出,目前最新版本是Flutter v3.13, Dart v3.1 (2023年8月),由Google公司维护和发行;
-
- 该编程语言发明人已离职Google。
-
- 官网:https://flutter.dev/ 可使用vscode编写代码
1.页面布局
- SwiftUI使用view为基础,以声明式(declarative syntax)语法布局用户界面;
-
View
,视图可以现实文字,图片,图标,音频等等
-
HStack
,水平方向布局,相当于excel表格里的行(row)
-
VStack
,垂直方向布局,相当于excel表格里的列(column)
-
ZStack
,Z轴布局,可以图层叠加
-
Grid
和GridRow
格子布局
-
List
列表布局
-
ScrollView
,页面可以滚动
-
animation()
,控件后面使用.
修饰符,传入参数动画样式
- Flutter使用widget为基础,以声明式(declarative syntax)语法布局用户界面,分为StatelessWidget和StatefulWidget
-
Widget
, 相当于视图,可以包括显示文字,图片,图标,音频等等
-
Row
,水平方向布局,相当于excel表格里的行(row)
-
Column
,垂直方向布局,相当于excel表格里的列(column)
-
Stack
Z轴布局,可以视图叠加
-
GridView
格子布局
-
ListView
列表布局
-
SingleChildScrollView
,页面可以滚动
-
Animation
,控件嵌套包裹住希望的控件,然后传入参数动画样式
2.数据绑定
- SwiftUI使用声明式属性修饰符
@State
绑定数据,一旦状态发生变化,则会重新计算一个视图界面里的首要body
属性 - Flutter,若界面不依赖数据更新,则使用
StatelessWidget
,如界面需要更新数据,则界面使用StatefulWidget
3.系统API调用
例如系统的摄像机、麦克风、GPS、陀螺仪,等等
- SwiftUI直接使用,因为SwiftUI是基于iOS操作系统已存在的布局体系上建立;
- Flutter使用plugin来调用,如果plugin没有,则可以自己通过原生代码封装;
4.编译和性能
- SwiftUI,开发和生成期间编译都是
AOT (Ahead-of-Time)
,编译时会将高级的Swift代码转换成低级的机器码,并对iPhone,iPad,MacOS做了深度优化;开发期间支持view在Xcode即可预览效果。 - Flutter,开发期间编译使用
JIT (Just-In-Time)
,支持hot-reload;部署生产期间使用AOT (Ahead-of-Time)
,为了对iOS和Android更高的ARM code优化。
5.渲染引擎
- SwiftUI,是Apple的原生布局框架,高效的集成了Apple的硬件性能和简单易用的API。
- Flutter,使用Skia引擎(Skia是一个开源的2D图形库,由C++编写),这是跨平台的,因此和某个具体平台无关,渲染时需要提交到硬件加速,可以开发丰富的和可交互式的UI。
引用
1.Flutter官方分析区别,Flutter和SwiftUI:https://docs.flutter.dev/get-started/flutter-for/swiftui-devs?tab=swiftui