Trouble with Flutter stateless widget call

Question

I'm having trouble calling a page from my bottom navigation bar. My nav code looks like this:

import 'package:flutter/material.dart';
import 'package:flutter_client_app/home_screen.dart';
import 'package:flutter_client_app/Screens/AuthScreen/login.dart';
import 'package:firebase_auth/firebase_auth.dart';
import 'BLEScreen.dart';
import 'Provider/auth_provider.dart';

class Nav extends StatefulWidget {
  @override
  _NavState createState() => _NavState();
}

class _NavState extends State<Nav> {
  String? email = FirebaseAuth.instance.currentUser!.email;
  int _selectedIndex = 0;
  List<Widget> _widgetOptions = <Widget>[
    Home(app:_Home),
    FlutterBlueApp(),
    Text('Settings'),
  ];

  void _onItemTap(int index) {
    setState(() {
      _selectedIndex = index;
    });
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
          title: Text("Welcome"),
          actions: [
            IconButton(icon: Icon(Icons.exit_to_app), onPressed: () {
              //sign out user
              // ignore: unnecessary_statements
              AuthClass().signOut;
              Navigator.pushAndRemoveUntil(
                  context,
                  MaterialPageRoute(builder: (context) => LoginPage()),
                      (route) => false);
            })
          ]
      ),
      body: Center(
        child: _widgetOptions.elementAt(_selectedIndex),
      ),
      bottomNavigationBar: BottomNavigationBar(
        items: const <BottomNavigationBarItem>[
          BottomNavigationBarItem(
            icon: Icon(Icons.home),
            label: 'Home',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.bluetooth),
            label: 'Bluetooth',
          ),
          BottomNavigationBarItem(
            icon: Icon(Icons.settings),
            label: 'Settings',
          ),
        ],
        currentIndex: _selectedIndex,
        onTap: _onItemTap,
      ),
    );
  }
}

The problem that is arising is coming from the Home page. This is what it looks like:

import 'package:firebase_core/firebase_core.dart';
import 'package:flutter/material.dart';

import 'package:firebase_database/firebase_database.dart';
import 'package:flutter_client_app/nav.dart';

class Home extends StatefulWidget {
  final FirebaseApp app;
  Home({required this.app});

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

class _Home extends State<Home> {
  final referenceDatabase = FirebaseDatabase.instance;

  final movieName = 'MovieTitle';
  final movieController = TextEditingController();

  @override
  Widget build(BuildContext context) {
    final ref = referenceDatabase.reference();
    return SingleChildScrollView(
      child: Column(
        children: [
          Center(
            child: Container(
              color: Colors.green,
              width: MediaQuery.of(context).size.width,
              height: MediaQuery.of(context).size.height,
              child: Column(
                children: [
                  Text(
                    movieName,
                    textAlign: TextAlign.center,
                    style: TextStyle(fontSize: 25, fontWeight: FontWeight.bold),
                  ),
                  TextField(
                    controller: movieController,
                    textAlign: TextAlign.center,
                  ),
                  FlatButton(
                    color:Colors.grey,
                    onPressed: (){
                    ref
                    .child('Movies')
                        .push()
                        .child(movieName)
                        .set(movieController.text)
                        .asStream();
                  }, child: Text('Save movie'),
                      textColor: Colors.white,
                  ),
                ],
              ),
            ),
          ),
        ],
      ),
    );
  }
}

The error that I am getting on my screen is as follows:

lib/nav.dart:17:9: Error: Required named parameter 'app' must be provided.
    Home(),
        ^
lib/home_screen.dart:23:3: Context: Found this candidate, but the arguments don't match.
  Home({required this.app});
  ^^^^


FAILURE: Build failed with an exception.

MDemetrio · Answer 1 · 2021-08-31T02:42:15.490

Unless Home widget really has the FirebaseApp dependency, you can consider removing it as a required constructor parameter:

class Home extends StatefulWidget {
  Home();

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

You may not need to require a FirebaseApp instance in the constructor, since you can use the default app:

FirebaseApp defaultApp = await Firebase.initializeApp();
// or
FirebaseApp defaultApp = Firebase.app();

or the static instance getters provided by FlutterFire libraries, like the ones you used for authentication and database:

  final auth = FirebaseAuth.instance;
// or
  final database = FirebaseDatabase.instance;

Otherwise, you need to provide an instance as argument in line lib/nav.dart:17:9 as stated in the exception. Common ways of providing a dependency in flutter is by using InheritedWidgets, provider or get_it.

You can also use a repository pattern to abstract away the Firebase dependency, making it easier for testing purposes.

Trouble with Flutter stateless widget call

1 Answers1