LateInitializationError: Field 'animationController' has not been initialized even using initState()

Question

I am trying to build a login/signup page by using SingleTickerProviderStateMixin but I am getting errors on AnimationController. How I can solve it, Even try to use nullable? but I have to check. on operation. At that time I also get errors. Please help me to find out any solutions

class log2 extends StatefulWidget {
  const log2({Key? key}) : super(key: key);

  @override
  State<log2> createState() => _log2State();
}

class _log2State extends State<log2> with SingleTickerProviderStateMixin {
  bool islogin = true;
  Animation<double>? containSize;
  late AnimationController animationController;
  Duration duration = Duration(milliseconds: 270);

  @override
  Widget build(BuildContext context) {
    double mobHeight = MediaQuery.of(context).size.height;
    double mobWidth = MediaQuery.of(context).size.width;
    TextEditingController emailController = TextEditingController(),
        passController = TextEditingController();

    initState() {
      super.initState();
      animationController =
          AnimationController(vsync: this, duration: duration);
      SystemChrome.setEnabledSystemUIOverlays([]);
    }

    //For Ticker Screen
    containSize = Tween<double>(begin: mobHeight * 0.1, end: mobWidth * 0.1)
        .animate(
            CurvedAnimation(parent: animationController, curve: Curves.linear));

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

Build Widget:

return SafeArea(
      child: Scaffold(
        body: Stack(
          children: [
            Padding(
              padding: const EdgeInsets.only(top: 50),
              child: Column(
                crossAxisAlignment: CrossAxisAlignment.center,
                children: [
                  Text(
                    "Welcome",
                    style: TextStyle(color: Colors.black, fontSize: 25),
                  ),
                  SizedBox(
                    height: 40,
                  ),
                  Transform.rotate(
                    angle: pi / 4,
                    child: Image.asset(
                      "images/computerdesk.png",
                      fit: BoxFit.cover,
                      height: mobHeight / 3,
                      width: mobWidth / 0.2,
                    ),
                  ),

                  AnimatedBuilder(
                    animation: animationController,
                    builder: (context, child) {
                      return buiderSignupContainer();
                    },
                  ),
                ],
              ),
            ),
            Positioned(
              child: Image.asset("images/ball.png"),
            ),
          ],
        ),
      ),
    );
  }

2nd stack widget:

Widget buiderSignupContainer() {
    double mobheight = MediaQuery.of(context).size.height;
    return Align(
      alignment: Alignment.bottomCenter,
      child: GestureDetector(
        child: Container(
          width: double.infinity,
          height: containSize?.value,
          decoration: BoxDecoration(
            borderRadius: BorderRadius.only(
              topRight: Radius.circular(30),
              topLeft: Radius.circular(30),
            ),
            color: Colors.black.withAlpha(50),
          ),
          child: Row(
            mainAxisAlignment: MainAxisAlignment.center,
            children: [
              Text("Don't Have a Account Yet?"),
              VerticalDivider(width: 5),
              Text(
                "Sign Up",
                style: TextStyle(color: Colors.red),
              ),
            ],
          ),
        ),
        onTap: () {
          setState(() {
            islogin = !islogin;
          });
        },
      ),
    );
  }

Answer 1

You put initState and dispose methods to wrong block. Change it to:

class _log2State extends State<log2> with SingleTickerProviderStateMixin {   bool islogin = true;   Animation<double>? containSize;   late AnimationController animationController;   Duration duration = Duration(milliseconds: 270);

  bool islogin = true;
  Animation<double>? containSize;
  late AnimationController animationController;
  Duration duration = Duration(milliseconds: 270);

  @override
  void initState() {
     super.initState();
     animationController = AnimationController(vsync: this, duration: duration);
     SystemChrome.setEnabledSystemUIOverlays([]);
     //For Ticker Screen
     containSize = Tween<double>(begin: mobHeight * 0.1, end: mobWidth * 0.1).animate(CurvedAnimation(parent: animationController, curve: Curves.linear));
  }

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

  @override 
  Widget build(BuildContext context) {
    double mobHeight = MediaQuery.of(context).size.height;
    double mobWidth = MediaQuery.of(context).size.width;
    TextEditingController emailController = TextEditingController() passController = TextEditingController();

    return SafeArea(
  child: Scaffold(
    body: Stack(
      children: [
        Padding(
          padding: const EdgeInsets.only(top: 50),
          child: Column(
            crossAxisAlignment: CrossAxisAlignment.center,
            children: [
              Text(
                "Welcome",
                style: TextStyle(color: Colors.black, fontSize: 25),
              ),
              SizedBox(
                height: 40,
              ),
              Transform.rotate(
                angle: pi / 4,
                child: Image.asset(
                  "images/computerdesk.png",
                  fit: BoxFit.cover,
                  height: mobHeight / 3,
                  width: mobWidth / 0.2,
                ),
              ),

              AnimatedBuilder(
                animation: animationController,
                builder: (context, child) {
                  return buiderSignupContainer();
                },
              ),
            ],
          ),
        ),
        Positioned(
          child: Image.asset("images/ball.png"),
        ),
      ],
    ),
  ),
);
}