【发布时间】:2020-02-23 13:20:28
【问题描述】:
背景
我正在开发一个应用程序来帮助小学教师。 这个应用程序允许用户从字母表中选择字母,当他们继续到下一个屏幕时,他们选择的字母应该显示为可翻转的卡片。一侧有字母,另一侧有图像。 这些卡片应该占据整个屏幕,用户可以滑动到下一张卡片。
问题
当用户选择多个字母时,它们会被输入到一个列表中。当他们点击按钮移动到下一个屏幕(带有可翻转卡片)时,他们会收到以下错误消息:
“类型'_InternalLinkedHashMap>'不是类型'List'的子类型”
守则
以下是字母选择屏幕的代码:
import 'package:flutter/material.dart';
import 'package:project_teacher/pages/allcards.dart';
class ChooseLetters extends StatefulWidget {
@override
_ChooseLettersState createState() => _ChooseLettersState();
}
class _ChooseLettersState extends State<ChooseLetters> {
List<String> alphabets = ['a','b','c','d','e','f',
'g','h','i','j','k','l','m','n','o','p',
'q','r','s','t','u','v','w','x','y','z'],
selection = [];
List alphabetCards = [AlphabetCard(),BAlphabetCard(),CAlphabetCard(),DAlphabetCard(),EAlphabetCard(),FAlphabetCard(),
GAlphabetCard(),HAlphabetCard(),IAlphabetCard(),JAlphabetCard(),KAlphabetCard(),LAlphabetCard(),MAlphabetCard(),NAlphabetCard(),OAlphabetCard(),PAlphabetCard(),
QAlphabetCard(),RAlphabetCard(),SAlphabetCard(),TAlphabetCard(),UAlphabetCard(),VAlphabetCard(),WAlphabetCard(),XAlphabetCard(),YAlphabetCard(),ZAlphabetCard()],
selectionCards = [];
@override
void initState(){
super.initState();
}
@override
Widget build(BuildContext context) {
return Scaffold(
body: Container(
decoration: BoxDecoration(
gradient: LinearGradient(
begin: Alignment.bottomLeft,
end: Alignment.topRight,
colors: [Colors.blueGrey[300], Colors.blueGrey])
),
padding:EdgeInsets.all(15),
alignment: Alignment.center,
child:GridView.builder(
gridDelegate:SliverGridDelegateWithFixedCrossAxisCount(
crossAxisCount:4,
mainAxisSpacing: 10, crossAxisSpacing: 10,
),
itemCount:alphabetCards.length,
itemBuilder:(con,ind){
return InkWell(
onTap:(){
setState((){
if(selectionCards.contains(alphabetCards[ind]))
selectionCards.remove(alphabetCards[ind]);
else
selectionCards.add(alphabetCards[ind]);
});
print(selectionCards);
},
child: Container(
padding:EdgeInsets.all(10),
alignment:Alignment.center,
decoration:BoxDecoration(
color:selectionCards.contains(alphabetCards[ind]) ? Colors.orange : Colors.white,
borderRadius:BorderRadius.circular(0)
),
child:Text(alphabets[ind],
style: TextStyle(
color:Colors.black,
fontSize: 50
)
)
),
);
},
),
),
floatingActionButton: FloatingActionButton(
onPressed: () {
Navigator.pushNamed(context, '/tabbedcards', arguments: {
'selectionOfCards': selectionCards
});
},
backgroundColor: Colors.red,
),
);
}
}
这是可翻转卡片屏幕的代码:
import 'package:flutter/material.dart';
class TabbedCards extends StatefulWidget {
@override
_TabbedCardsState createState() => _TabbedCardsState();
}
class _TabbedCardsState extends State<TabbedCards> {
List selectionOfCards;
@override
Widget build(BuildContext context) {
selectionOfCards = ModalRoute.of(context).settings.arguments;
return MaterialApp(
home: DefaultTabController(
length: selectionOfCards.length,
child: Scaffold(
body: TabBarView(
children: selectionOfCards
),
),
),
);
}
}
感谢您的阅读以及您可能提供的任何帮助。
【问题讨论】: