[i-AUD] 모바일/태블릿 모바일 대응 (작성중)

page no. 129499468

기능 설명

i-AUD View Mode(보고서 조회 화면)에서 모바일 및 태블릿 디바이스에 최적화된 터치 기반 UI를 제공합니다.
기존 PC 환경의 마우스 인터랙션(우클릭, 호버, 드래그 등)을 터치 제스처로 대체하고, 화면 크기에 맞는 팝업/메뉴 표시 방식을 적용합니다.

디바이스 분류 기준은 다음과 같습니다.

구분	화면 너비	UI 특성
PC	1200px 이상	마우스 기반, 기존 UI 유지
태블릿	766px ~ 1199px	터치 기반, 화면 중앙 팝업, 드롭다운 메뉴
모바일	765px 이하	터치 기반, 하단 슬라이드업 팝업, 풀스크린 메뉴

공통 터치 제스처는 다음과 같습니다.

제스처	PC 대응 동작	설명
터치 (Touch)	마우스 클릭	항목 선택, 버튼 클릭
롱프레스 (Long Press)	우클릭	컨텍스트메뉴 오픈 (약 0.5초 길게 누르기)
스와이프 (Swipe)	-	달력 넘기기

ContextMenu

PC에서 우클릭으로 열리던 컨텍스트메뉴가, 모바일/태블릿에서는 롱프레스(길게 누르기)로 열립니다. 디바이스별로 메뉴의 표시 형태와 출력 메뉴 목록이 다릅니다.

표시 형태는 다음과 같습니다.

	모바일	태블릿
오픈 방식	롱프레스	롱프레스
표시 형태	하단 슬라이드업 (풀스크린)	터치 위치 근처 드롭다운
서브메뉴	슬라이드 전환 + 뒤로가기	옆으로 펼침
닫기	배경 영역 터치 / × 버튼	메뉴 바깥 영역 터치

변경 사항

DataGrid
공통 메뉴 (헤더/셀 영역 공통)

롱프레스 영역에 관계없이 아래 메뉴가 표시됩니다.

메뉴	설명	조건
내보내기	서브메뉴 → 엑셀로 내보내기, CSV로 내보내기, 텍스트로 내보내기, PPT로 내보내기	각 내보내기 옵션 활성 시
필터 초기화	적용된 필터 전체 제거	필터가 적용된 상태인 경우

컬럼 헤더 영역

컬럼 헤더를 롱프레스하면 공통 메뉴에 추가로 해당 컬럼의 필터/정렬 메뉴가 표시됩니다.

메뉴	설명	조건
필터 [{컬럼명}]	해당 컬럼의 필터 팝업 오픈	컬럼의 Filterable 속성이 true인 경우
정렬 [{컬럼명}]	서브메뉴 → 오름차순 정렬, 내림차순 정렬	컬럼의 Sortable 속성이 true인 경우

OlapGrid
공통 메뉴 (헤더/셀 영역 공통)

롱프레스 영역에 관계없이 아래 메뉴가 표시됩니다.

메뉴	설명
내보내기	서브메뉴 → 엑셀로 내보내기, CSV로 내보내기, 텍스트로 내보내기
전체 확장 / 전체 축소	노드 전체 펼침/접기
합계 표시	서브메뉴 → Row 소계, Row 합계, Column 소계, Column 합계
빈 값 행 숨기기 / 빈 값 열 숨기기	빈 데이터 행/열 숨김
필터 해제	적용된 필터 제거
축 변경(행/렬)	행 ↔ 열 배치 전환
캐시 정보 / 새로 고침	데이터 캐시 정보 확인 및 갱신

헤더 영역

Dimension/Measure 필드의 헤더 영역을 롱프레스하면 공통 메뉴에 추가로 아래 메뉴가 표시됩니다.

Chart

차트 영역을 롱프레스하면 컨텍스트메뉴가 표시됩니다.

메뉴	설명
내보내기	서브메뉴 → 엑셀로 내보내기, 한글로 내보내기, PPT로 내보내기, Doc로 내보내기
차트 유형	Bar, Column, Line, Area 등 차트 유형별 서브메뉴
차트 색상 팔레트	Default, Standard, Office 등 23종 팔레트 서브메뉴

Calendar

모바일/태블릿에서는 좌우 스와이프로 넘길 수 있으며, 「확인」 버튼으로 날짜를 확정합니다.
모든 달력 유형(일별, 월별, 연별, 주간)을 지원합니다.
팝업 표시 형태는 다음과 같습니다.
- 모바일: 화면 하단에서 슬라이드업, 화면 전체 너비 사용
- 태블릿: 화면 중앙 다이얼로그

