ABOUT ME

-

Today
-
Yesterday
-
Total
-
  • [Property] key
    w6 2022. 10. 10. 00:35

    key 는

    - 위젯, 요소, 의미적 단위(마디)의 구분자 

    - 위젯 트리에서 한 위젯이 다른 위젯으로 바뀌는 것을 제어하는 속성

    - 위젯 트리에서 위젯이 움직일 때(스크롤 위치변경, 컬렉션 수정 등) 현 상태를 보존하는 역할

     

    key 는 언제 필요? 

    - stateful 위젯에서 위젯 트리내의 위치가 변경된 경우 (eg. 열Row 의 하위 타일 위젯이 자리를 바꿈) 

      플러터는 Element Tree 요소 트리를 통해 뼈대의 구조가 같은지를 확인하려고 함

      참조된 위젯이 타입은 같고 키 값이 다르면, 타입과 키값이 같은 요소를 찾아서 참조 정보를 새로운 위젯으로 업데이트 함

    위젯 트리에서 위젯 위치가 변경된 경우, 요소 트리의 업데이트 과정

    cf) 위젯 하위의 모든 위젯이 Stateless 위젯인 경우 키 불필요

         Stateless 위젯은 부속 위젯들이 정렬된 슬롯을 가지고 있음

        위젯의 위치가 변경된 경우, Stateless 위젯은 키값이 없으므로, 타입만 확인 함

     

     

    key 를 적용할 위치는? 

    상태를 유지해야 하는 위젯 트리의 최상위 위젯에 키 값을 적용 해야 함 

     

    동일 레벨에서만 키값을 찾기 때문

     

    eg. Row 의 자식 Tile 위젯들을 각각 Padding 으로 감싼 경우   

    Row 
    |
    Padding
    |
    Padding
     |
    Tile
    |
    Tile

     

    상태를 유지히야 하는 Tile 위젯에 키값을 적용하면, 

    같은 키 값을 가진 위젯 트리를 찾지못하여 관련된 연결을 비활성화 하고 새로운 상태로 초기화 시킴

    키값을 상태를 유지해야 하는 위젯에 설정한 경우

     

    상위 Padding 위젯 에 키 값을 적용하면 
    동일 레벨에서 타입과 키 값이 같은 Padding 위젯을 칮아서, 참조 값을 변경(업데이트)함 

    타입은 같으나 키값이 다른 경우

     

    어떤 key 를 사용할까? 

    위젯에 저장하고자 하는 데이터의 종류에 따라 키의 종류를 선택

     

    키의 종류 

    - 숫자키

    - 오브젝트키

    - 유니크키

    - 페이지 저장 키

    - 글로벌키

    • 상태를 잃지 않으면서 어플 내 어디에서라도 부모 요소를 바꾸는 것을 가능하게 함
    • 위젯 트리의 전혀 다른 부분에서도 다른 위젯의 정보에 접근할 수 있도록 해줌

     

    'w6' 카테고리의 다른 글

    [Class] 여러가지 Button  (0) 2022.10.10
    [Class] Widget   (0) 2022.10.09

    댓글

Designed by Tistory.