图标按钮

本课属于 Coddy Flutter 学习旅程的“让应用具有交互性”单元。第 4 课，共 34 课。

有些按钮只有一个图标：心形、垃圾桶或分享箭头。这就是一个 IconButton：

IconButton(
  icon: Icon(Icons.delete),
  onPressed: () {
    print('Deleted');
  },
)

它没有 child:，而是接收一个 icon:，也就是你在第一单元中用过的同一个 Icon 小部件。点击后，图标周围会出现圆形涟漪效果。

普通的 Icon 无法点击：它只会绘制一张图。IconButton 能让它变成可以按下的按钮。

挑战

简单

在文本 Like this post 后面，添加一个带有 Icons.thumb_up 的 IconButton，按下时打印 Liked。

亲手试试

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      home: Scaffold(
        body: Center(
          child: Row(
            mainAxisSize: MainAxisSize.min,
            children: [
              Text('Like this post'),
            ],
          ),
        ),
      ),
    );
  }
}