快速生成对象 List.generate(20, (i){ return Text("$i"); }), 快速生成Widget ListView.builder( itemCount: products.length, itemBuilder: (context,index){ return ListTile( title: Text(products[index].title), ); }, ); 通过数据map动态创建Widget List datas = ['','','',''

引言 在之间我已经介绍了关于Flutter的下载安装以及配置,还有开发工具Android Studio的配置,还不知道的同学可以看看我这篇博客--谷歌移动UI框架Flutter入门.这里为什么非要用Android Studio,我可以解释一下.Android Studio是Google的亲儿子,由谷歌一手开发,而Flutter也是谷歌推出的技术,所以在支持和兼容问题上,Android Studio是非常有优势的.老话说得好,肥水不流外人田,谷歌内部肯定是将Android Studio对Flutt

一.Text 组件 属性  textAlign: TextAlign.left,                           -----文本对齐方式  maxLines: 1,                                            -----显示最大行  overflow: TextOverflow.clip,                 -----文本溢出的处理方式 clip:直接切断溢出的文字. ellipsis:在后边显示省略号(...)  常用

一.水平布局Row Row控件可以分为非灵活排列和灵活排列两种,灵活的可以在外边加入Expanded使用 两者混用: import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { // TODO: implement build return Ma

Error states that TextField widgets require a Material widget ancestor. Simply wrapping your whole loginWidget into Scaffold will solve the problem. Widget LoginPage() { return new Scaffold(body: *your whole code*) }

Let's say you set widget height to 200, but to different screen, there might not be enough space for the widget to display, in this case, you can use Flexible widget: Flexible( child: Hero( tag: 'flash', child: Container( height: 200.0, child: Image.

本篇文章我们来讲讲一些比较常用的 Widget. 大家验证的时候使用下面的代码替换 main.dart 代码,然后在 //TODO 语句返回下面常用 Widget 示例的代码. import 'package:flutter/material.dart'; void main() => runApp(MyApp()); class MyApp extends StatelessWidget { @override Widget build(BuildContext context) { retu

如需转载,请注明出处:Flutter学习笔记(9)--组件Widget 在Flutter中,所有的显示都是Widget,Widget是一切的基础,我们可以通过修改数据,再用setState设置数据(调用setState()来通知框架,框架会再次调用State的构建方法来更新用户界面),Flutter会自动通过绑定的数据更新Widget,所以你需要做的就是实现Widget界面,并且和数据绑定起来. Widget分为有状态StatefulWidget和无状态StatelessWidget两种,在Fl

概念 在Flutter中几乎所有的对象都是一个Widget.与原生开发中"控件"不同的是,Flutter中的Widget的概念更广泛,它不仅可以表示UI元素,也可以表示一些功能性的组件如:用于手势检测的 GestureDetector widget.用于APP主题数据传递的Theme等等,而原生开发中的控件通常只是指UI元素. Widget与Element 在Flutter中,Widget的功能是"描述一个UI元素的配置数据",它就是说,Widget其实并不是表示最

一.Flutter 的声明式视图开发 在原生系统(Android.iOS)或原生JavaScript 开发的话,应该知道视图开发是命令式的,需要精确地告诉操作系统或浏览器用何种方式去做事情. 比如,如果我们想要变更界面的某个文案,则需要找到具体的文本控件并调用它的控件方法命令,才能完成文字变更.   // Android 设置某文本控件展示文案为 Hello World TextView textView = (TextView) findViewById(R.id.txt); textView

本文主要介绍Flutter布局中的FittedBox.AspectRatio.ConstrainedBox,详细介绍了其布局行为以及使用场景,并对源码进行了分析. 1. FittedBox Scales and positions its child within itself according to fit. 1.1 简介 按照其官方的介绍,它主要做了两件事情,缩放(Scale)以及位置调整(Position). FittedBox会在自己的尺寸范围内缩放并且调整child位置,使得chil

1. Flutter 是什么? Flutter是谷歌的移动UI框架,可以快速在iOS和Android上构建高质量的原生用户界面. Flutter可以与现有的代码一起工作.在全世界,Flutter正在被越来越多的开发者和组织使用,并且Flutter是完全免费.开源的. 2. Flutter 特性有哪些? 快速开发(毫秒级热重载) 绚丽UI(内建漂亮的质感设计Material Design和Cupertino Widget和丰富平滑的动画效果和平台感知) 响应式(Reactive,用强大而灵活的AP

Flutter 2.2 版已正式发布!要获取新版本,您只需切换到 stable 渠道并更新目前安装的 Flutter,或前往 flutter.cn/docs/get-started 从头开始安装. 虽然与 2.0 版只相隔数月,2.2 版还是满载大量改进.此版本共计纳入了框架.引擎和插件库等方面的 2,456 个 PR 并解决了 3,105 个问题.我们要特此鸣谢为此版本贡献了大量 PR 和 PR review 的整个 Flutter 社区,包括 PR 贡献最多 (17) 的 Abhishek0

Flutter 的起源 Flutter 的诞生其实比较有意思,Flutter 诞生于 Chrome 团队的一场内部实验, 谷歌的前端团队在把前端一些"乱七八糟"的规范去掉后,发现在基准测试里性能居然提高了 20 倍,机缘巧合下 Flutter 就这么被立项. 所以 Flutter 是基于前端诞生,同时基于它的诞生缘由,可以看到 Flutter 本身就不会有特别多的语法糖,作为框架它比较"保守",选择的 Dart 语言也是保守型的语言.而它的编程模式,语法都带有浓厚的

稳住,今天是周末,不过我今天要上班....啊..啊... 对于 Flutter 我没有太多的发言权,不过GSY是对 Flutter 充分理解并精深掌握的前辈了,所以转一篇他对 Flutter 的一些解答文给大家,如果你有相似的疑问,希望对你有用. 回顾了这段时间解答关于 Flutter 的各种问题后,我突然发现很多刚刚接触 Flutter 的萌新,对于 Flutter 都有着不同程度的误解,而每次重复的解释又十分浪费时间,最终我还是决定写篇文章来做个总结. 内容有点长,但是相信能帮你更好地去认识

文/ 杨加康,CFUG 社区成员,<Flutter 开发之旅从南到北>作者,小米工程师 在围绕设计模式的话题中,工厂这个词频繁出现,从 简单工厂 模式到 工厂方法 模式,再到 抽象工厂 模式.工厂名称含义是制造产品的工业场所,应用在面向对象中,顺理成章的成为了比较典型的创建型模式. 从形式上讲,工厂可以是一个返回我们想要对象的一个方法/函数,即可以作为构造函数的一种抽象. 本文,就带大家使用 Dart 理解它们的各自的实现,以及它们之间的关系. 简单工厂 & factory 关键字 简

一直以来,跨平台开发都是困扰移动客户端开发的难题. 在马蜂窝旅游 App 很多业务场景里,我们尝试过一些主流的跨平台开发解决方案, 比如 WebView 和 React Native,来提升开发效率和用户体验.但这两种方式也带来了新的问题. 比如使用 WebView 跨平台方式,优点确实非常明显.基于 WebView 的框架集成了当下 Web 开发的诸多优势:丰富的控件库.动态化.良好的技术社区.测试自动化等等.但是缺点也同样明显:渲染效率和 JavaScript 的执行能力都比较差,使页面的加

前面三篇可以算是一个小小的里程碑. 主要是介绍了 Flutter 环境的搭建.如何创建 Flutter 项目以及如何在旧有 Android 项目引入 Flutter. 这一篇我们来学习下 Flutter 的 UI. 前言 说到 UI,我就简单说下 Flutter 作为一门跨平台语言具有的优势之一,提高效率吧. 举个例子: 假设现在要开发一个界面,Android 开发需要一天,iOS 开发也需要一天.那么就是两天. 如果你用 Flutter 开发,就只需要一天(因为 Android 和 iOS 都

背景 在端上为了提升App的灵活性, 快速解决万变的业务需求,开发者们探索了多种解决方案,如PhoneGap ,React Native ,Weex等,但在Flutter生态还没有好的解决方案.未来闲鱼都会基于Flutter 来跨端开发,如果突破发版周期,在不发版的情况下,完成业务需求,同时能兼容性能体验,无疑是更快的响应了业务需求.因此我们需要探索在Flutter生态下的动态化. 方案选择 借鉴Android 和Ios上的动态性方案,我们也思考了多种Flutter动态性方案. 1.下载替换Fl

作为忠实与较资深的Android汪, 最近抽出了一些时间研究了一下Google的亲儿子Flutter, 尚属皮毛, 只能算是个简单的记录吧. Google自2017年第一次提出Flutter, 到2018年Beta, 再加之RN的各种风波与问题, 使得Flutter的热度不断上升, 国内不少公司都公布Flutter在其产品中的应用, 如美团, 闲鱼等. 前言 Flutter作为跨平台框架, 常常被人拿出来与React Native, 以及Xamarin进行对比, 除了大家都是跨平台框架之外且能达