切换到其他屏幕时颤动黑屏
Posted
技术标签:
【中文标题】切换到其他屏幕时颤动黑屏【英文标题】：Flutter black screen when switching to other screen 【发布时间】：2020-10-02 17:32:58 【问题描述】：我在 Flutter 中制作了第二个屏幕。我有我的 main.dart 我的 January.dart 和我的 YearScreen.dart。 我想从一月屏幕切换到年份屏幕..
但是当我想切换到 YearScreen 屏幕时，显示会变黑。
它在一小时前使用相同的代码。 有没有人有这方面的经验。
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());
一月.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,
),
),);
【问题讨论】：
您的应用应该只有一个 materialapp。从您的应用中删除所有其他 materialapp 小部件。 只保留main.dart文件中的materialapp并删除所有其他 【参考方案1】：可能是因为您也从 JanuaryScreen 和 YearScreen 的构建方法返回 MaterialApp。您不需要从任何地方返回 MaterialApp，您只需用 MaterialApp 包装小部件树的最开始部分，然后从树下的子项中返回类似 Scaffold 的内容。如果您从 YearScreen 和 JanuaryScreen 中删除 MaterialApp，它应该可以正常工作。
【讨论】：
以上是关于切换到其他屏幕时颤动黑屏的主要内容，如果未能解决你的问题，请参考以下文章
setState 是不是会在颤动中为屏幕重建整个小部件树，以及它与其他状态管理相比如何