How to display data from nested list in Flutter - flutter

Question

When I try display data from nested list it gives me that data which is not list at all.
Please help how to get that options data as list and display on Flutter widget.
class QuizData {
List<BrainData> getData = [
BrainData(
questionID: "biology1",
question:
"Pine, fir, spruce, cedar, larch and cypress are the famous timber-yielding plants of which several also occur widely in the hilly regions of India. All these belong to",
options: [
"angiosperms",
"gymnosperms",
"monocotyledons",
"dicotyledons",
],
answer: [false, true, false, false],
),
];
}

Answer 1

From the question, I have created a sample example for you.
import 'package:flutter/material.dart';
void main() {
runApp(MyApp());
}
class MyApp extends StatelessWidget {
#override
Widget build(BuildContext context) {
return MaterialApp(
debugShowCheckedModeBanner: false,
title: 'Test App',
theme: ThemeData(
primarySwatch: Colors.blue,
visualDensity: VisualDensity.adaptivePlatformDensity,
),
home: const MyHomePage(),
);
}
}
class MyHomePage extends StatefulWidget {
const MyHomePage({Key? key}) : super(key: key);
#override
_MyHomePageState createState() => _MyHomePageState();
}
class _MyHomePageState extends State<MyHomePage> {
final GlobalKey<ScaffoldState> _scaffoldKey = new GlobalKey<ScaffoldState>();
List<BrainData> list = [];
var selectedValue;
List<BrainData> getData = [
BrainData(
questionID: "biology1",
question:
"Pine, fir, spruce, cedar, larch and cypress are the famous timber-yielding plants of which several also occur widely in the hilly regions of India. All these belong to",
options: [
"angiosperms",
"gymnosperms",
"monocotyledons",
"dicotyledons",
],
answer: [false, true, false, false],
),
];
#override
void initState() {
super.initState();
setState(() {
list = getData;
});
}
void showInSnackBar(String value, bool isCorrect) {
ScaffoldMessenger.of(context).showSnackBar(SnackBar(
backgroundColor: isCorrect ? Colors.green : Colors.red,
content: Text(value),
duration: const Duration(milliseconds: 200),
));
}
#override
Widget build(BuildContext context) {
return Scaffold(
key: _scaffoldKey,
body: list.isEmpty
? Container()
: ListView.builder(
itemCount: list.length,
itemBuilder: (context, index) {
var item = list[index];
return Column(
children: [
Padding(
padding: const EdgeInsets.all(15.0),
child: Text('${index + 1} : ${item.question}'),
),
Padding(
padding: const EdgeInsets.all(8.0),
child: Column(
children: item.options.map((e) {
return RadioListTile(
title: Text(e),
value: e,
groupValue: selectedValue,
onChanged: (value) {
setState(() {
selectedValue = value;
var correctAnswerIndex = item.answer.indexWhere((element) => element == true);
var selectedItemIndex =
item.options.indexWhere((element) => element == value);
if (correctAnswerIndex == selectedItemIndex) {
showInSnackBar('Selected Correct Value', true);
} else {
showInSnackBar('Better luck next time', false);
}
});
},
);
}).toList(),
),
)
],
);
}),
);
}
}
class BrainData {
final String questionID;
final String question;
final List<String> options;
final List<bool> answer;
BrainData({
required this.questionID,
required this.question,
required this.options,
required this.answer,
});
}
This is the Sample UI:
Check the example and let me know if it works for you.