How to use Wrap widget inside column widget in flutter - flutter

Question

I want to display items in a row using wrap widget, my code stack look like this
column>padding>wrap
and its output is this
i want them i row like in this tutorial
here is the code:
customExpansionTile(context, "Token Distribution Time", true,
Icon(Icons.info_rounded, color: HexColor("#5344ed")), <Widget>[
SizedBox10(),
Container(
// padding: EdgeInsets.only(right: 70),
child: Row(
children: [
Expanded(
child: SizedBox(
child: ListTile(
//font change
title: ListView.builder(
itemCount: checkBoxListTileModel.length,
itemBuilder: (BuildContext context, int index) {
return new Card(
child: new Container(
padding: new EdgeInsets.all(10.0),
child: Column(
children: <Widget>[
new CheckboxListTile(
controlAffinity:
ListTileControlAffinity.leading,
activeColor: HexColor("#5344ed"),
dense: true,
//font change
title: new Text(
checkBoxListTileModel[index].title,
value: checkBoxListTileModel[index]
.isCheck,
secondary: Padding(
padding: EdgeInsets.only(left: 1),
child: Container(
child:
checkBoxListTileModel[index].isCheck ==true?
Container(
child: TextButton(
onPressed: () {
_getSelectedRowInfo(
checkBoxListTileModel[index].title);
},
child: Center(
child: Text(
"Pick time",),
),
)
: null),
),
onChanged: (bool? val) {
itemChange1(val!, index);
}),
Padding(
padding: const EdgeInsets.fromLTRB(0, 8, 160, 0),
//here i am using wrap widget
child: Wrap(
children:[
Container(
child:checkBoxListTileModel[index]
.isCheck? Tags(
itemCount: _timingTagsList.length, // required
itemBuilder: (int index){
final item = _timingTagsList[index];
return ItemTags(
key: Key(index.toString()),
color:HexColor("#5344ed"),
index: index, // required
title: _timingTagsList[0],
textStyle: TextStyle( fontSize: 14, ),
combine: ItemTagsCombine.withTextBefore,
removeButton: ItemTagsRemoveButton(
onRemoved: (){
setState(() {
_timingTagsList.removeAt(index);
});
return true;
},
),
onPressed: (item) => print(item),
onLongPressed: (item) => print(item),
);
},):Padding(
padding: const EdgeInsets.only(left: 70),
child:
Row(crossAxisAlignment: CrossAxisAlignment.center, children: []))
),
]),
)]),
),
);
}),
))),
SizedBox(
width: 10,
),
],
))

Answer 1

User direction in Horizontal
Wrap(
direction:Axis.horizontal,
children:[
//.....
]
)

Answer 2

Try below code hope its helpful to you refer Wrap widget here
Wrap(
// direction: Axis.vertical,
children: <Widget>[
Container(
color: Colors.blue,
width: 100,
height: 100,
child: Center(
child: Text(
"W1",
textScaleFactor: 2.5,
),
),
),
Container(
color: Colors.red,
width: 100,
height: 100,
child: Center(
child: Text(
"W2",
textScaleFactor: 2.5,
),
),
),
Container(
color: Colors.teal,
width: 100,
height: 100,
child: Center(
child: Text(
"W3",
textScaleFactor: 2.5,
),
),
),
Container(
color: Colors.indigo,
width: 100,
height: 100,
child: Center(
child: Text(
"W4",
textScaleFactor: 2.5,
),
),
),
Container(
color: Colors.orange,
width: 100,
height: 100,
child: Center(
child: Text(
"W5",
textScaleFactor: 2.5,
),
),
),
],
)
Your result screen horizontal Axis direction ->
Your Screen vertical Axis Direction->