Flutter高校项目编译报错：两个空安全相关问题求助

错误1：可空Animation类型不匹配 #

_tabController.animation返回的是Animation<double>?（可空类型），但AnimatedIcon的progress参数要求非空的Animation<double>。由于我们在initState中已经完成了_tabController的初始化，直接用!断言该值不为空即可。

错误2：非空字段未初始化 #

_tabController声明为非空的TabController类型，但未在声明时初始化。用late关键字修饰该字段，告诉Dart我们会在initState生命周期中完成初始化，满足空安全要求。

修改后的完整代码 #

import 'package:flutter/material.dart';

void main() {
  runApp(AppMenuAbas());
}

class AppMenuAbas extends StatefulWidget {
  @override
  _AppMenuAbasState createState() => _AppMenuAbasState();
}

class _AppMenuAbasState extends State<AppMenuAbas> with SingleTickerProviderStateMixin {
  late TabController _tabController; // 添加late关键字
  bool _isCollapsed = true;

  @override
  void initState() {
    super.initState();
    _tabController = TabController(vsync: this, length: 4);
  }

  @override
  void dispose() {
    _tabController.dispose();
    super.dispose();
  }

  void toggleCollapsed() {
    setState(() {
      _isCollapsed = !_isCollapsed;
    });
  }

  @override
  Widget build(BuildContext context) {
    final double screenWidth = MediaQuery.of(context).size.width;

    return MaterialApp(
      title: 'App com Menu e Abas',
      home: Scaffold(
        appBar: AppBar(
          title: Text('App com Menu e Abas'),
          centerTitle: true,
          leading: IconButton(
            icon: AnimatedIcon(
              icon: AnimatedIcons.menu_close,
              progress: _tabController.animation!, // 添加!断言非空
            ),
            onPressed: () {
              setState(() {
                if (_isCollapsed) {
                  _tabController.animateTo(0);
                }
                toggleCollapsed();
              });
            },
          ),
          bottom: TabBar(
            controller: _tabController,
            tabs: [
              Tab(icon: Icon(Icons.home), text: 'Home'),
              Tab(icon: Icon(Icons.description), text: 'Texto'),
              Tab(icon: Icon(Icons.people), text: 'Pessoas'),
              Tab(icon: Icon(Icons.chat), text: 'Chat'),
            ],
          ),
        ),
        body: TabBarView(
          controller: _tabController,
          children: [
            // Conteúdo da primeira aba (Home)
            Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    'Título Centralizado',
                    style: TextStyle(fontSize: 24),
                  ),
                  SizedBox(height: 20),
                  Row(
                    mainAxisAlignment: MainAxisAlignment.spaceAround,
                    children: [
                      Container(
                        width: screenWidth / 5,
                        height: screenWidth / 5,
                        decoration: BoxDecoration(
                          border: Border.all(width: 1),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.ac_unit),
                            Text('Conteúdo 1'),
                          ],
                        ),
                      ),
                      Container(
                        width: screenWidth / 5,
                        height:screenWidth / 5,
                        decoration: BoxDecoration(
                          border: Border.all(width: 1),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.ac_unit),
                            Text('Conteúdo 2'),
                          ],
                        ),
                      ),
                      Container(
                        width: screenWidth / 5,
                        height: screenWidth / 5,
                        decoration: BoxDecoration(
                          border: Border.all(width: 1),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.ac_unit),
                            Text('Conteúdo 3'),
                          ],
                        ),
                      ),
                      Container(
                        width: screenWidth / 5,
                        height: screenWidth / 5,
                        decoration: BoxDecoration(
                          border: Border.all(width: 1),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.ac_unit),
                            Text('Conteúdo 4'),
                          ],
                        ),
                      ),
                      Container(
                        width: screenWidth / 5,
                        height: screenWidth / 5,
                        decoration: BoxDecoration(
                          border: Border.all(width: 1),
                        ),
                        child: Column(
                          mainAxisAlignment: MainAxisAlignment.center,
                          children: [
                            Icon(Icons.ac_unit),
                            Text('Conteúdo 5'),
                          ],
                        ),
                      ),
                    ],
                  ),
                ],
              ),
            ),
            // Conteúdo da segunda aba (Texto)
            Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Text(
                    'Texto Extenso 1',
                    style: TextStyle(fontSize: 24),
                  ),
                  SizedBox(height: 20),
                  Text(
                    'Texto Extenso 2',
                    style: TextStyle(fontSize: 24),
                  ),
                ],
              ),
            ),
            // Conteúdo da terceira aba (Pessoas)
            Center(
              child: Column(
                mainAxisAlignment: MainAxisAlignment.center,
                children: [
                  Container(
                    width: screenWidth / 3,
                    height: screenWidth / 3,
                    decoration: BoxDecoration(
                      border: Border.all(width: 1),
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        CircleAvatar(
                          radius: 50,
                          backgroundImage: AssetImage('assets/person1.jpg'),
                        ),
                        SizedBox(height: 10),
                        Text('Pessoa 1'),
                        SizedBox(height: 10),
                        ElevatedButton(
                          onPressed: () {},
                          child: Text('Botão'),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(height: 20),
                  Container(
                    width: screenWidth / 3,
                    height: screenWidth / 3,
                    decoration: BoxDecoration(
                      border: Border.all(width: 1),
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        CircleAvatar(
                          radius: 50,
                          backgroundImage: AssetImage('assets/person2.jpg'),
                        ),
                        SizedBox(height: 10),
                        Text('Pessoa 2'),
                        SizedBox(height: 10),
                        ElevatedButton(
                          onPressed: () {},
                          child: Text('Botão'),
                        ),
                      ],
                    ),
                  ),
                  SizedBox(height: 20),
                  Container(
                    width: screenWidth / 3,
                    height: screenWidth / 3,
                    decoration: BoxDecoration(
                      border: Border.all(width: 1),
                    ),
                    child: Column(
                      mainAxisAlignment: MainAxisAlignment.center,
                      children: [
                        CircleAvatar(
                          radius: 50,
                          backgroundImage: AssetImage('assets/person3.jpg'),
                        ),
                        SizedBox(height: 10),
                        Text('Pessoa 3'),
                        SizedBox(height: 10),
                        ElevatedButton(
                          onPressed: () {},
                          child: Text('Botão'),
                        ),
                      ],
                    ),
                  ),
                ],
              ),
            ),
            // Conteúdo da quarta aba (Chat)
            Center(
              child: Text(
                'Conteúdo do Chat',
                style: TextStyle(fontSize: 24),
              ),
            ),
          ],
        ),
      ),
    );
  }
}

内容的提问来源于stack exchange，提问作者Renato Lucas