NoSuchMethodError: Class 'List<Data> has no instance getter
NoSuchMethodError: Class 'List<Data> has no instance getter
我有 gridviewbuilder，它从 itemGriddata 中获取数据，它具有 onTap 函数，可将其定向到一个新页面，该页面也从该模型中获取数据，但是当我单击它时，标题中出现错误，任何帮助或某种帮助启蒙将不胜感激
这是 gridview 页面
import 'package:flutter/material.dart';
import 'package:wild_wild_rift/builds/SinglePage.dart';
import 'package:wild_wild_rift/data/model.dart';
import 'package:google_fonts/google_fonts.dart';
class GridViewPage extends StatefulWidget {
@override
_GridViewPage createState() => _GridViewPage();
}
class _GridViewPage extends State<GridViewPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.grey,
automaticallyImplyLeading: true,
title: const Text(
'Champions',
style: TextStyle(
fontFamily: 'Lexend Doca',
color: Colors.white,
fontSize: 32,
fontWeight: FontWeight.bold,
),
),
elevation: 2,
),
body: Column(
mainAxisSize: MainAxisSize.max,
children: [
Expanded(
child: Padding(
padding: const EdgeInsetsDirectional.fromSTEB(15, 15, 15, 15),
child: GridView.builder(
itemCount: itemGriddata.length,
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 4,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
childAspectRatio: 1,
),
itemBuilder: (context, index) {
return GridSingleItem(
itemGriddata: itemGriddata[index],
onTap: () async {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SinglePage(itemGriddata[index])));
},
);
},
),
),
),
],
));
}
}
class GridSingleItem extends StatelessWidget {
final itemGriddata;
final Function onTap;
const GridSingleItem({Key key, @required this.itemGriddata, this.onTap})
: super(key: key);
@override
Widget build(BuildContext context) {
return InkWell(
onTap: onTap,
child: ClipRRect(
borderRadius: BorderRadius.circular(5),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xEEEEEE),
image: DecorationImage(
fit: BoxFit.cover,
image: Image.asset(itemGriddata.image).image,
),
boxShadow: const [
BoxShadow(
blurRadius: 3,
color: Color(0xDA000000),
)
],
borderRadius: BorderRadius.circular(9),
border: Border.all(
color: Colors.black,
),
),
child: Align(
alignment: AlignmentDirectional(-0.45, 0.85),
child: Text(
itemGriddata.name,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFFFFFCFC),
fontWeight: FontWeight.normal,
shadows: [
Shadow(
blurRadius: 8.0,
color: Colors.black,
offset: Offset(1.0, 1.0),
),
],
),
),
),
),
),
);
}
}
这是我要获取数据的页面
import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import '../data/model.dart';
class SinglePage extends StatefulWidget {
@override
_SinglePage createState() => _SinglePage();
final Data data;
SinglePage(this.data);
}
class _SinglePage extends State<SinglePage> {
PageController pageViewController;
bool isFirstButton = false;
bool isSecondButton = false;
@override
void initState() {
super.initState();
pageViewController = PageController(initialPage: 0);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: const Color(0xFF090F13),
automaticallyImplyLeading: true,
title: Text(
itemGriddata.name,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Colors.white,
fontSize: 32,
fontWeight: FontWeight.bold,
),
),
actions: const [],
centerTitle: false,
elevation: 2,
),
backgroundColor: const Color(0xFF262D34),
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 25),
child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Row(
mainAxisSize: MainAxisSize.max,
children: [
Material(
color: Colors.transparent,
elevation: 3,
child: Container(
width: MediaQuery.of(context).size.width,
height: 150,
decoration: BoxDecoration(
color: const Color(0xFF090F13),
image: DecorationImage(
fit: BoxFit.cover,
image: Image.asset(
itemGriddata.backgroundimage,
).image,
),
),
),
),
],
),
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(20, 12, 20, 0),
child: Row(
mainAxisSize: MainAxisSize.max,
children: const [
Text(
'Choose role',
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight: FontWeight.normal,
),
),
],
),
),
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(0, 12, 1, 0),
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 0, 0, 0),
child: InkWell(
onTap: () async {
isSecondButton = false;
isFirstButton = true;
setState(() {});
await pageViewController.animateToPage(
0,
duration: const Duration(milliseconds: 500),
curve: Curves.ease,
);
},
child: Material(
color: Colors.transparent,
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xFF090F13),
borderRadius: BorderRadius.circular(8),
shape: BoxShape.rectangle,
border: isFirstButton
? Border.all(color: Colors.white)
: null),
child: Stack(
children: [
Align(
alignment: const AlignmentDirectional(
0, -0.05),
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Image.asset(
'assets/images/icon-position-jungle.png',
width: 50,
height: 50,
fit: BoxFit.cover,
),
const Padding(
padding: EdgeInsetsDirectional
.fromSTEB(0, 8, 0, 0),
child: AutoSizeText(
'BUILD 1',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight:
FontWeight.normal,
),
),
),
],
),
),
],
),
),
),
),
),
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 0, 0, 0),
child: Material(
color: Colors.transparent,
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xFF090F13),
borderRadius: BorderRadius.circular(8),
border: isSecondButton
? Border.all(color: Colors.white)
: null),
child: InkWell(
onTap: () async {
isSecondButton = true;
isFirstButton = false;
setState(() {});
await pageViewController.animateToPage(
1,
duration:
const Duration(milliseconds: 500),
curve: Curves.ease,
);
},
child: Stack(
children: [
Align(
alignment: const AlignmentDirectional(
0, -0.05),
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Image.asset(
'assets/images/icon-position-jungle.png',
width: 50,
height: 50,
fit: BoxFit.cover,
),
const Padding(
padding: EdgeInsetsDirectional
.fromSTEB(0, 8, 0, 0),
child: AutoSizeText(
'BUILD 2',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight:
FontWeight.normal,
),
),
),
],
),
),
],
),
),
),
),
),
],
),
),
),
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(20, 8, 20, 8),
child: Row(
mainAxisSize: MainAxisSize.max,
children: const [
Text(
'Builds',
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight: FontWeight.normal,
),
),
],
),
),
SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 8, 16, 0),
child: Container(
width: MediaQuery.of(context).size.width,
height: 200,
decoration: BoxDecoration(
color: const Color(0x00090F13),
boxShadow: const [
BoxShadow(
blurRadius: 3,
color: Colors.transparent,
offset: Offset(0, 2),
)
],
borderRadius: BorderRadius.circular(8),
),
child: SizedBox(
width: double.infinity,
height: 500,
child: PageView(
controller: pageViewController,
scrollDirection: Axis.horizontal,
children: [
Image.asset(
'assets/images/image_1.png',
width: 100,
height: 100,
fit: BoxFit.cover,
),
Image.asset(
'assets/images/image_2.png',
width: 100,
height: 100,
fit: BoxFit.scaleDown,
),
],
),
),
),
),
],
),
),
],
),
),
),
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(20, 0, 20, 8),
child: Row(
mainAxisSize: MainAxisSize.max,
children: const [
Text(
'Text',
style: TextStyle(
fontFamily: 'Poppins',
color: Color(0xFF8B97A2),
),
),
],
),
),
],
),
),
);
}
}
这是带有数据的模型
final dynamic itemGriddata = [
Data(
name: "Ahri",
image: "assets/images/Ahri.png",
backgroundimage: "assets/images/Ahri_0.jpg"),
Data(
name: "Akali",
image: "assets/images/Akali.png",
backgroundimage: "assets/images/Akali_0.jpg")
];
class Data {
final String name;
final String image;
final String backgroundimage;
Data({this.name, this.image, this.backgroundimage});
}
问题是您的 SinglePage 小部件有一个名为 final Data data; 的道具，但 _SinglePageState 小部件正在为您的标题和图像调用 itemGriddata。您需要像这样更改代码：
class SinglePage extends StatefulWidget {
const SinglePage(Key? key, this.data): super(key: key);
final Data data;
@override
State<StatefulWidget> createState() => _SinglePageState();
}
class _SinglePageState extends State<SinglePage> {
// use widget.data to get name, image, and backgroundImage
// ex... widget.data.name or widget.data.image
@override
Widget build(BuildContext context) {
return Text(widget.data.name);
}
}
您正在将数据正确传递给 SinglePage，但只需更改几行即可确保您使用实际数据调用某些内容！ :D
我有 gridviewbuilder，它从 itemGriddata 中获取数据，它具有 onTap 函数，可将其定向到一个新页面，该页面也从该模型中获取数据，但是当我单击它时，标题中出现错误，任何帮助或某种帮助启蒙将不胜感激
这是 gridview 页面
import 'package:flutter/material.dart';
import 'package:wild_wild_rift/builds/SinglePage.dart';
import 'package:wild_wild_rift/data/model.dart';
import 'package:google_fonts/google_fonts.dart';
class GridViewPage extends StatefulWidget {
@override
_GridViewPage createState() => _GridViewPage();
}
class _GridViewPage extends State<GridViewPage> {
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: Colors.grey,
automaticallyImplyLeading: true,
title: const Text(
'Champions',
style: TextStyle(
fontFamily: 'Lexend Doca',
color: Colors.white,
fontSize: 32,
fontWeight: FontWeight.bold,
),
),
elevation: 2,
),
body: Column(
mainAxisSize: MainAxisSize.max,
children: [
Expanded(
child: Padding(
padding: const EdgeInsetsDirectional.fromSTEB(15, 15, 15, 15),
child: GridView.builder(
itemCount: itemGriddata.length,
gridDelegate: const SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount: 4,
crossAxisSpacing: 10,
mainAxisSpacing: 10,
childAspectRatio: 1,
),
itemBuilder: (context, index) {
return GridSingleItem(
itemGriddata: itemGriddata[index],
onTap: () async {
Navigator.push(
context,
MaterialPageRoute(
builder: (context) => SinglePage(itemGriddata[index])));
},
);
},
),
),
),
],
));
}
}
class GridSingleItem extends StatelessWidget {
final itemGriddata;
final Function onTap;
const GridSingleItem({Key key, @required this.itemGriddata, this.onTap})
: super(key: key);
@override
Widget build(BuildContext context) {
return InkWell(
onTap: onTap,
child: ClipRRect(
borderRadius: BorderRadius.circular(5),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xEEEEEE),
image: DecorationImage(
fit: BoxFit.cover,
image: Image.asset(itemGriddata.image).image,
),
boxShadow: const [
BoxShadow(
blurRadius: 3,
color: Color(0xDA000000),
)
],
borderRadius: BorderRadius.circular(9),
border: Border.all(
color: Colors.black,
),
),
child: Align(
alignment: AlignmentDirectional(-0.45, 0.85),
child: Text(
itemGriddata.name,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFFFFFCFC),
fontWeight: FontWeight.normal,
shadows: [
Shadow(
blurRadius: 8.0,
color: Colors.black,
offset: Offset(1.0, 1.0),
),
],
),
),
),
),
),
);
}
}
这是我要获取数据的页面
import 'package:auto_size_text/auto_size_text.dart';
import 'package:flutter/material.dart';
import '../data/model.dart';
class SinglePage extends StatefulWidget {
@override
_SinglePage createState() => _SinglePage();
final Data data;
SinglePage(this.data);
}
class _SinglePage extends State<SinglePage> {
PageController pageViewController;
bool isFirstButton = false;
bool isSecondButton = false;
@override
void initState() {
super.initState();
pageViewController = PageController(initialPage: 0);
}
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
backgroundColor: const Color(0xFF090F13),
automaticallyImplyLeading: true,
title: Text(
itemGriddata.name,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Colors.white,
fontSize: 32,
fontWeight: FontWeight.bold,
),
),
actions: const [],
centerTitle: false,
elevation: 2,
),
backgroundColor: const Color(0xFF262D34),
body: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(0, 0, 0, 25),
child: SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Row(
mainAxisSize: MainAxisSize.max,
children: [
Material(
color: Colors.transparent,
elevation: 3,
child: Container(
width: MediaQuery.of(context).size.width,
height: 150,
decoration: BoxDecoration(
color: const Color(0xFF090F13),
image: DecorationImage(
fit: BoxFit.cover,
image: Image.asset(
itemGriddata.backgroundimage,
).image,
),
),
),
),
],
),
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(20, 12, 20, 0),
child: Row(
mainAxisSize: MainAxisSize.max,
children: const [
Text(
'Choose role',
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight: FontWeight.normal,
),
),
],
),
),
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(0, 12, 1, 0),
child: SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 0, 0, 0),
child: InkWell(
onTap: () async {
isSecondButton = false;
isFirstButton = true;
setState(() {});
await pageViewController.animateToPage(
0,
duration: const Duration(milliseconds: 500),
curve: Curves.ease,
);
},
child: Material(
color: Colors.transparent,
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xFF090F13),
borderRadius: BorderRadius.circular(8),
shape: BoxShape.rectangle,
border: isFirstButton
? Border.all(color: Colors.white)
: null),
child: Stack(
children: [
Align(
alignment: const AlignmentDirectional(
0, -0.05),
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Image.asset(
'assets/images/icon-position-jungle.png',
width: 50,
height: 50,
fit: BoxFit.cover,
),
const Padding(
padding: EdgeInsetsDirectional
.fromSTEB(0, 8, 0, 0),
child: AutoSizeText(
'BUILD 1',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight:
FontWeight.normal,
),
),
),
],
),
),
],
),
),
),
),
),
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 0, 0, 0),
child: Material(
color: Colors.transparent,
elevation: 2,
shape: RoundedRectangleBorder(
borderRadius: BorderRadius.circular(8),
),
child: Container(
width: 100,
height: 100,
decoration: BoxDecoration(
color: const Color(0xFF090F13),
borderRadius: BorderRadius.circular(8),
border: isSecondButton
? Border.all(color: Colors.white)
: null),
child: InkWell(
onTap: () async {
isSecondButton = true;
isFirstButton = false;
setState(() {});
await pageViewController.animateToPage(
1,
duration:
const Duration(milliseconds: 500),
curve: Curves.ease,
);
},
child: Stack(
children: [
Align(
alignment: const AlignmentDirectional(
0, -0.05),
child: Column(
mainAxisSize: MainAxisSize.max,
mainAxisAlignment:
MainAxisAlignment.center,
children: [
Image.asset(
'assets/images/icon-position-jungle.png',
width: 50,
height: 50,
fit: BoxFit.cover,
),
const Padding(
padding: EdgeInsetsDirectional
.fromSTEB(0, 8, 0, 0),
child: AutoSizeText(
'BUILD 2',
textAlign: TextAlign.center,
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight:
FontWeight.normal,
),
),
),
],
),
),
],
),
),
),
),
),
],
),
),
),
Padding(
padding:
const EdgeInsetsDirectional.fromSTEB(20, 8, 20, 8),
child: Row(
mainAxisSize: MainAxisSize.max,
children: const [
Text(
'Builds',
style: TextStyle(
fontFamily: 'Lexend Deca',
color: Color(0xFF8B97A2),
fontSize: 14,
fontWeight: FontWeight.normal,
),
),
],
),
),
SingleChildScrollView(
child: Column(
mainAxisSize: MainAxisSize.max,
children: [
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(
16, 8, 16, 0),
child: Container(
width: MediaQuery.of(context).size.width,
height: 200,
decoration: BoxDecoration(
color: const Color(0x00090F13),
boxShadow: const [
BoxShadow(
blurRadius: 3,
color: Colors.transparent,
offset: Offset(0, 2),
)
],
borderRadius: BorderRadius.circular(8),
),
child: SizedBox(
width: double.infinity,
height: 500,
child: PageView(
controller: pageViewController,
scrollDirection: Axis.horizontal,
children: [
Image.asset(
'assets/images/image_1.png',
width: 100,
height: 100,
fit: BoxFit.cover,
),
Image.asset(
'assets/images/image_2.png',
width: 100,
height: 100,
fit: BoxFit.scaleDown,
),
],
),
),
),
),
],
),
),
],
),
),
),
Padding(
padding: const EdgeInsetsDirectional.fromSTEB(20, 0, 20, 8),
child: Row(
mainAxisSize: MainAxisSize.max,
children: const [
Text(
'Text',
style: TextStyle(
fontFamily: 'Poppins',
color: Color(0xFF8B97A2),
),
),
],
),
),
],
),
),
);
}
}
这是带有数据的模型
final dynamic itemGriddata = [
Data(
name: "Ahri",
image: "assets/images/Ahri.png",
backgroundimage: "assets/images/Ahri_0.jpg"),
Data(
name: "Akali",
image: "assets/images/Akali.png",
backgroundimage: "assets/images/Akali_0.jpg")
];
class Data {
final String name;
final String image;
final String backgroundimage;
Data({this.name, this.image, this.backgroundimage});
}
问题是您的 SinglePage 小部件有一个名为 final Data data; 的道具，但 _SinglePageState 小部件正在为您的标题和图像调用 itemGriddata。您需要像这样更改代码：
class SinglePage extends StatefulWidget {
const SinglePage(Key? key, this.data): super(key: key);
final Data data;
@override
State<StatefulWidget> createState() => _SinglePageState();
}
class _SinglePageState extends State<SinglePage> {
// use widget.data to get name, image, and backgroundImage
// ex... widget.data.name or widget.data.image
@override
Widget build(BuildContext context) {
return Text(widget.data.name);
}
}
您正在将数据正确传递给 SinglePage，但只需更改几行即可确保您使用实际数据调用某些内容！ :D