Reputation: 1217
i have a flutter app which contain a navigational drawer menu. when you click on the drawer, you can navigate to a different page. however, when you navigate to a different page, the toolbar is the same as the previous page which contain the navigational drawer. i have a home page that contain a menu on the toolbar. however, i only want the menu on the home page. if i go to another page, i want the menu to disappear.
here is my code
import 'package:flutter/material.dart';
import 'package:finsec/widget/drawer_widget.dart';
import 'package:finsec/widget/inherited_month_year.dart';
import 'package:finsec/screens/income/second_fragment.dart';
import 'package:finsec/screens/home/dashboards.dart';
import 'package:finsec/screens/transaction/transaction_list.dart';
import 'package:finsec/utils/colors.dart';
import 'package:finsec/utils/strings.dart';
import 'package:month_picker_dialog/month_picker_dialog.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:finsec/utils/localizations.dart';
import 'package:flutter_localizations/flutter_localizations.dart';
import 'package:finsec/model/month_year.dart';
class HomeScreen extends StatefulWidget {
final String title = home;
final Widget child;
HomeScreen({Key key, this.child}) : super(key: key);
@override
_HomeScreenState createState() => _HomeScreenState();
}
class _HomeScreenState extends State<HomeScreen> {
DateTime selectedDate, initialDate, prevSelectedDate;
String monthName1;
int monthNumber, year;
MonthYear monthYear;
getDrawerItemWidget(int pos, String title) {
switch (pos) {
case 0:
return new Dashboards ();
case 1:
return new SecondFragment();
case 2:
return new TransactionList(
outstanding: totalOutstanding,
received_or_paid:
totalReceived, transactionType: title,);
case 3:
return new TransactionList(
outstanding: totalOutstanding,
received_or_paid: totalPaid,
transactionType: title,);
default:
return new Text("Error");
}
}
String titleAppBar = home;
int tabIndex = 0;
double elevation = 0;
@override
void initState() {
setState(() {
titleAppBar = widget.title;
});
super.initState();
initialDate = DateTime.now();
selectedDate = initialDate;
}
void getMonthYear() {
if(selectedDate != null) {
monthName1 = monthNamesAbbrv[selectedDate.month];
monthNumber = selectedDate.month;
year = selectedDate.year;
prevSelectedDate = selectedDate;
}
else {
monthName1 = monthNamesAbbrv[prevSelectedDate.month];
monthNumber = prevSelectedDate.month;
year = prevSelectedDate.year;
}
monthYear = new MonthYear(monthNumber: monthNumber, year: year) ;
}
Widget homeScreen(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(titleAppBar),
elevation: elevation,
backgroundColor: colorPrimary,
actions: <Widget>[
Builder(
builder: (context) => FlatButton.icon(
icon: Icon(Icons.calendar_today, color: white,), //`Icon` to display
label: Text(monthName1 + ' $year' , style: TextStyle(color: white, fontSize: 18)), //`Text` to display
onPressed: () {
// DateTime date = new DateTime.now();
// showMonthPicker(context: context, initialDate: date);
showMonthPicker(
context: context,
firstDate: DateTime( DateTime.now().year - 1 , 5),
lastDate: DateTime( DateTime.now().year + 1, 9 ),
initialDate: selectedDate ?? initialDate
)
.then((date) => setState(() {
selectedDate = date ;//!= null ? date : prevSelectedDate;
}));
},
),
)
],
),
drawer: DrawerWidget((title, index) {
setState(() {
titleAppBar = title;
tabIndex = index;
});
}, tabIndex),
body: getDrawerItemWidget(tabIndex, titleAppBar),
);
}
@override
Widget build(BuildContext context) {
getMonthYear();
return
new MaterialApp(
localizationsDelegates: [
GlobalMaterialLocalizations.delegate,
GlobalWidgetsLocalizations.delegate,
],
supportedLocales: [
Locale('en'),
Locale('zh'),
Locale('fr'),
Locale('es'),
Locale('de'),
Locale('ru'),
Locale('ja'),
Locale('ar'),
Locale('fa'),
],
title: widget.title,
home: homeScreen(context)
);
}
}
if you take a look at my code above and check the homeScreen function, you will notice that i have a menu widget under actions: <Widget>[
command.
this is the menu that is appearing on the toolbar. when i move to another page using navigational menu, the same menu appear. i want to remove the menu when going to another page. is there a way to tell flutter to only display the menu on the home page? maybe an if statement in actions: part in homeScreen function.
oct 2019 menu appear on toolbar in the home page.
oct 2019 menu appear on toolbar in the income budget screen also. i dont want the menu there. only on homepage screen
Upvotes: 0
Views: 232
Reputation: 3686
You can conditionally tell your builder to destroy the date if the tabIndex is not 0, and create it again if it's 0
Builder(
builder: (context) => tabIndex==0 ? //here we check
FlatButton.icon(
icon: Icon(Icons.calendar_today, color: white,), //`Icon` to display
label: Text(monthName1 + ' $year' , style: TextStyle(color: white, fontSize: 18)), //`Text` to display
onPressed: () {
// DateTime date = new DateTime.now();
// showMonthPicker(context: context, initialDate: date);
showMonthPicker(
context: context,
firstDate: DateTime( DateTime.now().year - 1 , 5),
lastDate: DateTime( DateTime.now().year + 1, 9 ),
initialDate: selectedDate ?? initialDate
)
.then((date) => setState(() {
selectedDate = date ;//!= null ? date : prevSelectedDate;
}));
},
):SizedBox() //if it's not 0 we return an empty widget
)
Upvotes: 0