In your views you often want to only conditionally show something, or loop through a list of items. For this flutter-view has some intentionally simple flow control keywords.
This will only render the widget if the passed condition is true.
user-profile(flutter-view :user[User]).user.name ${user.name}.company(if='user.company != null') Works at ${user.company}
UserProfile({ User user}) {return Container(child: Column(children: [Container(child: Text('${user.name}'),),user.company != null ?Container(child: Text('Works at ${user.company}'),): Container(),],),);}// left out some flatten operations for simplicity
In the above example, the company will only be shown if the passed user has the company property set.
A slot is a placeholder for a value. It will always take the value of the first valid child.
Slot can function as an if/else. In the next example you see either the .status being shown, or the .empty.
tasks-page(flutter-view :tasks[List])scaffoldslot(as='body').status(if='tasks.isNotEmpty') You have ${tasks.length} tasks.empty You have no tasks yet...​
Scaffold TasksPage({ List tasks }) {return Scaffold(body: (tasks.isNotEmpty) ?//-- STATUS ----------------------------------------------------------Container(child: Text('You have ${tasks.length} tasks',),):true ?//-- EMPTY ----------------------------------------------------------Container(child: Text('You have no tasks yet...',),): Container(),);}​
As you can see in the above example, you can use the as property to assign the slot value to a parameter as well. In this case, the content of the slot is placed in the body parameter of the Scaffold.
By adding multiple children with if to a slot, you can also create a swich/case:
slot.apple(if='fruit=="Apple"').pear(if='fruit=="Pear"').peach(if='fruit=="Peach"').unknown // the fallback​
Use for to repeat a widget for every value in a list. For every repetition, the value gets assigned to a variable, which you can use to render the widget and its children.
tasks-page(flutter-view :tasks[List])scaffoldslot(as='body').task(for='task in tasks').title ${task.title}.description ${task.description}
Scaffold TasksPage({ List tasks }) {return Scaffold(body://-- BODY ----------------------------------------------------------Container(child: (tasks as List).map((task) {return//-- TASK ----------------------------------------------------------Container(child: Column(children: [//-- TITLE ----------------------------------------------------------Container(child: Text('${task.title}',),),//-- DESCRIPTION ----------------------------------------------------------Container(child: Text('${task.description}',),)]),),);}).toList(),),);}
You can also get the index (starting at 0) of the current entry as such:
.task(for='task, index in tasks')
​