마스터-디테일 화면 (Master-Detail)
한눈에 보기
마스터-디테일 화면은 왼쪽에 목록(마스터), 오른쪽에 상세(디테일) 를 동시에 보여주는 화면입니다. 왼쪽에서 항목을 클릭하면 오른쪽에 해당 상세 정보가 바로 표시됩니다.
소개
마스터-디테일 화면은 목록과 상세를 한 화면에서 동시에 볼 수 있어서, 여러 항목을 빠르게 탐색하면서 상세 정보를 확인할 때 편리합니다.
이메일 앱을 떠올려 보세요 -- 왼쪽에 메일 목록, 오른쪽에 선택한 메일 내용. 이것이 마스터-디테일 구조입니다.
이렇게 보입니다
마스터-디테일 화면의 전체 모습입니다. 왼쪽 목록에서 거래처를 클릭하면 오른쪽에 해당 거래처의 상세 정보와 거래 이력이 표시됩니다.
거래처 관리
거래처 목록 (마스터)
(주)A사 매입처
(주)B사 매출처
(주)C사 겸용
(주)D사 매입처
(주)E사 매출처
거래처 상세 (디테일)
(주)A사
사업자번호123-45-67890
대표자김대표
연락처02-1234-5678
주소서울시 강남구...
최근 거래 이력
| PO-042 | 3/15 | 1,650,000 |
| PO-038 | 3/10 | 850,000 |
| PO-035 | 3/05 | 2,100,000 |
주요 기능
| 기능 | 설명 |
|---|---|
| 목록 검색 | 마스터 영역에서 키워드로 빠르게 검색 |
| 즉시 전환 | 목록에서 다른 항목 클릭 → 디테일 즉시 변경 |
| 관련 데이터 표시 | 선택한 항목과 관계된 자식 데이터도 함께 표시 |
| 비율 조절 | 마스터/디테일 영역의 너비 비율 조정 가능 |
설정 방법
- 화면 노드를 배치하고 테이블에 연결합니다
- 화면 타입을 "마스터-디테일" 로 선택합니다
- 마스터(목록) 영역에 표시할 컬럼을 설정합니다
- 디테일(상세) 영역에 표시할 필드를 설정합니다
| 설정 | 설명 |
|---|---|
| 마스터 표시 컬럼 | 왼쪽 목록에 보여줄 컬럼 (보통 2~3개) |
| 디테일 표시 필드 | 오른쪽 상세에 보여줄 전체 필드 |
| 관련 데이터 | 1:N 관계의 자식 데이터도 디테일에 표시 |
| 기본 선택 | 화면 로드 시 첫 번째 항목 자동 선택 여부 |
| 비율 | 마스터:디테일 너비 비율 (기본 3:7) |
실무 예시
| 업무 | 마스터 (왼쪽 목록) | 디테일 (오른쪽 상세) |
|---|---|---|
| 거래처 관리 | 거래처 목록 | 거래처 정보 + 거래 이력 |
| 품목 관리 | 품목 목록 | 품목 상세 + BOM 정보 |
| 설비 관리 | 설비 목록 | 설비 상세 + 정비 이력 |
| 고객 응대 | 고객 목록 | 고객 정보 + 문의/클레임 이력 |
자주 묻는 질문
Q: 디테일 영역에서 데이터를 수정할 수 있나요? A: 설정에 따라 읽기 전용 또는 편집 가능으로 구성할 수 있습니다.
Q: 마스터 영역에 트리 구조를 사용할 수 있나요? A: 네, 계층형 테이블을 마스터 영역에 트리로 표시할 수 있습니다.
Q: 가로가 아닌 세로 분할도 가능한가요? A: 기본은 좌우 분할이지만, 설정에서 상하 분할로 변경할 수 있습니다.