I want every abcdLine
's items characters
in new line(vertically scrollable), and all items of characters
should be horizontally scrollable in flutter application. I tried with Listview.builder()
, but I couldn't get what I want.
List abcdLine = [
{
'characters': ['Ka','Ka','Ki','Kee','Ku','Koo','Ke','Kai','Ko','Kau','Kam','Kah'],
},
{
'characters': ['Kha','Kha','Khi','Khee','Khu','Khoo','Khe','Khai','Kho','Khau','Kham','Khah'],
},
{
'characters': ['Ga','Ga','Gi','Gee','Gu','Goo','Ge','Gai','Go','Gau','Gam','Gah'],
},
],
What is better way? Hope, I could clear.
I also tried using GridView
and ListView
but, that did not work.
You can use ListView for Parent and for characters
you can use SingleChildScrolView(child:Row(....))
or You can ListView with fixedHeight, both case scrollDirection: Axis.horizontal,
return Scaffold(
body: ListView(
children: [
...abcdLine.map((e) {
return SingleChildScrollView(
// you can ListView with horizontal direction with Fixed height
scrollDirection: Axis.horizontal,
child: Row(
children: [
...e['characters']?.map((e) {
return Container(
width: 100,
height: 100,
color: Colors.primaries[
(e.length * 1000) % Colors.primaries.length],
alignment: Alignment.center,
child: Text(e),
);
}).toList() ??
[],
],
),
);
}).toList(),
],
),
);