JULIUS
Reputation: 121
Flutter black screen when switching to other screen
I made a second screen in Flutter. I have my main.dart my January.dart and my YearScreen.dart. I want switch from the January screen to the year screen..
But when I want to switch to the YearScreen screen the display turns black.
It worked with the same Code an hour ago. Has anybody experience with this.
main.dart
import 'package:flutter/material.dart';
import 'package:flutter_calendar/January.dart';
void main() {
runApp(Calendar());
}
class Calendar extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(debugShowCheckedModeBanner: false,
home: JanuaryScreen());
}
}
January.dart
import 'package:flutter/material.dart';
import 'package:flutter_calendar/YearScreen.dart';
class JanuaryScreen extends StatefulWidget {
@override
_JanuaryScreenState createState() => _JanuaryScreenState();
}
class _JanuaryScreenState extends State<JanuaryScreen> {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
floatingActionButton: Stack(children: [
Positioned(
top: 300,
left: 285,
child: SizedBox(
height: 60,
width: 101,
child: FloatingActionButton.extended(
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) {
return YearScreen();
}));
},
elevation: 0,
isExtended: true,
backgroundColor: Colors.black,
splashColor: Colors.blueGrey,
highlightElevation: 0,
label: Text("J"),
))),
Positioned(
top: 600,
right: 285,
child: SizedBox(
height: 60,
width: 101,
child: FloatingActionButton.extended(
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) {
return YearScreen();
}));
},
elevation: 0,
isExtended: true,
backgroundColor: Colors.black,
splashColor: Colors.blueGrey,
highlightElevation: 0,
label: Text("2020"),
)))
]),
backgroundColor: Colors.blueGrey,
appBar: PreferredSize(
preferredSize: Size.fromHeight(65.0),
child: AppBar(
backgroundColor: Colors.blueGrey,
elevation: 0.0,
title: Transform(
transform: Matrix4.translationValues(-85.0, 0.0, 0.0),
child: Text(
"January",
style: TextStyle(fontSize: 50),
),
),
),),
body: ListView(
children: [
RaisedButton(
child: Text(
"1",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"2",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"3",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"4",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"5",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"6",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"7",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"8",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"9",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"10",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"11",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"12",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"13",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"14",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"15",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"16",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"17",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"18",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"19",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"20",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"21",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"22",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"23",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"24",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"25",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"26",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"27",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"28",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"29",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
RaisedButton(
child: Text(
"30",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"31",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
splashColor: Colors.transparent,
elevation: 0,
onPressed: () {
print("j");
},
),
],
itemExtent: 211.89,
),
),
);
}
}
YearScreen.dart
import 'package:flutter/material.dart';
import 'package:flutter_calendar/January.dart';
class YearScreen extends StatefulWidget {
@override
_YearScreenState createState() => _YearScreenState();
}
class _YearScreenState extends State<YearScreen> {
@override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
home: Scaffold(
backgroundColor: Colors.blueGrey,
body: ListView(
children: [
RaisedButton(
child: Text(
"2020",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
Navigator.push(context,
MaterialPageRoute(builder: (context) {
return JanuaryScreen();
}));
},
),
RaisedButton(
child: Text(
"2021",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
print("2021");
},
),
RaisedButton(
child: Text(
"2022",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
print("2022");
},
),
RaisedButton(
child: Text(
"2023",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
print("2023");
},
),
RaisedButton(
child: Text(
"2024",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
print("2024");
},
),
RaisedButton(
child: Text(
"2025",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
print("2025");
},
),
RaisedButton(
child: Text(
"2026",
style: TextStyle(fontSize: 130),
),
onPressed: () {
print("2026");
},
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
),
RaisedButton(
child: Text(
"2027",
style: TextStyle(fontSize: 130),
),
onPressed: () {
print("2027");
},
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
),
RaisedButton(
child: Text(
"2028",
style: TextStyle(fontSize: 130),
),
onPressed: () {
print("2028");
},
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
),
RaisedButton(
child: Text(
"2029",
style: TextStyle(fontSize: 130),
),
onPressed: () {
print("2029");
},
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
),
RaisedButton(
child: Text(
"2030",
style: TextStyle(fontSize: 130),
),
color: Colors.blueGrey,
elevation: 0,
splashColor: Colors.transparent,
onPressed: () {
print("2030");
},
),
],
itemExtent: 300,
),
),);
}
}
Upvotes: 0
Views: 986
Answers (1)
Mithun Adhikari
Reputation: 569
Probably because you are returning MaterialApp from the build method of JanuaryScreen and YearScreen as well. You don't need to return MaterialApp from everywhere, you just wrap the very starting part of your widget tree with MaterialApp and then return something like Scaffold from the childrens below the tree. If you remove MaterialApp from YearScreen and JanuaryScreen, it should work fine.
Upvotes: 2
Related Questions
- Flutter app shows a black screen before loading the app
- Switching to another Screen using onPressed not working properly
- How to fix black screen in flutter while Navigating?
- Flutter | Screen turn black color background
- Getting a black screen when navigating between two pages in flutter
- Flutter app when runs returns a blank screen
- App loads a wrong screen before loading the correct screen
- Going Back is showing Black Screen in Flutter
- Navigation to another screen is always blank in flutter
- Flutter application: Required to terminate screen while navigating to next screen