Flutter上手篇

Flutter 的起源

Flutter 的诞生其实比较有意思,Flutter 诞生于 Chrome 团队的一场内部实验, 谷歌的前端团队在把前端一些"乱七八糟"的规范去掉后,发现在基准测试里性能居然提高了 20 倍,机缘巧合下 Flutter 就这么被立项。

Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面。 Flutter可以与现有的代码一起工作。在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费、开源的。

Flutter特性:

1.快速开发

Flutter的热重载可帮助您快速地进行测试、构建UI、添加功能并更快地修复错误。通过将更新的源代码文件注入正在运行的Dart VM(虚拟机)中工作。这不仅包括添加新类,还包括向现有类添加方法和字段,以及更改现有函数。在iOS和Android模拟器或真机上可以在亚秒内重载,并且不会丢失状态。

2.富有表现力,漂亮的用户界面

使用Flutter内置美丽的Material Design和Cupertino(iOS风格)widget、丰富的motion API、平滑而自然的滑动效果和平台感知,为您的用户带来全新体验。

3.访问本地功能和SDK

通过平台相关的API、第三方SDK和原生代码让您的应用变得强大易用。 Flutter允许您复用现有的Java、Swift或ObjC代码,访问iOS和Android上的原生系统功能和系统SDK。可以使用Flutter作为视图(View)层, 并可以使用已经用Java / ObjC / Swift完成的部分(Flutter支持混合开发)。

Flutter为什么能跨平台且高效

首先,Flutter 自建了一个绘制引擎,底层是由 C++ 编写的引擎,负责渲染,文本处理,Dart VM 等;上层的 Dart Framework 直接调用引擎。避免了以往 JS 解决方案的 JS Bridge、线程跳跃等问题。第二,引擎基于 Skia 绘制,操作 OpenGL、GPU,不需要依赖原生的组件渲染框架。第三,Dart 的引入,是 Flutter 团队做了很多思考后的决定,Dart 有 AOT 和 JIT 两种模式,线上使用时以 AOT 的方式编译成机器代码,保证了线上运行时的效率;而在开发期,Dart 代码以 JIT 的方式运行,支持代码的即时生效(HotReload),提高开发效率。第四,Flutter 的页面和布局是基于 Widget 树的方式,看似不习惯,但这种树状结构解析简单,布局、绘制都可以单次遍历完成计算,而原生布局往往要往复多次计算,"simple is fast"的设计效果。

Flutter架构

Flutter具有三个主要组成部分:

  • 框架层:Flutter框架建立在Dart语言的基础上,在Flutter中一切UI皆Widget,Flutter有两大不同风格的Widget库,一个是基于Material Design(材料设计)风格的组件库;一个是基于cupertino的iOS设计风格的组件库;
  • 引擎层:Flutter引擎使用的是基于C++的2D图形库(称为Skia)。 在这一层中,提供了Dart VM,以提供一个执行环境,用于将Dart代码转换为本地平台可执行代码。 Flutter引擎在Android,iOS中运行,以为widget呈现对应的外观,并根据特定平台通过Channel进行通信;
  • 平台层:Flutter根据不同平台提供了其特定的shell(即Android Shell和iOS Shell),这些shell用来托管Dart VM,以提供对特定的平台API的访问;
Mac环境配置

1.到官网下载Flutter SDK: docs.flutter.dev/get-started... 下载完成解压放到项目常用目录就好。

2.手动在项目中配置Flutter sdk路径和Dart sdk路径:

3.在Android studio中安装Flutter和dart插件。

4.创建Flutter项目:

👀关注公众号:Android老皮!!!欢迎大家来找我探讨交流👀

相关推荐
Mr数据杨5 小时前
【Codex】用学生入学评估模块建立新生能力画像
android·java·javascript·django·codex·项目开发
●VON5 小时前
谁小时候不想要一个游戏修改器?我把电脑 Skill 做成了 Android 小助手
android·游戏·电脑
加农炮手Jinx5 小时前
Flutter for OpenHarmony 实战:flutter_animate 声明式动画让 UI 灵动如原生
flutter·ui·华为·harmonyos·鸿蒙
里欧跑得慢5 小时前
Flutter 像素级还原:设计稿到代码的视觉无损转换技巧
前端·css·flutter·web
刃神太酷啦5 小时前
Linux 系统 MySQL 完整安装配置教程:从卸载 MariaDB 到优化 my.cnf----《Hello MySQL!》(1)
android·linux·c语言·c++·mysql·leetcode·mariadb
里欧跑得慢5 小时前
Flutter 三方库 function_tree — 鸿蒙应用开发中的动态数学公式解析与计算神器,实现鸿蒙深度适配下的复杂函数逻辑运行时求值实战(适配鸿蒙 HarmonyOS Next ohos)
android·前端·安全·flutter·华为·harmonyos
IT毕设实战小研6 小时前
基于安卓的空气质量查询系统
android·大数据·vue.js·爬虫·python·django·课程设计
雨声不在8 小时前
docker-android Android 16 支持与编译修改
android
天空之城--13 小时前
【无标题】
android
mmsx14 小时前
osmdroid 接入谷歌影像底图:瓦片 URL 拼接与多域名轮询实战
android·osmdroid