Reputation: 429
I'm trying to build the app from this image, but when i put the ListView in the same page with this Expansion Tile the screen become empty.
I added shrinkwrap: true
and worked, but now I have a new problem, bottom overflowed when I open the ExpansionTile or when I have many option on ListView
Follow is the tried code: I'll make a ListBuilder after
class HomeState extends State<Teste>{
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text (""),
),
body: Container(
padding: EdgeInsets.all(15.0),
child: Column(
children: <Widget>[
CardList(),
MyList()
],
),
),
);
}
}
Widget CardList(){
return new Flexible(
child: Card(
child: ExpansionTile(
title: Text("Periodo",
style: new TextStyle(
),textAlign: TextAlign.center,
),
children: <Widget>[
ListTile(
title: Text("Periodo 1",textAlign: TextAlign.center,),
),
ListTile(
title: Text("Periodo 2",textAlign: TextAlign.center,),
),
ListTile(
title: Text("Periodo 3",textAlign: TextAlign.center,),
),
ListTile(
title: Text("Periodo 4",textAlign: TextAlign.center,),
),
ListTile(
title: Text("Periodo 5",textAlign: TextAlign.center,),
),ListTile(
title: Text("Periodo 6",textAlign: TextAlign.center,),
),ListTile(
title: Text("Periodo 7",textAlign: TextAlign.center,),
),ListTile(
title: Text("Periodo 8",textAlign: TextAlign.center,),
),
],
),
)
);
}
Widget MyList(){
return new ListView(
scrollDirection: Axis.vertical,
shrinkWrap: true,
children: <Widget>[
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
Divider(),
ListTile(title: Text("Teste",textAlign: TextAlign.center,),),
],
);
}
Upvotes: 2
Views: 12614
Reputation: 51176
Updated Code with no Error -
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(
title: Text(""),
),
body: Container(
padding: EdgeInsets.all(15.0),
child: Column(
children: <Widget>[Flexible(child: CardList()), Flexible(child: MyList())],
),
),
);
}
}
Widget CardList() {
return SingleChildScrollView(
child: Card(
child: ExpansionTile(
title: Text(
"Periodo",
style: new TextStyle(),
textAlign: TextAlign.center,
),
children: <Widget>[
ListTile(
title: Text(
"Periodo 1",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 2",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 3",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 4",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 5",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 6",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 7",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 8",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 9",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 10",
textAlign: TextAlign.center,
),
),
ListTile(
title: Text(
"Periodo 11",
textAlign: TextAlign.center,
),
),
],
),
),
);
}
Widget MyList() {
return new ListView(
shrinkWrap: true,
children: <Widget>[
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
Divider(),
ListTile(
title: Text(
"Teste",
textAlign: TextAlign.center,
),
),
],
);
}
Upvotes: 4