颤振:如何在不进行API调用的情况下重新呈现视图?
所以我有一段代码,可以获取从一个地方到另一个地方的路线。 请看下面的图片 我需要为每个旅程添加隐藏的细节,除非单击“细节”按钮,否则我想在ExpansionFile/ExpansionPanel中显示数据-基本上是一个正在折叠的元素 问题是,当我使用按钮上的颤振:如何在不进行API调用的情况下重新呈现视图?,api,flutter,dart,Api,Flutter,Dart,所以我有一段代码,可以获取从一个地方到另一个地方的路线。 请看下面的图片 我需要为每个旅程添加隐藏的细节,除非单击“细节”按钮,否则我想在ExpansionFile/ExpansionPanel中显示数据-基本上是一个正在折叠的元素 问题是,当我使用按钮上的setState(){…}时,它确实会显示数据,但也会再次调用API 方法getData()在构建小部件中被触发,这就是为什么(我想)会发生这种情况,但我不知道如何解决这个问题 有更好的方法吗 对于任何帮助/改进,我们将不胜感激,因为我是新来
setState(){…}
时,它确实会显示数据,但也会再次调用API
方法getData()
在构建小部件中被触发,这就是为什么(我想)会发生这种情况,但我不知道如何解决这个问题
有更好的方法吗
对于任何帮助/改进,我们将不胜感激,因为我是新来的颤振=)
。。。
类(州){
字符串数据;
最终来自;
最终目的地;
最终类型;
最后一次;
静态变量date=new DateTime.now();
最终字符串formattedDate=新的日期格式(“yyyy-MM-dd”)。格式(日期);
double _animatedHeight=100.0;
地图日志数据;
_计划旅程(this.from,this.to,this.type,this.time);
Future getData()异步{
http.Response-Response=等待http.get(url);
data=response.body;
journeyData=json.decode(数据);
debugPrint(journeyData.toString());
}
@凌驾
小部件构建(构建上下文){
返回脚手架(
appBar:appBar(
标题:Text('计划旅程'.toUpperCase(),
样式:TextStyle(
颜色:颜色,黑色,
尺寸:20,
fontWeight:fontWeight.bold
)
),
iconTheme:IconThemeData(
颜色:颜色(0xFF0984e3),
),
背景颜色:Colors.white,
),
resizeToAvoidBottomPadding:false,
正文:SingleChildScrollView(
子:约束框(
约束:BoxConstraints(),
孩子:未来建设者(
future:getData(),
生成器:(BuildContext上下文,异步快照){
if(snapshot.connectionState==connectionState.done){
列表元素=新列表();
对于(var i=0;i...
class _PlanJourney extends State<PlanJourney> {
String data;
final from;
final to;
final type;
final time;
static var date = new DateTime.now();
final String formattedDate = new DateFormat('yyyy-MM-dd').format(date);
double _animatedHeight = 100.0;
Map<String,dynamic> journeyData;
_PlanJourney(this.from, this.to, this.type, this.time);
Future<String> getData() async {
http.Response response = await http.get(url);
data = response.body;
journeyData = json.decode(data);
debugPrint(journeyData.toString());
}
@override
Widget build(BuildContext context){
return Scaffold(
appBar: AppBar(
title: Text('Plan a journey'.toUpperCase(),
style: TextStyle(
color: Colors.black,
fontSize: 20,
fontWeight: FontWeight.bold
)
),
iconTheme: IconThemeData(
color: Color(0xFF0984e3),
),
backgroundColor: Colors.white,
),
resizeToAvoidBottomPadding: false,
body: SingleChildScrollView(
child: ConstrainedBox(
constraints: BoxConstraints(),
child: FutureBuilder(
future: getData(),
builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
if(snapshot.connectionState == ConnectionState.done){
List<Widget> elements = new List<Widget>();
for(var i = 0; i < journeyData['routes'].length; i++){
List<Widget> iconList = new List<Widget>();
String duration;
String start = journeyData['routes'][i]['departure_time'];
String end;
String stress = '2 min';
for(var j = 0; j < journeyData['routes'][i]['route_parts'].length; j++){
if(journeyData['routes'][i]['route_parts'][j]['mode'] == 'foot'){
iconList.add(IconTheme(
data: IconThemeData(
color: Color(0xFFbfcdd5)
),
child: Icon(Icons.directions_walk),
)
);
} else if(journeyData['routes'][i]['route_parts'][j]['mode'] == 'tube'){
iconList.add(IconTheme(
data: IconThemeData(
color: Color(0xFFbfcdd5)
),
child: Icon(Icons.train),
)
);
} else if(journeyData['routes'][i]['route_parts'][j]['mode'] == 'bus'){
iconList.add(IconTheme(
data: IconThemeData(
color: Color(0xFFbfcdd5)
),
child: Icon(Icons.directions_bus),
)
);
}
duration = journeyData['routes'][i]['duration'];
end = journeyData['routes'][i]['arrival_time'];
}
elements.add(Container(
child: Column(
crossAxisAlignment: CrossAxisAlignment.stretch,
children: <Widget>[
Container(
alignment: Alignment.topLeft,
margin: EdgeInsets.only(left: 15, right: 15),
padding: EdgeInsets.all(10),
child: new Wrap(
direction: Axis.horizontal,
crossAxisAlignment: WrapCrossAlignment.start,
spacing: 5,
runSpacing: 5,
children: iconList
),
),
Container(
alignment: Alignment.topLeft,
margin: EdgeInsets.only(left: 15, right: 15),
padding: EdgeInsets.all(10),
child: new Row(
mainAxisAlignment: MainAxisAlignment.spaceBetween,
children: <Widget> [
Column(
children: <Widget>[
Text('Duration',
style: TextStyle(
fontFamily: "Gotham Pro",
fontWeight: FontWeight.w300,
fontSize: 14
)
),
Padding(
padding: EdgeInsets.only(top: 5),
),
Text(duration)
],
),
Column(
children: <Widget>[
Text('Start',
style: TextStyle(
fontFamily: "Gotham Pro",
fontWeight: FontWeight.w300,
fontSize: 14
)
),
Padding(
padding: EdgeInsets.only(top: 5),
),
Text(start),
],
),
Column(
children: <Widget>[
Text('End',
style: TextStyle(
fontFamily: "Gotham Pro",
fontWeight: FontWeight.w300,
fontSize: 14
)
),
Padding(
padding: EdgeInsets.only(top: 5),
),
Text(end),
],
),
Column(
children: <Widget>[
Text('Stress',
style: TextStyle(
fontFamily: "Gotham Pro",
fontWeight: FontWeight.w300,
fontSize: 14
)
),
Padding(
padding: EdgeInsets.only(top: 5),
),
Text(stress)
],
)
]
),
),
Container(
alignment: Alignment.topLeft,
margin: EdgeInsets.only(left: 15, right: 15),
child: Row(
children: <Widget>[
OutlineButton(
child: Text('Details',
style: TextStyle(
color: Color(0xFF0c85e4),
fontFamily: "Gotham Pro",
fontWeight: FontWeight.w700
)
),
borderSide: BorderSide(
color: Color(0xFF0c85e4), //Color of the border
style: BorderStyle.solid, //Style of the border
width: 2, //width of the border
),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
onPressed: ()=>setState((){
_animatedHeight!=0.0 _animatedHeight=0.0:_animatedHeight=100.0;
}
),
),
Padding(
padding: EdgeInsets.only(left: 15, top: 15),
),
RaisedButton(
child: Text('Save',
style: TextStyle(
color: Colors.white,
fontFamily: "Gotham Pro",
fontWeight: FontWeight.w700,
)
),
color: Color(0xFF08b894),
shape: RoundedRectangleBorder(borderRadius: BorderRadius.circular(20)),
onPressed: (){},
)
],
)
),
AnimatedContainer(duration: const Duration(milliseconds: 120),
child: new Text("Journey data will go here"),
height: _animatedHeight,
color: Colors.tealAccent,
width: 200.0,
),
Divider()
],
),
));
}
return new Column(children: elements);
}else if(snapshot.connectionState == ConnectionState.waiting){
return Text("loading ...");
}
},
),
)
)
);
}
}
...
future: getData()
...
...
var dataFetched;
@override
void initState(){
super.initState();
dataFetched = getData();
}
...
FutureBuilder(
future: dataFetched,
builder: (BuildContext context, AsyncSnapshot<String> snapshot) {
if(snapshot.connectionState == ConnectionState.done){...}
}
}
)
...