我如何在扑动中获取多个列表数据到单个屏幕?

Question

我正在制作一个在网格视图中有多个主题的扑动测验应用程序。每个网格重定向到一个屏幕，一个接一个从列表中获取数据。我想做的:每当我点击一个网格视图，它重定向到一个屏幕，并从相应的列表中获取数据。

我想去一个单一的屏幕，每当我点击网格视图，但它应该显示数据从列表相对于网格视图用户点击。

网格视图示例

这是一个网格视图示例，每个数字代表一个不同的主题。

final first = const [
{
'question': 'How long is New Zealand’s Ninety Mile Beach?',
'answers': [
{'answerText': '88km, so 55 miles long.', 'score': true},
{'answerText': '55km, so 34 miles long.', 'score': false},
{'answerText': '90km, so 56 miles long.', 'score': false},
],
},
{
'question':
'In which month does the German festival of Oktoberfest mostly take place?',
'answers': [
{'answerText': 'January', 'score': false},
{'answerText': 'October', 'score': false},
{'answerText': 'September', 'score': true},
],
},
{
'question': 'Who composed the music for Sonic the Hedgehog 3?',
'answers': [
{'answerText': 'Britney Spears', 'score': false},
{'answerText': 'Timbaland', 'score': false},
{'answerText': 'Michael Jackson', 'score': true},
],
},
];

final second = const [
{
'question': 'In Georgia (the state), it’s illegal to eat what with a fork?',
'answers': [
{'answerText': 'Hamburgers', 'score': false},
{'answerText': 'Fried chicken', 'score': true},
{'answerText': 'Pizza', 'score': false},
],
},
{
'question':
'Which part of his body did musician Gene Simmons from Kiss insure for one million dollars?',
'answers': [
{'answerText': 'His tongue', 'score': true},
{'answerText': 'His leg', 'score': false},
{'answerText': 'His butt', 'score': false},
],
},
{
'question': 'In which country are Panama hats made?',
'answers': [
{'answerText': 'Ecuador', 'score': true},
{'answerText': 'Panama (duh)', 'score': false},
{'answerText': 'Portugal', 'score': false},
],
},
{
'question': 'From which country do French fries originate?',
'answers': [
{'answerText': 'Belgium', 'score': true},
{'answerText': 'France', 'score': false},
{'answerText': 'Switzerland', 'score': false},
],
},
];

Answer 1

用手势检测器包装代码。

class MyWidget extends StatelessWidget {
@override
Widget build(BuildContext context) {
return GridView.count(
// Create a grid with 2 columns. If you change the scrollDirection to
// horizontal, this produces 2 rows.
crossAxisCount: 2,
mainAxisSpacing: 20,
crossAxisSpacing: 20,
// Generate 100 widgets that display their index in the List.
children: List.generate(5, (index) {
return GestureDetector(
onTap: () {
Navigator.of(context).push(MaterialPageRoute(
builder: (context) => NewQuestionPage(
questionId: index.toString(),
)));
},
child: Container(
color: Colors.green,
height: 100,
child: Center(
child: Text(
'Item $index',
style: Theme.of(context).textTheme.headline5,
),
),
),
);
}),
);
;
}
}
class NewQuestionPage extends StatelessWidget {
final String? questionId;
const NewQuestionPage({Key? key, this.questionId}) : super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text("Questions"),
),
body: Center(child: Text(questionId!)),
);
}
}