Question

我正在按照本教程制作可折叠的导航抽屉 https://www.youtube.com/watch?v=2SjvhAUR9aw&t=1145s 我能够创建导航栏，但是问题是折叠和使按钮可单击时无法播放动画，这会使我的应用崩溃，因为我无法设置状态（错误显示在图片中）任何人都可以向我解释，如果可能的话，请修复并共享代码？在此先感谢<3 https://github.com/iSpammer/promoapp

import 'package:flutter/material.dart';
import 'package:flutter/cupertino.dart';
import 'package:promoapp/model/NavigationModel.dart';
import 'package:promoapp/styles/theme.dart';
import 'package:promoapp/widgets/CollapsingListTitle.dart';

class CollapsingNavigationDrawer extends StatefulWidget {
  @override
  _CollapsingNavigationDrawerState createState() =>
      _CollapsingNavigationDrawerState();
}

class _CollapsingNavigationDrawerState extends State<CollapsingNavigationDrawer>
    with SingleTickerProviderStateMixin {
  bool _isCollapsed = true;
  AnimationController animationController;
  Animation<double> widthAnimation;
  double _minwidth = 70;
  double _maxwidth = 220;
  int selectedIndex = 0;

  @override
  void initState() {
    super.initState();
    animationController = AnimationController(
      vsync: this,
      duration: Duration(microseconds: 300),
    );
    widthAnimation = Tween<double>(
      begin: _maxwidth,
      end: _minwidth,
    ).animate(animationController);
  }

  @override
  Widget build(BuildContext context) {
    return AnimatedBuilder(
      animation: animationController,
      builder: (context, widget) => getWidget(context, widget),
    );
  }

  Widget getWidget(context, widget) {
    return Material(
      elevation: 50,
      child: Container(
        width: widthAnimation.value,
        color: kDrawerBackgroundColor,
        child: Column(
          children: <Widget>[
            CollapsingListTitle(
              onTap: () {},
              minwidth: _minwidth,
              maxwidth: _maxwidth,
              title: "Ossama Akram",
              icon: Icons.person,
              animationController: animationController,
            ),
            Divider(
              height: 40,
            ),
            Expanded(
              child: ListView.separated(
                separatorBuilder: (context, counter) {
                  return Divider(
                    height: 12,
                  );
                },
                itemBuilder: (context, counter) => CollapsingListTitle(
                      onTap: () {
                        setState(() {
//                          selectedIndex = counter;
                        });
                      },
                      isSelected: selectedIndex == counter,
                      minwidth: _minwidth,
                      maxwidth: _maxwidth,
                      title: navigationItems[counter].title,
                      icon: navigationItems[counter].icon,
                      animationController: animationController,
                    ),
                itemCount: navigationItems.length,
              ),
            ),
            InkWell(
              onTap: () {
                setState(() {
                  _isCollapsed = !_isCollapsed;
                  _isCollapsed
                      ? animationController.forward()
                      : animationController.reverse();
                });
              },
              child: AnimatedIcon(
                icon: AnimatedIcons.close_menu,
                progress: animationController,
                color: Colors.white,
                size: 50.0,
              ),
            ),
            SizedBox(
              height: 5.0,
            ),
          ],
        ),
      ),
    );
  }
}

```[![setState error (making items clickable)][1]][1]


  [1]: https://i.stack.imgur.com/BY49t.jpg

动画抽屉错误

0 个答案: