问题
class MyHome extends StatefulWidget {
@override
State<StatefulWidget> createState() => new MyHomePage2();
}
class MyHomePage2 extends State<MyHome> {
List items = new List();
buildlist(String s) {
setState(() {
print("entered buildlist" + s);
List refresh = new List();
if (s == 'button0') {
refresh = [
new Refreshments("Watermelon", 250),
new Refreshments("Orange", 275),
new Refreshments("Pine", 300),
new Refreshments("Papaya", 225),
new Refreshments("Apple", 250),
];
} else if (s == 'button1') {
refresh = [
new Refreshments("Pina Colada", 250),
new Refreshments("Bloody Mary", 275),
new Refreshments("Long Island Ice tea", 300),
new Refreshments("Screwdriver", 225),
new Refreshments("Fusion Cocktail", 250),
];
} else if (s == 'button2') {
refresh = [
new Refreshments("Virgin Pina Colada", 250),
new Refreshments("Virgin Mary", 275),
new Refreshments("Strawberry Flush", 300),
new Refreshments("Mango Diver", 225),
new Refreshments("Peach Delight", 250),
];
} else {
refresh = [
new Refreshments("Absolute", 250),
new Refreshments("Smirnoff", 275),
new Refreshments("White Mischief", 300),
new Refreshments("Romanov", 225),
new Refreshments("Blender's Pride", 250),
];
}
for (var item in refresh) {
items.add(new ItemsList(item));
}
});
}
@override
Widget build(BuildContext context) {
var abc = MediaQuery.of(context).size;
print(abc.width);
var width = abc.width / 4;
Text text = new Text("Dev");
Text text2 = new Text("Sneha");
Text text3 = new Text("Prashant");
Text text4 = new Text("Vikesh");
var pad = const EdgeInsets.all(10.0);
Padding pad1 = new Padding(child: text, padding: pad);
Padding pad2 = new Padding(child: text2, padding: pad);
Padding pad3 = new Padding(child: text3, padding: pad);
Padding pad4 = new Padding(child: text4, padding: pad);
ListView listView = new ListView(children: <Widget>[
new Image.asset('images/party.jpg'),
pad1,
pad2,
pad3,
pad4
]);
Drawer drawer = new Drawer(child: listView);
return new Scaffold(
drawer: drawer,
appBar: new AppBar(
title: new Text('Booze Up'),
),
body: new Column(children: <Widget>[
new ListView.builder(
scrollDirection: Axis.horizontal,
itemCount: 4,
itemBuilder: (BuildContext context, int index) {
return new Column(children: <Widget>[
new Container(
child: new Flexible(
child: new FlatButton(
child: new Image.asset('images/party.jpg',
width: width, height: width),
onPressed: buildlist('button' + index.toString()),
)),
width: width,
height: width,
)
]);
},
),
new Expanded(
child: new ListView(
padding: new EdgeInsets.fromLTRB(10.0, 10.0, 0.0, 10.0),
children: items,
scrollDirection: Axis.vertical,
)),
]),
floatingActionButton: new FloatingActionButton(
onPressed: null,
child: new Icon(Icons.add),
), // This trailing comma makes auto-formatting nicer for build methods.
);
}
}
class Refreshments {
String name;
int price;
Refreshments(this.name, this.price);
}
class ItemsList extends StatelessWidget {
final Refreshments refreshments;
ItemsList(this.refreshments);
@override
Widget build(BuildContext context) {
return new ListTile(
onTap: null,
title: new Text(refreshments.name),
);
}
}
Formatted by DartPad ;-)
I am having two errors:
1] Horizontal viewport was given unbounded height . A horizontal viewport was given an unlimited amount of vertical space in which to expand.
2] setState() or markNeedsBuild called during build A vertical renderflex overflowed by 99488 pixels.
Please help me with it . I am creating this app where on each image click a list should be shown below . The images will be in a row and the list should be shown below the row.
Thank you.
回答1:
I have recreated what you are trying to do, with only two of your Refreshment items, you probably want to refactor things and handle the layout in a better way, but just for the sake of simplicity try to follow this example and compare it to what you are trying to achieve:
import "package:flutter/material.dart";
class LetsParty extends StatefulWidget {
@override
_LetsPartyState createState() => new _LetsPartyState();
}
class _LetsPartyState extends State<LetsParty> {
Image _partyImage = new Image.network(
"http://www.freshcardsgifts.co.uk/images/_lib/animal-party-greetings-card-3003237-0-1344698261000.jpg");
final GlobalKey<ScaffoldState> scaffoldKey = new GlobalKey<ScaffoldState>();
List<List> list = [
["Pina Colada",
"Bloody Mary",
"Strawberry Flush",
"Mango Diver",
"Peach Delight"
],
[
"Absolute",
"Smirnoff",
"White Mischief",
"Romanov",
"Blender's Pride"
]
];
List<String> visibleList = null;
@override
Widget build(BuildContext context) {
return new Scaffold(
key: scaffoldKey,
appBar: new AppBar(title: new Text("Let's Party"),),
body: new ListView(
// shrinkWrap: true,
children: <Widget>[
new Container (
height: 150.0,
child: new ListView.builder(
shrinkWrap: true,
scrollDirection: Axis.horizontal,
itemCount: 2, //add the length of your list here
itemBuilder: (BuildContext context, int index) {
return new Column(
children: <Widget>[
///Flexible let's your widget flex in the given space, dealing with the overflow you have
// new Flexible(child: new FlatButton(onPressed: ()=>print("You pressed Image No.$index"), child: _partyImage)),
new Flexible (child: new Container(
child: new FlatButton(onPressed: () {
scaffoldKey.currentState.showSnackBar(
new SnackBar(
content: new Text(
"You pressed Image No.$index")));
setState(() {
visibleList = list[index];
});
},
child: _partyImage),
width: 100.0,
height: 100.0
),),
//Exact width and height, consider adding Flexible as a parent to the Container
new Text("Text$index"),
],
);
})),
new Column(children: visibleList==null?new List():new List.generate(5, (int i) {
new ListTile(title: new Text(visibleList[i]),
onTap: () =>
scaffoldKey.currentState.showSnackBar(new SnackBar(
content: new Text("Your choise is ${visibleList[i]}"),)),
);
}))
],),);
}
}
回答2:
Your code
onPressed: buildlist('button'+index.toString()),
executes buildlist() and passes the result to onPressed, but that is not the desired behavior.
It should be
onPressed: () => buildlist('button'+index.toString()),
This way a function (closure) is passed to onPressed, that when executed, calls buildlist()
来源：https://stackoverflow.com/questions/47592301/setstate-or-markneedsbuild-called-during-build