我正在开发一个Flutter应用程序，我尝试使用Flutter Screens中的登录屏幕，但遇到了问题。当我运行该应用程序时，它不起作用，并且仅向我显示错误列表。我想知道我是否正确使用了它。
这是我的主要爱好
import 'package:flutter/material.dart';
import 'AppDrawer.dart';
import 'LoginScreen.dart';
void main() => runApp(MyApp());
class MyApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return MaterialApp(
title: 'Test App',
theme: new ThemeData(
primaryColor: Colors.blue.shade400
),
debugShowCheckedModeBanner: false,
// home: new AppDrawer(),
home: new Container(
child: LoginScreen(
backgroundColor1: Color(0xFF444152),
backgroundColor2: Color(0xFF6f6c7d),
highlightColor: Color(0xfff65aa3),
foregroundColor: Colors.white,
logo: new AssetImage("assets/images/full-bloom.png"),
),
),
);
}
}
这是我从Flutter Screens存储库中获取的LoginScreen类（位于LoginScreen2下）：
import 'package:flutter/material.dart';
class LoginScreen extends StatelessWidget {
final Color backgroundColor1;
final Color backgroundColor2;
final Color highlightColor;
final Color foregroundColor;
final AssetImage logo;
LoginScreen({Key k, this.backgroundColor1, this.backgroundColor2, this.highlightColor, this.foregroundColor, this.logo});
@override
Widget build(BuildContext context) {
return Container(
decoration: new BoxDecoration(
gradient: new LinearGradient(
begin: Alignment.centerLeft,
end: new Alignment(1.0, 0.0), // 10% of the width, so there are ten blinds.
colors: [this.backgroundColor1, this.backgroundColor2], // whitish to gray
tileMode: TileMode.repeated, // repeats the gradient over the canvas
),
),
height: MediaQuery.of(context).size.height,
child: Column(
children: <Widget>[
Container(
padding: const EdgeInsets.only(top: 150.0, bottom: 50.0),
child: Center(
child: new Column(
children: <Widget>[
Container(
height: 128.0,
width: 128.0,
child: new CircleAvatar(
backgroundColor: Colors.transparent,
foregroundColor: this.foregroundColor,
radius: 100.0,
child: new Text(
"S",
style: TextStyle(
fontSize: 50.0,
fontWeight: FontWeight.w100,
),
),
),
decoration: BoxDecoration(
border: Border.all(
color: this.foregroundColor,
width: 1.0,
),
shape: BoxShape.circle,
//image: DecorationImage(image: this.logo)
),
),
new Padding(
padding: const EdgeInsets.all(16.0),
child: new Text(
"Samarth Agarwal",
style: TextStyle(color: this.foregroundColor),
),
)
],
),
),
),
new Container(
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(left: 40.0, right: 40.0),
alignment: Alignment.center,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: this.foregroundColor,
width: 0.5,
style: BorderStyle.solid),
),
),
padding: const EdgeInsets.only(left: 0.0, right: 10.0),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Padding(
padding:
EdgeInsets.only(top: 10.0, bottom: 10.0, right: 00.0),
child: Icon(
Icons.alternate_email,
color: this.foregroundColor,
),
),
new Expanded(
child: TextField(
textAlign: TextAlign.center,
decoration: InputDecoration(
border: InputBorder.none,
hintText: 'samarthagarwal@live.com',
hintStyle: TextStyle(color: this.foregroundColor),
),
),
),
],
),
),
new Container(
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(left: 40.0, right: 40.0, top: 10.0),
alignment: Alignment.center,
decoration: BoxDecoration(
border: Border(
bottom: BorderSide(
color: this.foregroundColor,
width: 0.5,
style: BorderStyle.solid),
),
),
padding: const EdgeInsets.only(left: 0.0, right: 10.0),
child: new Row(
crossAxisAlignment: CrossAxisAlignment.center,
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget>[
new Padding(
padding:
EdgeInsets.only(top: 10.0, bottom: 10.0, right: 00.0),
child: Icon(
Icons.lock_open,
color: this.foregroundColor,
),
),
new Expanded(
child: TextField(
obscureText: true,
textAlign: TextAlign.center,
decoration: InputDecoration(
border: InputBorder.none,
hintText: '*********',
hintStyle: TextStyle(color: this.foregroundColor),
),
),
),
],
),
),
new Container(
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(left: 40.0, right: 40.0, top: 30.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
new Expanded(
child: new FlatButton(
padding: const EdgeInsets.symmetric(
vertical: 20.0, horizontal: 20.0),
color: this.highlightColor,
onPressed: () => {},
child: Text(
"Log In",
style: TextStyle(color: this.foregroundColor),
),
),
),
],
),
),
new Container(
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(left: 40.0, right: 40.0, top: 10.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
new Expanded(
child: new FlatButton(
padding: const EdgeInsets.symmetric(
vertical: 20.0, horizontal: 20.0),
color: Colors.transparent,
onPressed: () => {},
child: Text(
"Forgot your password?",
style: TextStyle(color: this.foregroundColor.withOpacity(0.5)),
),
),
),
],
),
),
new Expanded(child: Divider(),),
new Container(
width: MediaQuery.of(context).size.width,
margin: const EdgeInsets.only(left: 40.0, right: 40.0, top: 10.0, bottom: 20.0),
alignment: Alignment.center,
child: new Row(
children: <Widget>[
new Expanded(
child: new FlatButton(
padding: const EdgeInsets.symmetric(
vertical: 20.0, horizontal: 20.0),
color: Colors.transparent,
onPressed: () => {},
child: Text(
"Don't have an account? Create One",
style: TextStyle(color: this.foregroundColor.withOpacity(0.5)),
),
),
),
],
),
),
],
),
);
}
}
我认为也许我在此行的主容器中使用了错误的容器：
home: new Container(
任何人都对可能的问题有任何想法？ 弹出的错误如下（继续，这只是前几行）：
I/flutter (11670): ══╡ EXCEPTION CAUGHT BY WIDGETS LIBRARY ╞═══════════════════════════════════════════════════════════
I/flutter (11670): The following assertion was thrown building TextField(decoration: InputDecoration(hintText:
I/flutter (11670): "samarthagarwal@live.com", border: _NoInputBorder()), textAlign: center, dirty, state:
I/flutter (11670): _TextFieldState#de3eb):
I/flutter (11670): No Material widget found.
I/flutter (11670): TextField widgets require a Material widget ancestor.
I/flutter (11670): In material design, most widgets are conceptually "printed" on a sheet of material. In Flutter's
I/flutter (11670): material library, that material is represented by the Material widget. It is the Material widget
I/flutter (11670): that renders ink splashes, for instance. Because of this, many material library widgets require that
I/flutter (11670): there be a Material widget in the tree above them.
I/flutter (11670): To introduce a Material widget, you can either directly include one, or use a widget that contains
I/flutter (11670): Material itself, such as a Card, Dialog, Drawer, or Scaffold.
I/flutter (11670): The specific widget that could not find a Material ancestor was:
I/flutter (11670): TextField(decoration: InputDecoration(hintText: "samarthagarwal@live.com", border:
I/flutter (11670): _NoInputBorder()), textAlign: center)
I/flutter (11670): The ancestors of this widget were:
I/flutter (11670): Expanded(flex: 1)
I/flutter (11670): Row(direction: horizontal, mainAxisAlignment: spaceBetween, crossAxisAlignment: center)
I/flutter (11670): Align(alignment: center)
I/flutter (11670): Padding(padding: EdgeInsets(0.0, 0.0, 10.0, 0.5))
I/flutter (11670): DecoratedBox(bg: BoxDecoration(border: Border(bottom: BorderSide(Color(0xffffffff), 0.5,
I/flutter (11670): BorderStyle.solid))))
答案 0 :(得分：2)
您需要使用Scaffold简单地包装父容器。
home: Scaffold(
body: new Container(
child: LoginScreen(
backgroundColor1: Color(0xFF444152),
backgroundColor2: Color(0xFF6f6c7d),
highlightColor: Color(0xfff65aa3),
foregroundColor: Colors.white,
logo: new AssetImage("assets/images/full-bloom.png"),
),
),
),