cannot localize Strings in Flutter tabbar view and list view - flutter

Question

When I try to localize a string in a TabBarView I get this error:
NoSuchMethodError: The method 'translate' was called on null. Receiver: null. Tried calling: translate("settingsprofile").
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:rewahub/views/tabbar.dart';
import 'package:rewahub/widgets/app_localizations.dart';
import 'package:rewahub/widgets/styles.dart' ;
import 'package:firebase_database/firebase_database.dart';
import 'package:firebase_messaging/firebase_messaging.dart';
import 'package:flutter/material.dart';
class MainHomePage extends StatefulWidget {
MainHomePage({Key key, this.title}) : super(key: key);
final String title;
#override
_MainHomePageState createState() => _MainHomePageState();
}
class _MainHomePageState extends State<MainHomePage> {
final int initialIndex = 1;
TextStyle style = TextStyle(fontFamily: 'Montserrat', fontSize: 20.0);
String textValue = 'unknown';
#override
Widget build(BuildContext context) {
return MaterialApp(
// localizationsDelegates: [
// AppLocalizations.delegate,
// GlobalMaterialLocalizations.delegate,
// GlobalWidgetsLocalizations.delegate,
// ],
debugShowCheckedModeBanner: false,
home: DefaultTabController(
initialIndex: 1,
length: 3,
child: Scaffold(
resizeToAvoidBottomPadding: false,
appBar: new PreferredSize(
preferredSize: const Size.fromHeight(150.0),
child: new AppBar(
centerTitle: false,
title: Container(
width: MediaQuery.of(context).size.width / 1.0,
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
Text(
"8956",
textAlign: TextAlign.left,
style: TextStyle(color: Colors.white, fontSize: 18.0),
),
Image.asset(
'assets/images/rewahub_icon.png',
height: 50.0,
),
Text(
"RS 434.25",
style: TextStyle(color: Colors.white, fontSize: 18.0),
),
],
),
),
flexibleSpace: Container(
decoration: BoxDecoration(gradient:grad),
),
bottom: TabBar(
tabs: <Widget>[
Tab(
child: new Text(
AppLocalizations.of(context).translate('tabvouchers'),
style: Theme.of(context)
.textTheme
.body1
.apply(color: Colors.white),
),
),
Tab(
child: new Text(
AppLocalizations.of(context).translate('tabpaynow'),
style: Theme.of(context)
.textTheme
.body1
.apply(color: Colors.white),
),
),
Tab(
child: new Text(
AppLocalizations.of(context).translate('tabpoints'),
style: Theme.of(context)
.textTheme
.body1
.apply(color: Colors.white),
),
),
],
),
),
),
//body: TabBody(),
),
),
);
}
}
I use this line of code to translate a key to a localized string:
AppLocalizations.of(context).translate('settingsprofile')
This works great in all the other screens of my app except this one. Does anyone know why it's not working and how to solve it?
Some things I already tried:
pass the context of the main screen (the screen that holds all the TabBarViews)
wrap every ListTile in a Builder