老孟导读:Flutter中有这么一类组件,用于定位.装饰.控制子组件,比如 Container (定位.装饰).Expanded (扩展).SizedBox (固定尺寸).AspectRatio (宽高比).FractionallySizedBox (占父组件比例).这些组件的使用频率非常高,下面一一介绍,最后给出项目中实际案例熟悉其用法. [Flutter实战]系列文章地址:http://laomengit.com/guide/introduction/mobile_system.html C…
老孟导读:Flutter中布局组件有水平 / 垂直布局组件( Row 和 Column ).叠加布局组件( Stack 和 IndexedStack ).流式布局组件( Wrap )和 自定义布局组件(Flow). 水平.垂直布局组件 Row 是将子组件以水平方式布局的组件, Column 是将子组件以垂直方式布局的组件.项目中 90% 的页面布局都可以通过 Row 和 Column 来实现. 将3个组件水平排列: Row( children: <Widget>[ Container( hei…
老孟导读:大家好,这是[Flutter实战]系列文章的第二篇,这一篇讲解文本组件,文本组件包括文本展示组件(Text和RichText)和文本输入组件(TextField),基础用法和五个案例助你快速掌握. 第一篇链接:[Flutter实战]移动技术发展史 Text Text是显示文本的组件,最常用的组件,没有之一.基本用法如下: Text('老孟') 注意:Text组件一定要包裹在Scaffold组件下,否则效果如下: 文本的样式在style中设置,类型为TextStyle,TextStyle…
老孟导读:大家好,这是[Flutter实战]系列文章的第三篇,这一篇讲解图片组件,Image有很多高级用法,希望对您有所帮助. 图片组件是Flutter基础组件之一,和文本组件一样必不可少.图片组件包含Image和Icon两个组件,本质上Icon不属于图片组件,但其外形效果上类似于图片. 在项目中建议优先使用Icon组件,Icon本质上是一种字体,只不过显示的不是文字,而是图标,而Image组件先通过图片解码器将图片解码,所以Icon有如下优点: 通常情况下,图标比图片体积更小,显著的减少App…
老孟导读:此篇文章是 Flutter 动画系列文章第三篇,后续还有动画序列.过度动画.转场动画.自定义动画等. Flutter 系统提供了20多个动画组件,只要你把前面[动画核心](文末有链接)的文章看明白了,这些组件对你来说是非常轻松的,这些组件大部分都是对常用操作的封装. 显示动画组件 回顾上一篇[动画核心]的文章中创建动画三个必须的步骤: 创建 AnimationController. 监听 AnimationController,调用 setState 刷新UI. 释放 Animatio…
老孟导读:Flutter 1.20 更新了 Slider.RangeSlider.日期选择器组件.时间选择器组件的样式,新增了交换组件:InteractiveViewer,下面详细介绍其用法. 滑块 Flutter 1.20 版本将 Slider 和 RangeSlider 小部件更新为最新的 Material 准则.新的滑块在设计时考虑到了更好的可访问性:轨道更高,滑块带有阴影,并且值指示器具有新的形状和改进的文本缩放支持. Slider 基础用法: class SliderDemo exte…
<Flutter实战>开源电子书 <Flutter实战> 开源了,本书为 Flutter中文网开源电子书项目,本书系统介绍了Flutter技术的各个方面,本书属于原创书籍(并非翻译),希望对大家有帮助: 在线阅读地址:book.flutterchina.club <Flutter实战> github: github.com/flutterchin… <Flutter实战>目录 缘起 起步 移动开发技术简介 Flutter简介 搭建Flutter开发环境 Da…
Flutter核心理念 flutter组件采用函数式响应框架构建,它的灵感来自于React.它设计的核心思想是组件外构建UI,简单解释一下就是组件鉴于它当前的配置和状态来描述它的视图应该是怎样的,当组件的状态发生改变,组件会重构它的配置和状态(这些配置和状态是在组件外部重构的,内部的配置和状态都不可变的).然后底层框架会将最新的配置和状态与先前的做对比,由此产生一个最小的差值,并由此差值来决定底层渲染树从旧状态过度到新状态. Hello World 首先我们先来写一个最基本的flutter应用吧…
02.Flutter实战建立项目和编写入口文件 创建项目: flutter create flutter_shop 创建完成之后呢,它会提示我们, 进入flutter_shop的目录,然后执行flutter run来运行项目 为什么起名flutter_shop用下划线的形式呢?因为在windows下不支持小驼峰和大驼峰的命名方式,官方推荐我们使用下划线的形式 做项目的时候,外层都套一个Container组件呢,这样会使你以后扩展会变的很容易 开始写入口文件main.dart 新建文件夹Pages…
老孟导读:大家好,这是[Flutter实战]系列文章的第一篇,这并不是一篇Flutter技术文章,而是介绍智能手机操作系统.跨平台技术的演进以及我对各种跨平台技术看法的文章. 智能手机操作系统 塞班(Symbian)系统 后浪们可能都没有听说过塞班系统,而很多前浪们也会诧异,塞班是智能手机操作系统吗?让我们先来看下智能手机的定义: 智能手机,是指像个人电脑一样,具有独立的操作系统,独立的运行空间,可以由用户自行安装软件.游戏.导航等第三方服务商提供的程序,并可以通过移动通讯网络来实现无线网络接入…