Flutter实例大全

在Flutter中一切Widget，Flutter中的Widget的概念更广，它不仅可以表示UI元素，也可以表示一些功能性的组件如：用于手势检测的 GestureDetector widget、用于APP主题数据传递的Theme等等，在后面的内容中，我们在描述UI元素时可能会用到“控件”、“组件”这样的概念，需要知道他们就是widget，只是不同表述而已。

1 Flutter组件分类

Flutter可以根据状态分类，也功能职责和属性分类，我们这里根据功能职责和属性分类。主要包括：基础组件布局类组件容器类组件功能型组件可滚动组件装饰类组件

2 基础类组件

如上，基础组件包括文本组件、按钮组件、图片组件、选择组件、输入框、表单、进度条等。在接下来的章节会依次详细介绍。这些都是最基础的widget，负杂的widget也都基本包含这类组件，所以必须学会此类组件。

3 基础组件的使用

Flutter提供了丰富、强大的基础组件，在基础组件库之上Flutter又提供了一套Material风格（Android默认的视觉风格）和一套Cupertino风格（iOS视觉风格）的组件库。要使用基础组件库，需要先导入：

import 'package:flutter/widgets.dart';

之后，就可以对基础组件进行使用和编辑了。

• Material组件

Material应用程序以MaterialApp 组件开始， 该组件在应用程序的根部创建了一些必要的组件，比如Theme组件，它用于配置应用的主题。 使用Material组件，需要引入：

 import 'package:flutter/material.dart';

• Cupertino组件

Cupertino风格的组件主要是为了IOS适配而提供的。使用同样需要引入

 import 'package:flutter/cupertino.dart';

注意：由于Material和Cupertino都是在基础组件库之上的，所以如果我们的应用中引入了这两者之一，则不需要再引入flutter/widgets.dart了，因为它们内部已经引入过了。