how to create a row of scrollable text boxes or widgets in flutter inside a ListView?
I think this is straightforward as long as you put a container of fixed height on your horizontal ListView
. But maybe I'm not understanding your question. Please post your code and the error message you're getting if this doesn't work.
import 'package:flutter/material.dart';
import 'package:flutter/gestures.dart';
import 'dart:collection';
void main() {
runApp(new MaterialApp(home: new DemoApp()));
}
class DemoApp extends StatelessWidget {
@override
Widget build(BuildContext context) {
return new Scaffold(
appBar: new AppBar(title: new Text('Nested ListView Example')),
body: new Center(
child: new ListView(
children: <Widget>[
new Container(
height: 80.0,
child: new ListView(
scrollDirection: Axis.horizontal,
children: new List.generate(10, (int index) {
return new Card(
color: Colors.blue[index * 100],
child: new Container(
width: 50.0,
height: 50.0,
child: new Text("$index"),
),
);
}),
),
),
],
),
),
);
}
}
I have done this to make my Row widget scrollable:
Text("Debilidades",
style: TextStyle(fontWeight: FontWeight.bold)),
SingleChildScrollView(
scrollDirection: Axis.horizontal,
padding: EdgeInsets.fromLTRB(10.0, 0.0, 10.0, 0.0),
child: Row(
mainAxisAlignment: MainAxisAlignment.spaceEvenly,
children: pokemon.weaknesses == null
? <Widget>[
Text(
"No tiene debilidades",
style: TextStyle(color: Colors.grey),
)
]
: pokemon.weaknesses
.map((weakness) => FilterChip(
backgroundColor: Colors.red,
label: Text(
weakness,
style: TextStyle(color: Colors.white),
),
onSelected: (b) {}))
.toList()),
),
For a row/column to scroll you can simply use the SingleChildScrollView
feature and mention the direction as required.
SingleChildScrollView(
scrollDirection: Axis.horizontal,
child: Row(
children: [
//provide all the things u want to horizontally scroll here
]
),
);