写点什么

谷歌的跨平台移动 UI 框架 Flutter 开始 Beta 测试

  • 2018-03-12
  • 本文字数:1120 字

    阅读完需:约 4 分钟

看新闻很累?看技术新闻更累?试试下载 InfoQ 手机客户端,每天上下班路上听新闻,有趣还有料!

Flutter 现在开始Beta 测试。谷歌创建这个框架是希望为iOS 和Anroid 应用提供跨平台的界面,虽然不是标准的,但看上像原生的。

React Native 类似,Flutter 支持反应式风格的 UI 定义方法。它与其他跨平台 Web 视图框架的区别是,它基于 Dart ,这样就不需要 JavaScript 来连接 UI 和 OS 平台提供的原生服务,如位置服务、传感器访问、相机等等。借助提前编译成原生代码的 Dart,Flutter 节省了使用 JavaScript 桥接时的上下文切换开销。

旨在提供原生 UI 外观的跨平台框架使用原生实现的小部件来描绘按钮、表格等。通常,这还需要 App 的不同部分使用 JavaScript 桥接来通信,导致速度变慢。为了避免这个问题,Flutter 提供了自己的小部件集合,直接在 OS 平台提供的画布上描绘这类控件。这种方法的另外一个好处和 Dart 的 UI 布局机制有关。 Android Layouts iOS Constraints 都旨在提供抽象概念描述在屏幕上布局 UI 元素的任何可能的方法,和这些 CSS 盒子模型不同,每个 Flutter 小部件都有自己的简单布局模型。具体来讲,如果要让一个小部件居中,则可以把它放到一个Center小部件里。类似地,如果要在其四周留有边距,则可以把它放在一个Padding小部件里。下面是一个简单的例子,一个 Center 小部件中包含一个文本和一个图标,两者垂直排列:

复制代码
new Center(
child: new Column(
children: [
new Text('Hello, World!')),
new Icon(Icons.star, color: Colors.green)
]
)
)

在 Flutter 中,所有的主题和导航都表示为小部件,因此,你可以改变 UI 的外观或者使用不同的父部件浏览不同视图的方式。

从 Flutter 进入 Alpha 阶段开始,谷歌就一直致力于更好的工具集成、Android Studio 和 Visual Studio Code 支持、更好的平台互操作性、更好的热重载以及一个针对部件树的部件查看器

由于Flutter 使用了Dart,所以可以促进其应用的一个关键因素是,可用的第三方程序包让开发人员可以重用代码,而不必什么东西都从头开始编码。这包括类似发送网络请求、导航处理这样的东西,以及使用Firebase、SQLite、Facebook Connect 等外部SDK。感兴趣的读者可以查看Flutter 上可用的程序包目录,其中包括1000 多个程序包,看看其中是否包含自己需要的一切。

谷歌表示,在向1.0 迈进的过程中,他们的重点是稳定性和支持更多的场景,例如,让Flutter 更容易嵌入到已有的App 中使用内联WebViews ,等等。

如果想试用Flutter beta,只要按照安装说明来操作即可。此外,务必看一眼 Flutter Gallery Posse Gallery 这些有用的链接

查看英文原文 Google’s Cross-Platform Mobile UI Framework Flutter Now in Beta

2018-03-12 19:002475
用户头像

发布了 1008 篇内容, 共 422.1 次阅读, 收获喜欢 346 次。

关注

评论

发布
暂无评论
发现更多内容

架构师入门感悟之十

笑春风

毕业三年,如何达到月薪30K?我想跟你聊聊!!

冰河

程序员 程序人生 架构师 升职加薪 提升自我

Mybatis【7】-- Mybatis如何知道增删改是否成功执行?

秦怀杂货店

Java mybatis

附PPT丨如何构建数据库容器化PaaS

dbaplus社群

数据库 容器

explicit_defaults_for_timestamp 参数详解

Simon

MySQL 七日更

设计模式【1.2】-- 枚举式单例有那么好用么?

秦怀杂货店

设计模式

设计模式【1.3】-- 为什么饿汉式单例是线程安全的?

秦怀杂货店

单例模式

星环科技助力商业银行机器学习平台建设

星环科技

FinTech

开一个世界末日的脑洞

熊斌

我的世界 生活记录 七日更

设计模式【1】-- 单例模式到底几种写法?

秦怀杂货店

设计模式

架构师训练营第 10 周学习总结

菜青虫

极客大学架构师训练营

设计模式【2】-- 简单工厂模式了解一下?

秦怀杂货店

设计模式 工厂模式 工厂方法模式

Angel推荐算法在游戏推荐中的应用

DataFunTalk

学习

Android开发全套学习!不同层级的Android开发者的不同行为,学习路线+知识点梳理

欢喜学安卓

android 程序员 面试 移动开发

爱奇艺用户分析平台实践:TB级数据查询秒级返回

dbaplus社群

大数据

设计模式【1.1】-- 你想如何破坏单例模式?

秦怀杂货店

设计模式 单例 23种设计模式

shark defi鲨鱼智能合约系统软件APP开发

系统开发

《爱奇艺安全应急响应中心漏洞评分标准2021》来了

爱奇艺技术产品团队

安全 安全漏洞

Github标星5.3K,网易云的朋友给我这份339页的Android面经,附赠课程+题库

欢喜学安卓

android 程序员 面试 移动开发

架构师训练营第五周课后作业

万有引力

Mybatis【8】-- Mybatis返回List或者Map以及模糊查询怎么搞?

秦怀杂货店

Java mybatis

花火交易所软件开发|花火交易所系统APP开发

系统开发

WLAN网络规划和优化的必备知识点

LeetCode题解:42. 接雨水,双指针,JavaScript,详细注释

Lee Chen

算法 大前端 LeetCode

领域驱动设计DDD

积极&丧

架构师训练营第 10 周课后练习

菜青虫

极客大学架构师训练营

安卓开发快速学习!一个小例子彻底搞懂Android的MVP模式到底是什么?面试必问

欢喜学安卓

android 程序员 面试 移动开发

Lambda【1】-- List相关Lambda表达式使用(上篇)

秦怀杂货店

Java Lambda

Mybatis【10】-- Mybatis属性名和查询字段名不同怎么做?

秦怀杂货店

mybatis

记一次由Arthas引起的Metaspace OOM问题

闲鱼技术

Java 阿里巴巴

Mybatis【9】-- Mybatis占位符#{}和拼接符${}有什么区别?

秦怀杂货店

mybatis 预编译

谷歌的跨平台移动UI框架Flutter开始Beta测试_开源_Sergio De Simone_InfoQ精选文章