Flutter（8）：基础组件之Icon

Flutter教学目录持续更新中

github源代码持续更新中

1.Icon介绍

Flutter 的图标类，它有几个衍生的组件：ImageIcon、IconButton 等。
Icon还可以架加载iconfont（字体图标），这种方式 和图片相比有如下优势：

• 体积小：可以减小安装包大小。
• 矢量的：iconfont 都是矢量图标，放大不会影响其清晰度。
• 可以应用文本样式：可以像文本一样改变字体图标的颜色、大小对齐等。
• 可以通过 TextSpan 和文本混用。
  因为现在是基本讲解，所哟这里先了解一下有这个功能，具体使用后期会有详细讲解，目前先讲解基本使用方法

2.具体使用

使用方法比较简单

1600586543(1).png

Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Icon(
                Icons.favorite,
                color: Colors.blue,
                size: 24,
              ),
              Icon(
                Icons.audiotrack,
                color: Colors.red,
                size: 24,
              ),
              Icon(
                Icons.people,
                color: Colors.yellow,
                size: 24,
              ),
              IconButton(
                icon: Icon(
                  Icons.favorite,
                  color: Colors.red,
                  size: 24,
                ),
                onPressed: () {
                  ToastUtil.showToast('onPressed');
                },
              ),
            ],
          )

为了照顾新手小伙伴，基础讲解里面不会设计比较复杂的东西，后面的深入讲解中再对各方面最深入解析
下一节基础组件之Button

Flutter（9）：基础组件之Button

Flutter教学目录持续更新中

github源代码持续更新中