Stateless 위젯 클래스의 키

Stateless 위젯 클래스의 키는 무엇입니까?

---

Flutter 문서에는 다음과 같이 상태 비저장 위젯 하위 클래스에 대한 샘플 코드가 있습니다.

class GreenFrog extends StatelessWidget {
  const GreenFrog({ Key key }) : super(key: key);

  @override
  Widget build(BuildContext context) {
    return new Container(color: const Color(0xFF2DBD3A));
  }
}

이

class Frog extends StatelessWidget {
  const Frog({
    Key key,
    this.color: const Color(0xFF2DBD3A),
    this.child,
  }) : super(key: key);

  final Color color;

  final Widget child;

  @override
  Widget build(BuildContext context) {
    return new Container(color: color, child: child);
  }
}

키란 무엇이며 이 슈퍼 생성자는 언제 사용해야 합니까? 자신의 생성자가 있는 경우 {Key key}가 있어야 하는 것 같습니다. 이유는 무엇입니까? 나는 super 키워드가 사용 되지 않는 다른 예를 보았 으므로 이것이 내 혼란이 있는 곳입니다.

---

TLDR : 모든 위젯은 있어야한다 Key key로 선택 매개 변수 또는 생성자입니다. Key목록에서 어떤 위젯이 변경되었는지 인식하는 단계에서 플러터 엔진이 사용하는 것입니다.

---

잠재적으로 제거/삽입될 수 있는 동일한 유형 의 위젯 목록 ( Column, Row, 무엇이든) 이 있을 때 유용합니다 .

다음이 있다고 가정해 보겠습니다(코드가 작동하지 않지만 아이디어를 얻음).

AnimatedList(
  children: [
    Card(child: Text("foo")),
    Card(child: Text("bar")),
    Card(child: Text("42")),
  ]
)

스와이프로 이러한 위젯을 개별적으로 제거할 수 있습니다.

문제는 목록에 자식이 제거될 때 애니메이션이 있다는 것입니다. 그래서 "바"를 제거합시다.

AnimatedList(
  children: [
    Card(child: Text("foo")),
    Card(child: Text("42")),
  ]
)

문제: 가 없으면 Keyflutter는 두 번째 요소가 Row사라 졌는지 알 수 없습니다 . 또는 그것이 사라진 마지막 하나이고 두 번째에 자식 변경이 있는 경우.

따라서 가 없으면 떠나는 애니메이션이 대신 마지막 요소에서 재생 Key되는 버그가 있을 수 있습니다!

---

여기 Key에서 발생합니다.

키를 사용하여 예제를 다시 시작하면 다음과 같이 됩니다.

AnimatedList(
  children: [
    Card(key: ObjectKey("foo"), child: Text("foo")),
    Card(key: ObjectKey("bar"), child: Text("bar")),
    Card(key: ObjectKey("42"), child: Text("42")),
  ]
)

키가 얼마나 알 수 없는 자식, 색인 요소에 독특한 뭔가.

From this point, if we remove "bar" again, we'll have

AnimatedList(
  children: [
    Card(key: ObjectKey("foo"), child: Text("foo")),
    Card(key: ObjectKey("42"), child: Text("42")),
  ]
)

Thanks to key being present, flutter engine now knows for sure which widget got removed. And now our leave animation will correctly play on "bar" instead of "42".

---

The Key is an optional parameter needed to preserve state in your widget tree, you have to use them if you want to move a collection of elements in your tree and preserve the state of them.

The best explanation can be found in this video by Google When to Use Keys - Flutter Widgets 101 Ep. 4

ReferenceURL : https://stackoverflow.com/questions/50080860/what-are-keys-in-the-stateless-widgets-class