지금까지 위젯 내에서 조건문을 사용해야 할 때마다 다음을 수행했습니다 (간단한 더미 예제로 센터 및 컨테이너 사용).
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 또는 switch 문을 사용할 수 없습니까?
답변
사실 당신은 할 수 사용 if/else
및 switch
다트 / 플러터의 다른 문 인라인.
즉각적인 익명 기능 사용
class StatmentExample extends StatelessWidget {
Widget build(BuildContext context) {
return Text((() {
if(true){
return "tis true";}
return "anything but true";
})());
}
}
즉, 당신의 문장을 함수로 감싼다
(() {
// your code here
}())
UI ‘마크 업’에 너무 많은 로직을 직접 넣지 말 것을 강력히 권장하지만 Dart의 유형 추론에는 약간의 작업이 필요하므로 이러한 시나리오에서 유용 할 수 있습니다.
삼항 연산자 사용
condition ? Text("True") : null,
컬렉션에서 If 또는 For 문 또는 스프레드 연산자 사용
children: [
...manyItems,
oneItem,
if(canIKickIt)
...kickTheCan
for (item in items)
Text(item)
방법 사용
child: getWidget()
Widget getWidget() {
if (x > 5) ...
//more logic here and return a Widget
스위치 문 재정의
삼항 연산자에 대한 또 다른 대안으로 https://stackoverflow.com/a/57390589/1058292 게시물과 같이 switch 문의 함수 버전을 만들 수 있습니다 .
child: case2(myInput,
{
1: Text("Its one"),
2: Text("Its two"),
}, Text("Default"));
답변
다트에서, if/else
그리고 switch
문없는 표현이다. 값을 반환하지 않으므로 생성자 매개 변수에 전달할 수 없습니다. 빌드 메서드에 많은 조건부 논리가있는 경우이를 시도하고 단순화하는 것이 좋습니다. 예를 들어 자체 포함 된 논리를 메서드로 이동하고 if/else
문을 사용 하여 나중에 사용할 수있는 지역 변수를 초기화 할 수 있습니다.
방법 및 if / else 사용
Widget _buildChild() {
if (condition) {
return ...
}
return ...
}
Widget build(BuildContext context) {
return new Container(child: _buildChild());
}
사용 if/else
Widget build(BuildContext context) {
Widget child;
if (condition) {
child = ...
} else {
child = ...
}
return new Container(child: child);
}
답변
기록을 위해 Dart 2.3은 컬렉션 리터럴에서 if / else 문을 사용하는 기능을 추가했습니다. 이제 다음과 같은 방식으로 수행됩니다.
return Column(children: <Widget>[
Text("hello"),
if (condition)
Text("should not render if false"),
Text("world")
],);
Flutter Issue # 28181-목록의 인라인 조건부 렌더링
답변
이 경우 삼항 연산자를 사용하는 것이 좋습니다.
child: condition ? Container() : Center()
다음과 같은 형식의 코드를 피하십시오.
if (condition) return A else return B
삼항 연산자보다 불필요하게 더 장황합니다.
그러나 더 많은 논리가 필요한 경우 다음을 수행 할 수도 있습니다.
빌더 위젯 사용
위젯 빌더 아이 필요한 위젯 때 폐쇄의 사용을 허용위한 것입니다 :
하위 위젯을 얻기 위해 클로저를 호출하는 플라토닉 위젯.
위젯을 빌드하기 위해 로직이 필요할 때마다 편리하며 전용 함수를 만들 필요가 없습니다.
Builder 위젯을 자식으로 사용하고 해당 builder
메서드에 논리를 제공합니다 .
Center(
child: Builder(
builder: (context) {
// any logic needed...
final condition = _whateverLogicNeeded();
return condition
? Container();
: Center();
}
)
)
빌더는 창조 논리를 보관할 수있는 편리한 장소를 제공합니다. atreeon이 제안한 즉각적인 익명 기능보다 더 간단합니다.
또한 논리가 UI 코드에서 추출되어야한다는 데 동의하지만 실제로 UI 논리 인 경우에는 유지하는 것이 더 읽기 쉽습니다.
답변
조건부 논리를 사용하여 Flutter UI를 빌드하는 쉬운 방법은 논리를 UI 외부에 유지하는 것임을 알았습니다. 다음은 두 가지 색상을 반환하는 함수입니다.
Color getColor(int selector) {
if (selector % 2 == 0) {
return Colors.blue;
} else {
return Colors.blueGrey;
}
}
이 기능은 CircleAvatar의 배경을 설정하는 데 사용됩니다.
new ListView.builder(
itemCount: users.length,
itemBuilder: (BuildContext context, int index) {
return new Column(
children: <Widget>[
new ListTile(
leading: new CircleAvatar(
backgroundColor: getColor(index),
child: new Text(users[index].name[0])
),
title: new Text(users[index].login),
subtitle: new Text(users[index].name),
),
new Divider(height: 2.0),
],
);
},
);
여러 위젯에서 색상 선택기 기능을 재사용 할 수 있으므로 매우 깔끔합니다.
답변
나는 개인적으로 이런 종류의 블록 문을 가진 아이들에게 if / else 문을 사용합니다. 위의 Dart 버전 2.3.0에서만 지원됩니다.
다른 경우라면
Column(
children: [
if (_selectedIndex == 0) ...[
DayScreen(),
] else ...[
StatsScreen(),
],
],
),
만약 / 그렇지 않다면
Column(
children: [
if (_selectedIndex == 0) ...[
DayScreen(),
] else if(_selectedIndex == 1)...[
StatsScreen(),
],
],
),
답변
조건문을 사용하면됩니다. a==b?c:d
예 :
Container(
color: Colors.white,
child: ('condition')
? Widget1(...)
: Widget2(...)
)
나는 당신이 아이디어를 얻었기를 바랍니다.
다른 조건이 없다면 SizedBox.shrink ()를 사용할 수 있습니다.
Container(
color: Colors.white,
child: ('condition')
? Widget1(...)
: SizedBox.shrink()
)
열이면 ?:
연산자 를 쓸 필요가 없습니다.
Column(
children: <Widget>[
if('condition')
Widget1(...),
],
)