변경 사항

	PC	태블릿	모바일
화면
팝업 형태	드롭다운	중앙 다이얼로그	하단 슬라이드업
네비게이션	화살표 버튼	화살표 버튼 + 스와이프	화살표 버튼 + 스와이프
값 확정	날짜 클릭 시 즉시	「확인」 버튼	「확인」 버튼

CalendarFromTo

시작일(From)과 종료일(To)을 선택하는 컨트롤로, 디바이스별로 레이아웃이 크게 다릅니다.
- 태블릿: From/To 달력 2개가 좌우로 나란히 표시, 각 달력 상단에 「시작일」/「종료일」 라벨
- 모바일: 달력 1개로 From↔To를 탭으로 전환하며 선택, 상단에 「시작일」/「종료일」 표시

변경 사항

	PC	태블릿	모바일
화면
레이아웃	From/To 달력 나란히	From/To 달력 나란히	달력 1개 + From↔To 탭 전환
팝업 형태	드롭다운	중앙 다이얼로그	하단 슬라이드업
네비게이션	화살표 버튼	화살표 버튼 + 스와이프	화살표 버튼 + 스와이프
값 확정	날짜 클릭 시 즉시	「확인」 버튼	「확인」 버튼

MultiComboBox

모바일/태블릿에서는 PC의 2패널(전체/선택) 레이아웃 대신 단일 리스트 형태로 표시됩니다. 검색, 정렬, 전체선택/전체해제 기능은 동일하게 제공됩니다.
팝업 표시 형태는 다음과 같습니다.
- 모바일: 화면 하단에서 슬라이드업
- 태블릿: 화면 중앙 다이얼로그

변경 사항

	PC	태블릿	모바일
화면
팝업 형태	모달 다이얼로그	중앙 다이얼로그	하단 슬라이드업
레이아웃	2패널 (전체/선택)	단일 리스트	단일 리스트
단일선택 확정	항목 클릭 시 즉시	「확인」 버튼	「확인」 버튼
TreeView	지원	개발 중	개발 중

PickList

모바일/태블릿에서 동일한 텍스트 입력 영역 + 파일 업로드 기능을 제공합니다.
팝업 표시 형태는 다음과 같습니다.
- 모바일: 화면 하단에서 슬라이드업
- 태블릿: 화면 중앙 다이얼로그

변경 사항

	PC	태블릿	모바일
화면
팝업 형태	모달 다이얼로그	중앙 다이얼로그	하단 슬라이드업
크기	크기 조절 가능	고정	고정
버튼	파일 선택 + 확인	파일 선택 + 확인(N개)	파일 선택 + 확인(N개)

Dialog, FormDialog

모바일에서는 화면 하단에서 슬라이드업으로 전체 화면 표시되며, 태블릿에서는 화면 중앙 다이얼로그로 표시됩니다.
모바일에서는 크기 조절 및 이동이 불가하며, 가로 모드 전환 시 "세로 모드로 전환해 주세요" 안내 메시지가 표시됩니다.

변경 사항

	PC	태블릿	모바일
화면
표시 형태	중앙 다이얼로그	중앙 다이얼로그	하단 슬라이드업 (전체 화면)
이동	드래그 가능	터치 드래그 가능	불가
크기 조절	가능	불가	불가
최대화	가능	가능	불가 (숨김)
배경 영역으로 닫기	불가	가능	가능
가로 모드	-	회전 시 재배치	차단 (세로 전환 안내)

MessageBox
1. MessageBox는 DialogBox와 달리 모든 디바이스에서 화면 중앙에 표시됩니다.
  1. 모바일에서도 하단 슬라이드업이 아닌 화면 중앙에 출력됩니다.
2. 변경 사항
  
  PC 태블릿 모바일
  표시 형태 중앙 중앙 중앙
  이동 드래그 가능 터치 드래그 가능 불가
  배경 영역으로 닫기 불가 가능 가능
iMessage

참고 사항

주의 사항

변경 사항

변경 전	변경 후	릴리즈 번호
Calendar	Calendar (태블릿/모바일)
CalendarFromTo	CalendarFromTo (태블릿/모바일)
MultiComboBox	MultiComboBox (태블릿/모바일)
PickList	PickList
DialogBox, FormDialogBox	DialogBox, FormDialogBox (태블릿/모바일)