到目前为止，当我需要在小部件中使用条件语句时，我已经做了以下工作(使用中心和容器作为简化的虚拟示例):
new Center(
child: condition == true ? new Container() : new Container()
)
虽然当我尝试使用if/else语句时，它会导致一个死亡代码警告:
new Center(
child:
if(condition == true){
new Container();
}else{
new Container();
}
)
有趣的是，我尝试了一个switch case语句，它给了我同样的警告，因此我不能运行代码。我做错了什么，或者它是这样的，不能使用if/else或开关语句而不颤振认为有死代码?
当前回答
像这样做
Widget showIf(bool shouldShow, Widget widget) {
if (shouldShow) {
return widget;
} else {
return Container();
}}
所以当你想用条件来展示某物的时候你会说
Column(children: [showIf(myConditionIsTrue, myComplexWidget)])
其他回答
另一种选择:对于“switch’s”这样的语句，有很多条件，我喜欢使用map:
return Card(
elevation: 0,
margin: EdgeInsets.all(1),
child: conditions(widget.coupon)[widget.coupon.status] ??
(throw ArgumentError('invalid status')));
conditions(Coupon coupon) => {
Status.added_new: CheckableCouponTile(coupon.code),
Status.redeemed: SimpleCouponTile(coupon.code),
Status.invalid: SimpleCouponTile(coupon.code),
Status.valid_not_redeemed: SimpleCouponTile(coupon.code),
};
在不使用条件语句的情况下，更容易向条件列表中添加/删除元素。
另一个例子:
var condts = {
0: Container(),
1: Center(),
2: Row(),
3: Column(),
4: Stack(),
};
class WidgetByCondition extends StatelessWidget {
final int index;
WidgetByCondition(this.index);
@override
Widget build(BuildContext context) {
return condts[index];
}
}
如果你使用小部件列表，你可以使用这个:
class HomePage extends StatelessWidget {
bool notNull(Object o) => o != null;
@override
Widget build(BuildContext context) {
var condition = true;
return Scaffold(
appBar: AppBar(
title: Text("Provider Demo"),
),
body: Center(
child: Column(
children: <Widget>[
condition? Text("True"): null,
Container(
height: 300,
width: MediaQuery.of(context).size.width,
child: Text("Test")
)
].where(notNull).toList(),
)),
);
}
}
更好的方法
Column(
children: [
if (firstCondition == true) ...[
DayScreen(),
] else if(secondCondition == true)...[
StatsScreen(),
], else...[
StatsScreen(),
],
],
),
像这样做
Widget showIf(bool shouldShow, Widget widget) {
if (shouldShow) {
return widget;
} else {
return Container();
}}
所以当你想用条件来展示某物的时候你会说
Column(children: [showIf(myConditionIsTrue, myComplexWidget)])
Flutter Widget可以在不破坏代码树的情况下有条件地用父元素包装子树
import 'package:flutter/widgets.dart';
/// Conditionally wrap a subtree with a parent widget without breaking the code tree.
///
/// [condition]: the condition depending on which the subtree [child] is wrapped with the parent.
/// [child]: The subtree that should always be build.
/// [conditionalBuilder]: builds the parent with the subtree [child].
///
/// ___________
/// Usage:
/// ```dart
/// return ConditionalParentWidget(
/// condition: shouldIncludeParent,
/// child: Widget1(
/// child: Widget2(
/// child: Widget3(),
/// ),
/// ),
/// conditionalBuilder: (Widget child) => SomeParentWidget(child: child),
///);
/// ```
///
/// ___________
/// Instead of:
/// ```dart
/// Widget child = Widget1(
/// child: Widget2(
/// child: Widget3(),
/// ),
/// );
///
/// return shouldIncludeParent ? SomeParentWidget(child: child) : child;
/// ```
///
class ConditionalParentWidget extends StatelessWidget {
const ConditionalParentWidget({
Key key,
@required this.condition,
@required this.child,
@required this.conditionalBuilder,
}) : super(key: key);
final Widget child;
final bool condition;
final Widget Function(Widget child) conditionalBuilder;
@override
Widget build(BuildContext context) {
return condition ? this.conditionalBuilder(this.child) : this.child;
}
}
