Flutter中的浮动操作按钮

Question

我是一位有用的助手，可以为您进行文本翻译。

我正在尝试创建浮动操作按钮，但是我缺少图标。

我的代码如下：

import 'package:flutter/material.dart';
void main() => runApp(MyApp());

class MyApp extends StatelessWidget {
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      debugShowCheckedModeBanner: false,
      title: 'Flutter Demo',
      theme: ThemeData(
        primarySwatch: Colors.blue,
      ),
      home: Scaffold(
        appBar: AppBar(
          backgroundColor: Colors.blue,
          centerTitle: true,
          title: Text(
            "Lessons of Flutter",
            style: TextStyle(
              color: Colors.white,
            ),
          ),
        ),
        body: Center(
            child: const Text('Press the button below!')
        ),
        floatingActionButton: FloatingActionButton(
          onPressed: () {
            // Add your onPressed code here!
          },
          child: Icon(Icons.mouse),
          backgroundColor: Colors.green,
        ),
      ),
    );
  }
}

这是虚拟设备的屏幕截图。（你可以看到图标看起来很奇怪。）

- Cihat Şaman

Answer 1

为了使用这个类，请确保在你的Flutter项目的pubspec.yaml文件中设置了uses-material-design: true，以保证应用程序中包含MaterialIcons字体。这个字体用于显示图标。例如：

请参考这个链接：https://api.flutter.dev/flutter/material/Icons-class.html。

- krishnaji

Answer 2

图标无法渲染，因为材料设计库中缺少字体。您需要在pubspec.yml文件中启用材料设计库，如下所示：

flutter:
  uses-material-design: true

只需要将 uses-material-design 设为 true，错误就会消失。这将确保 MaterialIcons 字体包含在您的应用程序中。该字体用于显示图标。这里是 Icon 类的官方 docs。

- Kiran Maniya