manki kim

Flutter DataGrid 개발 노트 - 행의 그룹핑

Flutter 데이터그리드 패키지인 PlutoGrid 의 행 그룹핑 기능을 개발 하고 있습니다.

대부분의 기능이 구현되었지만 발목을 잡는 기능 하나가 있습니다.

구현된 기능을 우선으로, 발목을 잡는 기능은 문서 마지막 섹션에서 확인 하실 수 있습니다.

[개발 완료] 컬럼에 의한 행 그룹핑

• 복수의 컬럼으로 멀티 그룹핑 가능. (이미지는 2개의 컬럼으로 그룹핑)
• 동적으로 그룹상태를 변경하거나 해제 가능.
• 그룹핑 된 상태에서 행의 추가 및 삭제 가능. (멀티 셀렉트 가능)

[개발완료] 그룹핑 된 상태에서의 정렬

[개발완료] 그룹핑 된 상태에서 필터링

[개발완료] 그룹핑 된 상태에서 페이지네이션

• 가장 상위의 그룹행을 기준으로 페이지네이션.

[개발중] 선택 된 특정 행 또는 그룹들을 드래그하여 이동

• 위 이미지는 그룹핑 되지 않은 상태에서의 행 이동 입니다.(기존 버전)

• 위 이미지는 그룹핑 된 상태에서 특정 행들을 불규칙적으로 선택하여 드래그 합니다.

아직 구현하지 않은 기능으로 UI/UX 적인 고민에 빠져 있습니다.

선택 된 행이 그룹이거나 어떤 그룹의 하위 행이거나 하는 상태가 중첩 되어 있습니다.

그룹인 경우는 접혀 있거나 펼쳐져 있을 수 있습니다.

그룹은 또다른 그룹을 포함 할 수 있습니다.

각 그룹의 하위 행 또는 하위 그룹은 컬럼을 기준으로 동일한 값의 조건으로 묶여 있습니다.

이러한 조건들 속에서 행을 이동 한 결과는,

경우에 따라 하위 행이 모두 다른 행으로 이동하여 해당 그룹행은 삭제 되거나

접혀 있는 그룹으로 행을 이동 하는 경우는 사용자가 펼쳐야 결과를 확인 할 수 있습니다.

또한, 이동 결과가 중복된 조건으로 그룹된 상태가 되면 중복 된 행은 삭제되고 삭제된 그룹의 하위 행들을 남아 있는 그룹의 하위 행으로 포함 시켜야 합니다.

행의 그룹핑 기능의 거의 마지막 단계인데 행의 이동이 발목을 잡네요.

개발적으로는 구현이 어렵지 않지만 사용자가 행의 이동의 결과를 쉽게 이해 할 수 있게

UI/UX 를 구현하는 것이 어렵습니다.