대화형 통신 편집기의 라디오 버튼 구성 요소
aem-forms-ea@adobe.com으로 이메일을 보내시기 바랍니다.1. 소개
대화형 통신(IC) 편집기의 라디오 단추 구성 요소를 통해 작성자는 상호 배타적인 선택 사항을 사용자에게 제공할 수 있습니다. 즉, 한 번에 하나의 옵션만 선택할 수 있습니다. 따라서 예/아니요 질문, 성별 선택, 등급 수준 또는 사전 정의된 범주형 응답과 같은 사용 사례에 이상적입니다.
라디오 버튼은 직관적이고 구성이 쉬우며 백엔드 데이터 모델에 바인딩하여 원활한 데이터 캡처 및 통합을 수행할 수 있습니다.
2. 속성
라디오 버튼 구성 요소에는 구성 가능한 몇 가지 속성이 포함됩니다.
2.1. 기본 필드
-
이름: 필드의 고유 식별자입니다. 데이터 모델, 규칙 및 비즈니스 논리 내에서 를 참조하는 데 사용됩니다.
-
전환: 단추 그룹에서 선택 가능한 각 선택 항목을 정의할 수 있습니다. 각 토글은 가능한 값을 나타냅니다.
-
캡션: 사용자를 안내하는 라디오 단추 그룹에 연결된 레이블입니다.
-
예약: 선택 사항이 없거나 데이터 바인딩이 비어 있는 경우 선택적 대체 값입니다.
2.2. 위치
레이아웃에서 라디오 단추 그룹의 공간 배치를 제어합니다.
설정:
-
X 및 Y 좌표
-
높이 및 너비(응답형 레이아웃 디자인의 경우 mm 또는 %로 정의됨)
2.3. 이익
텍스트 상자 주위의 간격을 정의합니다.
-
상단(위)
-
아래쪽(아래쪽)
-
왼쪽
-
오른쪽
2.4. 현재 상태
-
설명: 런타임 시 라디오 단추 구성 요소의 표시 여부를 결정합니다.
-
옵션:
-
표시: 사용자에게 표시되고 공간을 차지합니다.
-
숨김(공간 유지): 표시되지는 않지만 레이아웃 간격이 유지됩니다.
-
2.5. 데이터 바인딩
-
설명: 선택한 옵션을 캡처하기 위해 라디오 단추 그룹을 데이터 모델에 연결합니다.
-
바인딩 형식:
-
이름 사용: 할당된 필드 이름을 바인딩에 대한 참조로 사용합니다.
-
전역 데이터 사용: 필드를 전역 데이터 모델 또는 스키마 요소에 바인딩합니다.
-
데이터 바인딩 없음: 라디오 단추 선택이 데이터 원본에 연결되어 있지 않습니다. UI 전용 동작에 사용됩니다.
-
3. 사용
라디오 버튼 구성 요소는 사용자가 목록에서 하나의 값만 선택해야 하는 시나리오에 적합합니다. 일반적인 사용 사례는 다음과 같습니다.
-
선호하는 통신 방법 선택(이메일/전화/SMS)
-
바이너리 결정 확인(예/아니요)
-
제한된 옵션(예: 성별, 혼인 상태)에서 선택
-
만족도 수준 또는 동의 척도 표시(예: 반대 / 중립 / 동의)
작성자는 일관된 맞춤을 위해 관련 라디오 단추를 함께 그룹화하고 레이아웃 컨테이너 내부에 배치할 수 있습니다. 시각적 디자인 요구 사항에 따라 레이블을 인라인이나 단추 위에 배치할 수 있습니다.
4. 우수 사례
-
옵션 수를 5개 이하로 제한하여 사용자를 압도하지 않도록 합니다.
-
명확하고 간결한 캡션을 사용하여 사용자가 선택하는 항목을 설명합니다.
-
필요한 경우 가장 일반적이거나 안전한 선택을 미리 선택합니다.
-
사용자가 두 개 이상의 옵션을 선택할 수 있도록 허용해야 하는 경우에는 라디오 단추를 사용하지 말고 대신 확인란을 사용하십시오.
-
백엔드 데이터 모델과 통합할 때 라디오 단추를 스키마 노드에 직접 바인딩합니다.
-
일관된 간격 및 맞춤을 적용하여 특히 모바일 친화적 레이아웃에서 시각적 선명도를 향상시킵니다.
대화형 통신 편집기의 라디오 버튼 구성 요소는 최종 사용자에게 깔끔하고 구조화된 의사 결정을 제공하는 기본 입력 구성 요소입니다. 명확한 레이블, 사용자 정의 간격 및 데이터 바인딩으로 구성된 경우 안정적인 데이터 수집과 양식, 설문 조사 및 온보딩 워크플로우에 대한 더 원활한 사용자 경험을 보장합니다.