대화형 통신 편집기의 텍스트 필드 구성 요소
aem-forms-ea@adobe.com으로 이메일을 보내시기 바랍니다.1. 소개
대화형 통신(IC) 편집기의 텍스트 필드 구성 요소를 사용하여 작성자는 이름, 주소, 설명 또는 숫자 ID와 같은 정보를 표시할 수 있습니다. 텍스트 필드에 표시된 값은 사전 정의(정적)되거나 데이터 바인딩을 사용하여 동적으로 채워집니다. 단일 라인 항목, 유효성 검사 규칙 및 유연한 포맷을 지원하여 개인화된 통신에서 가장 널리 사용되고 다양한 요소 중 하나입니다.
2. 속성
2.1 기본 필드
-
이름: 데이터 모델, 규칙 및 스크립트에 사용되는 필드의 고유 식별자를 정의합니다.
-
캡션: 사용자에게 표시되는 화면 레이블을 표시합니다(예: "First Name").
-
값: 이름, 주소, 설명 또는 기타 세부 정보와 같은 텍스트를 표시합니다. 값이 정적이거나 데이터 바인딩에서 파생되었습니다.
-
예약: 값, 왼쪽, 오른쪽, 위쪽 또는 아래쪽의 정렬을 설정하거나 밀리미터(예: 20mm)와 같은 단위를 사용하여 사용자 지정 위치를 지정하십시오.
-
모양: 원하는 시각적 레이아웃을 기준으로 값 상자의 모양을 None, Solid Box 또는 Underline으로 설정합니다.
2.2 타이포그래피
입력된 문자의 비주얼 스타일을 제어합니다.
-
글꼴 유효성 검사: 선택적 제약 조건을 적용하여 표시된 값의 형식을 확인합니다(예: 알파벳, 숫자 또는 특정 사용자 지정 패턴만 허용).
-
글꼴 크기: 가독성과 디자인 표준에 맞게 정렬되도록 10pt, 12pt, 20pt 등의 점 값을 사용하여 필드 내의 텍스트 크기를 조정합니다.
2.3 위치
레이아웃 내에서 필드의 배치를 정의합니다.
-
X/Y 좌표
-
너비 및 높이(mm, px 또는 %)
2.4 이익
필드 컨테이너 주위의 간격을 지정합니다.
-
상단(위)
-
아래쪽(아래쪽)
-
왼쪽
-
오른쪽
2.5 모양
필드 컨테이너 자체에 스타일을 지정합니다.
-
채우기: 텍스트 상자의 배경색을 설정합니다. 이렇게 하면 입력 영역을 구분하거나 브랜드 색상에 맞게 정렬하는 데 도움이 됩니다.
-
획: 사용자 지정 가능한 다음 속성을 사용하여 텍스트 상자 주위에 테두리를 추가합니다.
-
너비: 테두리의 두께를 정의합니다.
-
스타일: 단색, 파선 또는 점선 테두리 스타일 중에서 선택합니다.
-
Edge: 모서리의 모양을 선택합니다(둥글거나 선명함).
-
반경: 더 부드럽게 보이도록 반경 값(예: 4px, 10px)을 사용하여 모서리 곡률을 조정합니다.
2.6 유무
런타임 시 가시성을 결정합니다.
-
표시: 표시 및 공간 차지
-
숨김(공간 유지): 표시되지 않지만 레이아웃 공간은 예약되어 있습니다.
2.7 데이터 바인딩
텍스트 필드를 데이터 소스에 연결하여 통신 내에서 동적으로 또는 정적으로 값을 표시합니다.
-
데이터 바인딩 형식: 필드가 데이터 원본 또는 스키마에 연결되는 방법을 지정합니다.
-
이름 사용: 데이터 모델 또는 스키마에 정의된 필드 이름을 사용하여 텍스트 필드를 바인딩하여 외부 데이터를 기반으로 동적 텍스트를 표시할 수 있습니다.
-
전역 데이터 사용: 일관된 정보 표시를 위해 필드를 전체 통신에서 공유되는 전역 데이터에 연결합니다.
-
데이터 바인딩 없음: 백엔드 원본에서 필드의 연결이 해제됩니다. 정적 값 또는 시각적 컨텍스트에만 사용되는 텍스트를 표시하는 데 사용됩니다.
3. 사용
일반적인 시나리오는 다음과 같습니다.
-
개인 세부 정보(이름, 주소, 전화번호) 캡처
-
의견 또는 피드백 수락(여러 줄)
-
정책 번호 또는 계정 ID 입력
-
PIN 코드 또는 OTP 같은 짧은 숫자 값 수집
작성자는 정렬을 위해 하위 양식 또는 레이아웃 격자에 필드를 배치하고, 검증 규칙(길이 제한, 정규 표현식 패턴)을 첨부하여 입력을 깔끔하게 할 수 있습니다.
4. 우수 사례
-
즉각적인 피드백에 대한 유효성 검사(필수 플래그, 패턴 확인)를 적용합니다.
-
인쇄 또는 읽기 전용 보기에 의미 있는 예약 텍스트를 제공합니다.
-
타이포그래피를 브랜드 가이드라인과 일관되게 유지하십시오.
-
모바일 레이아웃에서 필드 너비를 줄여 더 작은 화면에 맞출 수 있습니다.
-
가능하면 데이터 모델에 직접 바인딩하여 유지 관리를 간소화합니다.
IC 편집기의 텍스트 필드 구성 요소는 데이터 캡처를 간소화하는 다용도 빌딩 블록입니다. 잘 선택된 타이포그래피, 명확한 라벨, 적절한 유효성 검사 및 견고한 데이터 바인딩으로 신중하게 구성되면 다운스트림 처리를 위한 원활하고 사용자 친화적인 경험과 신뢰할 수 있는 데이터를 제공합니다.