前言 Flutter中,可以通过Image组件来加载并显示图片,Image的数据源可以是asset.文件.内存以及网络. ImageProvider 是一个抽象类,主要定义了图片数据获取的接口load(),从不同的数据源获取图片需要实现不同的ImageProvider ,如AssetImage是实现了从Asset中加载图片的ImageProvider,而NetworkImage实现了从网络加载图片的ImageProvider. Image widget有一个必选的image参数,它对应一个Ima…

前言 Material组件库中提供了多种按钮组件如RaisedButton.FlatButton.OutlineButton等,它们都是直接或间接对RawMaterialButton组件的包装定制,所以他们大多数属性都和RawMaterialButton一样. 有Material 库中的按钮都有如下相同点: 按下时都会有"水波动画"(又称"涟漪动画",就是点击时按钮上会出现水波荡漾的动画). 有一个onPressed属性来设置点击回调,当按钮按下时会执行该回调,如果…

TextWidget class TextWidget extends StatelessWidget { final TextStyle _textStyle = TextStyle( fontSize: 16.0, ); final String _auther = '李白'; final String _title = '将进酒'; @override Widget build(BuildContext context) { return Text( // 插值写法$_value '<$_…

前言 Material 组件库中提供了两种进度指示器:LinearProgressIndicator和CircularProgressIndicator,它们都可以同时用于精确的进度指示和模糊的进度指示.精确进度通常用于任务进度可以计算和预估的情况,比如文件下载:而模糊进度则用户任务进度无法准确获得的情况,如下拉刷新,数据提交等. 接口描述 // LinearProgressIndicator是一个线性.条状的进度条 const LinearProgressIndicator({ Key key…

前言 Material组件库中提供了输入框组件TextField和表单组件Form. 输入框TextField 接口描述 const TextField({ Key key, // 编辑框的控制器,通过它可以设置/获取编辑框的内容.选择编辑内容.监听编辑文本改变事件.大多数情况下我们都需要显式提供一个controller来与文本框交互.如果没有提供controller,则TextField内部会自动创建一个. this.controller, // 用于控制TextField是否占有当前键盘的输…

前言 Material组件库中提供了Material风格的单选开关Switch和复选框Checkbox,虽然它们都是继承自StatefulWidget,但它们本身不会保存当前选中状态,选中状态都是由父组件来管理的.当Switch或Checkbox被点击时,会触发它们的onChanged回调,可以在此回调中处理选中状态改变逻辑. 实例 // 单选框和复选框 import 'package:flutter/material.dart'; class SwitchCheckboxRoute exten…

// 文本.字体样式 import 'package:flutter/material.dart'; class TextFontStyle extends StatelessWidget { // 声明文本样式 TextStyle textStyle = const TextStyle(fontFamily: 'MyFont', fontSize: 30, ); @override Widget build(BuildContext context) { return Scaffold( ap…

前言 一个永恒的主题,"状态(State)管理",无论是在React/Vue(两者都是支持响应式编程的Web开发框架)还是Flutter中,他们讨论的问题和解决的思想都是一致的. 一个问题,StatefulWidget的状态应该被谁管理?Widget本身?父Widget?都会?还是另一个对象?答案是取决于实际情况!以下是管理状态的最常见的方法: Widget管理自己的状态. Widget管理子Widget状态. 混合管理(父Widget和子Widget都管理状态). 如何决定使用哪种管…

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

老孟导读:大家好,这是[Flutter实战]系列文章的第三篇,这一篇讲解图片组件,Image有很多高级用法,希望对您有所帮助. 图片组件是Flutter基础组件之一,和文本组件一样必不可少.图片组件包含Image和Icon两个组件,本质上Icon不属于图片组件,但其外形效果上类似于图片. 在项目中建议优先使用Icon组件,Icon本质上是一种字体,只不过显示的不是文字,而是图标,而Image组件先通过图片解码器将图片解码,所以Icon有如下优点: 通常情况下,图标比图片体积更小,显著的减少App…