Flutter 学习之路 Icon图标组件

一、Flutter 图标组件（Icon）介绍

    图标组件（Icon）为展示图标的组件，该组件不可交互，要实现可交互的图标，可以使用(IconButton)组件

    Flutter 提供很多（Icon）让大家使用

    可以参考网址： https://material.io/resources/icons/?icon=account_balance&style=baseline

    https://www.fluttericon.com/

二、构造中属性说明

const Icon(
    this.icon, {
    Key key,
    this.size,  // 大小
    this.color, // 颜色   
    this.semanticLabel,
    this.textDirection, //Icon组件里也可以添加文本内容,有些文本书写的方向是从左到右 Text-Direction.ltr / 反rtl
  }) : super(key: key);

三、代码演示

import 'package:flutter/material.dart';

class IconPage extends StatefulWidget {
  IconPage({Key key}) : super(key: key);

  @override
  _IconPageState createState() => _IconPageState();
}

class _IconPageState extends State {
  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text("56zhiyi.com Icon组件"),
      ),
      body: Container(
        child: Icon(
          Icons.phone,
          textDirection: TextDirection.ltr, // icon
          color: Colors.red,
          size: 100.0,
        ),
      ),
    );
  }
}

四、效果图