flutterdartnullabledart-null-safetynon-nullable

Non-nullable instance field ['controller'] must be initialized in flutter


Good day! I am a new to Flutter to would like to start my Startup but I was trapped in this problem to make Tabbar example...

I have almost been frustrated all day because of this problems....

Dart Analysis keeps saying this below....

Non-nullable instance field ['controller'] must be initialized in flutter

really appreciate in advance.

        import 'package:flutter/material.dart';
import 'sub/firstPage.dart';
import 'sub/secondPage.dart';


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

class MyApp extends StatelessWidget {
  // This widget is the root of your application.
  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: 'Flutter Demo',
      theme: ThemeData(

        primarySwatch: Colors.blue,
      ),
      home: MyHomePage(title: 'Flutter Demo Home Page'),
    );
  }
}

class MyHomePage extends StatefulWidget {
  MyHomePage({Key? key, required this.title}) : super(key: key);



  final String title;

  @override
  _MyHomePageState createState() => _MyHomePageState();
}

class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin {

  TabController controller;

  @override
  void initState() {
    super.initState();
    controller = TabController(length: 2, vsync: this);


  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
        appBar: AppBar(
          title: Text('TabBar Example'),
        ),
        body: TabBarView(
          children: <Widget>[FirstApp(), SecondApp()],
          controller: controller,
        ),
        bottomNavigationBar: TabBar(tabs: [
          Tab(icon: Icon(Icons.looks_one, color: Colors.blue),),
          Tab(icon: Icon(Icons.looks_two, color: Colors.blue),),
        ],
        )
    );
  }

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


        }

Solution

  • Plase try, you missed use controller

    import 'package:flutter/material.dart';
    import 'sub/firstPage.dart';
    import 'sub/secondPage.dart';
    
    
    void main() {
      runApp(MyApp());
    }
    
    class MyApp extends StatelessWidget {
      // This widget is the root of your application.
      @override
      Widget build(BuildContext context) {
        return MaterialApp(
          title: 'Flutter Demo',
          theme: ThemeData(
    
            primarySwatch: Colors.blue,
          ),
          home: MyHomePage(title: 'Flutter Demo Home Page'),
        );
      }
    }
    
    class MyHomePage extends StatefulWidget {
      MyHomePage({Key? key, required this.title}) : super(key: key);
    
    
    
      final String title;
    
      @override
      _MyHomePageState createState() => _MyHomePageState();
    }
    
    class _MyHomePageState extends State<MyHomePage> with SingleTickerProviderStateMixin {
    
      late TabController controller;
    
      @override
      void initState() {
        super.initState();
        controller = TabController(length: 2, vsync: this);
    
    
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
            appBar: AppBar(
              title: Text('TabBar Example'),
            ),
            body: TabBarView(
              children: <Widget>[FirstApp(), SecondApp()],
              controller: controller,
            ),
            bottomNavigationBar: TabBar(
              controller: controller, // add here 
              tabs: [
              Tab(icon: Icon(Icons.looks_one, color: Colors.blue),),
              Tab(icon: Icon(Icons.looks_two, color: Colors.blue),),
            ],
            )
        );
      }
    
      @override
      void dispose() {
        controller.dispose();
        super.dispose();
      }
    
    
    }