라디오 버튼 스크립트 구성 요소

라디오 버튼을 사용하면 사용자가 선택 항목 집합에서 하나의 옵션을 선택할 수 있습니다.

  1. 클릭 라디오 버튼 구성 요소 도구 모음의 아이콘입니다. 

  2. 변경 텍스트 "레이블"을 더 나은 설명으로 대체하는 속성입니다. 선택적으로 변수 값을 포함하려면 큐브 아이콘을 클릭합니다.

  3. 페이지에 라디오 버튼을 더 추가하려면 1단계와 2단계를 반복합니다.

    더 많은 라디오 버튼

  4. 라디오 버튼을 선택한 상태에서 고급의. 아래에 , 문자열 변수를 선택합니다. 사용자가 런타임에 이 버튼을 클릭하면 변수에 고유한 값이 저장됩니다. 필요한 경우 새 변수 생성 새로운 변수를 정의합니다.

    중요한— 동일하게 할당 세트의 모든 라디오 버튼에 대한 변수입니다.

  5. 고유한 문자열을 입력하십시오. 선택한 값 텍스트 상자. 이 텍스트는 에이전트가 선택한 항목을 나타냅니다. 예를 들어, 내 선택 저장할 수 있습니다 30세 미만30세 미만 라디오 버튼이 클릭됩니다. 반대로 값을 다음으로 설정할 수 있습니다. 30세 이상 언제 30세 이상 클릭됩니다.

    set_radio_button_value2

    중요한— 다른 할당 선택한 값 텍스트 세트의 각 라디오 버튼에

    팁: 선택한 값 텍스트를 보려면 페이지에 읽기 전용 텍스트 구성 요소를 추가하십시오. 그런 다음 큐브 아이콘을 클릭하고 할당한 변수를 선택합니다. .

    그림은 라디오 버튼을 클릭했을 때 할당된 값을 표시하는 방법을 보여줍니다.

    딸깍 하는 소리 시사. 각 라디오 버튼을 클릭하면 변수 값이 변경됩니다.

    그림은 양식을 미리 볼 때 변수의 값을 보여줍니다.

    이 기술에 대한 자세한 내용은 다음을 참조하십시오. 중괄호를 사용하여 변수 값 표시.

  6. 선택적으로 에이전트가 라디오 버튼을 클릭할 때 실행할 작업을 할당합니다. 에 고급의 탭, 아래 액션 변경, 클릭 선택한 작업이 없습니다. 

    참고: 라디오 버튼에 할당된 변경 작업은 라디오 버튼에 할당된 변수 값이 변경될 때마다 실행됩니다. 예를 들어 4개의 라디오 버튼이 동일한 변수와 연결된 집합의 일부인 경우 에이전트가 집합의 4개 버튼 중 하나를 선택할 때마다 4개의 변경 작업이 모두 실행됩니다. 따라서 각 라디오 버튼에 다른 변경 작업을 할당하는 대신 라디오 버튼과 함께 사용자 지정 작업을 사용하는 것이 좋습니다.  
  7. 선택적으로 다른 속성을 설정합니다.

    공통

    글꼴 설정은 텍스트의 시각적 모양을 수정합니다. 글꼴과 크기를 변경합니다. 굵게, 기울임꼴 또는 밑줄을 원하는 조합으로 적용합니다. 주변 컨테이너 내에서 텍스트 정렬을 정당화합니다.

    Item 설명

    글꼴

    선택할 글꼴 목록을 표시합니다. 그런 다음 컨트롤의 모든 텍스트를 선택한 서체로 설정합니다.

    글꼴 크기

    글꼴 크기를 선택한 포인트 수로 설정합니다.

    글꼴 굵게

    구성 요소의 텍스트에 굵은 글꼴 두께를 적용합니다.

    글꼴 기울임꼴

    구성 요소의 텍스트에 기울임꼴 스타일을 적용합니다.

    글꼴 밑줄

    구성 요소의 텍스트에 밑줄을 긋습니다.
    정당화 왼쪽 왼쪽은 상위 컨테이너를 기준으로 구성 요소를 정렬합니다.
    정당화 중심 상위 컨테이너를 기준으로 구성 요소를 중앙에 배치합니다.
    정당화 권리 오른쪽은 상위 컨테이너를 기준으로 구성 요소를 정렬합니다.

    텍스트 색상을 다음 중 하나로 설정합니다.

    설정-bg-color-popup2
    • 기본- 기본 색상을 지정합니다.

    • 색상— 일반 색상 팔레트에서 선택하거나 RGB 값을 입력하거나 색상 선택기를 새 스펙트럼 위치로 이동하여 고유한 색상을 선택할 수 있습니다. 텍스트와 배경의 색상을 설정하는 것은 모습 패널. 이 속성 패널은 색상 기능이 있는 구성 요소에만 사용할 수 있습니다.
      딸깍 하는 소리 선택하다 현재 선택을 할당합니다.

      설정-텍스트-색상-팝업-색상

    • 변하기 쉬운- 문자열 변수에 저장된 색상을 할당합니다. 예를 들어 진한 파란색을 할당하려면 다음을 수행합니다.

      1. 클릭 변수 탭.

      2. 딸깍 하는 소리 + 변수를 추가합니다.

        그림은 새 변수를 추가하는 버튼을 보여줍니다.

      3. 선택하다 새 변수가 저장하는 값 유형입니다.

      4. 이름 상자에 설명이 포함된 이름을 입력합니다.

      5. 세트 기본 값이자형 0000FF 또는 #0000FF - 진한 파란색의 16진수 코드입니다.

        변수에서 색상 선택

      6. 딸깍 하는 소리 적용하다.
      7. 이 색상 속성에 변수를 할당합니다.

        mycolor-변수

    여러 구성 요소에는 일반적으로 디자인 모드에서 구성 요소를 두 번 클릭하여 변경할 수 있는 Text 속성이 있습니다.

    • 단추— "제출"의 이름을 다른 것으로 바꾸려면 두 번 클릭합니다.

    • 라디오 버튼 또는 체크박스- "레이블"을 보다 설명적인 이름으로 변경하려면 두 번 클릭합니다.

    • 읽기 전용 텍스트— 읽기 전용 텍스트 구성 요소에 표시된 텍스트를 변경하려면 구성 요소를 클릭한 다음 상자에 텍스트를 입력합니다.

    값은 구성 요소를 선택한 변수에 바인딩합니다. 예를 들어, 텍스트 입력 구성 요소를 변수에 바인딩하는 경우 입력 상자는 지정된 자리 표시자 텍스트를 무시하고 항상 해당 변수의 값을 표시합니다. 변수는 유효성 검사 처리에 따라 사용자가 입력한 텍스트로 자동 업데이트됩니다.

    다른 컨트롤, 예를 들어 라디오 버튼은 선택한 값 텍스트 설정과 함께 값을 사용합니다. 라디오 버튼이 런타임에 선택되면 "선택한 값 텍스트"가 변수의 새 값이 됩니다. 이런 식으로 각 라디오 버튼은 동일한 변수에 다른 값을 할당할 수 있습니다.

    달력 컨트롤이 변수에 바인딩되면 해당 값은 컨트롤에서 선택한 날짜로 설정됩니다. 변수는 시각적 컨트롤의 값을 미리 설정하고 설정할 수도 있으므로 바인딩은 강력하고 자주 사용되는 기술입니다.

    에 구성된 텍스트 선택한 값 속성은 경계에 할당됩니다 문자열 변수 라디오 버튼 선택됩니다. 바인딩된 변수는 값 설정을 사용하여 구성됩니다.

    예를 들어 양식에 2개의 라디오 버튼이 있고 둘 다 myChoice라는 문자열 변수에 바인딩되어 있다고 가정합니다. 첫 번째 라디오 버튼의 선택된 값 텍스트가 "Dogs"이고 두 번째 라디오 버튼이 "Cats"인 경우 런타임 시 myMyChoice의 값은 다음과 같습니다.

    선택된 가치의 예

    • 라디오 버튼이 선택될 때까지 MyChoice의 기본값입니다.

    • 첫 번째 라디오 버튼이 선택되면 "개"입니다.

    • 두 번째 라디오 버튼이 선택되면 "고양이"입니다.

    작업 테스트

    텍스트 필드에 {{MyChoice}}를 삽입하면 미리보기 모드에서 이것이 어떻게 작동하는지 확인할 수 있습니다. 페이지에 변수를 표시하는 기술에 익숙하지 않은 경우 중괄호를 사용하여 변수 값 표시.

    미리보기 전에 선택한 값

    미리보기 모드에서 라디오 버튼이 선택되면 MyChoice의 값은 "개" 또는 "고양이"입니다.

    선택 가치 속성 미리보기

    레이아웃

    크기 조정에 영향을 주는 가중치를 사용하여 너비를 고정 크기로 구성하고, 콘텐츠를 표시하기 위해 필요에 따라 늘리거나, 다른 구성 요소에 비해 가능한 한 많은 공간을 사용합니다.

    환경 설명
    스크립트 레이아웃 자동 크기 조정 자동 크기 조정은 구성 요소가 내용에 따라 줄어들거나 커지도록 구성합니다. 예를 들어, 레이블의 너비는 포함된 텍스트의 양에 따라 커질 수 있습니다.
    설정-사이징-스트레치

    Stretch를 사용하면 가중치를 사용하여 크기 조정에 영향을 주어 구성 요소가 다른 구성 요소에 비해 가능한 한 많은 공간을 사용할 수 있습니다.

    두 구성 요소가 모두 늘이도록 설정된 경우 기본적으로 둘 다 남은 공간의 50%가 할당됩니다. 이 비율은 가중치 값을 변경하여 조정할 수 있습니다.

    예를 들어, 한 구성요소를 가중치 200으로 설정하고 다른 구성요소를 가중치 100으로 설정하면 첫 번째 구성요소는 나머지 공간의 2/3를 차지하는 반면 다른 구성요소는 1/3만 차지합니다. 첫 번째 구성 요소의 가중치는 두 번째 구성 요소의 가중치의 두 배이기 때문에 첫 번째 구성 요소는 다른 구성 요소의 두 배 크기로 나타납니다.

    스크립트 레이아웃 픽셀 픽셀 단위로 고정 크기를 설정합니다. 상자에 정수 값을 입력하거나 위쪽 또는 아래쪽 화살표를 사용하여 크기를 늘리거나 줄일 수 있습니다. 이 화살표는 구성 요소에 포커스가 있을 때 표시됩니다.

    크기 조정에 영향을 미치는 가중치를 사용하여 높이를 고정된 크기로 구성하고, 콘텐츠를 표시하기 위해 필요에 따라 늘리거나, 다른 구성 요소에 비해 가능한 한 많은 공간을 사용합니다.

    환경 설명
    스크립트 레이아웃 자동 크기 조정 높이 자동 크기 조정은 구성 요소가 내용에 따라 줄어들거나 커지도록 구성합니다.
    스크립트 레이아웃 픽셀 높이 픽셀 단위로 고정 크기를 설정합니다. 상자에 정수 값을 입력하거나 위쪽 또는 아래쪽 화살표를 사용하여 크기를 늘리거나 줄일 수 있습니다. 이 화살표는 구성 요소에 포커스가 있을 때 표시됩니다.
    설정-사이징-스트레치

    Stretch를 사용하면 가중치를 사용하여 크기 조정에 영향을 주어 구성 요소가 다른 구성 요소에 비해 가능한 한 많은 공간을 사용할 수 있습니다.

    두 구성 요소가 모두 늘이도록 설정된 경우 기본적으로 둘 다 남은 공간의 50%가 할당됩니다. 이 비율은 가중치 값을 변경하여 조정할 수 있습니다.

    예를 들어, 한 구성요소를 가중치 200으로 설정하고 다른 구성요소를 가중치 100으로 설정하면 첫 번째 구성요소는 나머지 공간의 2/3를 차지하는 반면 다른 구성요소는 1/3만 차지합니다. 첫 번째 구성 요소의 가중치는 두 번째 구성 요소의 가중치의 두 배이기 때문에 첫 번째 구성 요소는 다른 구성 요소의 두 배 크기로 나타납니다.

    상위 컨테이너를 기준으로 구성 요소를 왼쪽, 오른쪽 또는 중앙에 정렬합니다.

    팁: 상위 컨테이너의 높이 설정이 다음과 같으면 구성 요소를 중앙에 수직으로 정렬할 수 없습니다 자동 크기 조정. 이를 수정하려면 상위 컨테이너의 높이를 다음으로 설정하십시오. 뻗기 또는 고정 높이로 픽셀.
    환경
    왼쪽 정렬2 왼쪽 정렬 예시2
    align-center2 align-center-example2
    오른쪽 정렬2 오른쪽 정렬 example2
    정렬 시작 정렬 시작 예
    align-vertical-center align-vertical-center-example
    align-vertical-end align-vertical-end-example

    여백은 테두리 주위의 왼쪽, 오른쪽, 위쪽 및 아래쪽 간격을 설정합니다.

    이미지는 여백, 테두리 및 패딩 설정 간의 관계를 보여줍니다.

    1. 선택적으로 모든 여백 값을 한 번에 업데이트하려면 모두 설정 속성 패널에서 여백 버튼.

      모두 설정 버튼의 이미지

    2. 여백에 대한 값 필드를 클릭합니다. 해당 필드에 스핀 컨트롤이 나타납니다.

    3. 스핀 컨트롤을 사용하여 여백을 늘리거나 줄입니다. 만약에 모두 설정 를 선택하면 변경 사항이 모든 여백에 적용됩니다.

      설정 여백 스피너

      구성 요소는 새 여백 설정을 사용하여 즉시 재배치됩니다.

    부울(True 또는 False) 변수 값을 기반으로 구성요소의 가시성을 설정합니다.

    1. 클릭 형세 속성 그룹. 표시 아래에서 변수 선택.
    2. 변수를 선택하거나 선택적으로 새 예/아니오 변수를 만든 다음 해당 새 변수를 보이는 재산.
    3. 런타임 시 변수 값이 True일 때 구성 요소가 표시됩니다. 반대로 변수 값이 다음과 같을 때 숨겨집니다. 거짓.

    고급

    값은 구성 요소를 선택한 변수에 바인딩합니다. 예를 들어, 텍스트 입력 구성 요소를 변수에 바인딩하는 경우 입력 상자는 지정된 자리 표시자 텍스트를 무시하고 항상 해당 변수의 값을 표시합니다. 변수는 유효성 검사 처리에 따라 사용자가 입력한 텍스트로 자동 업데이트됩니다.

    다른 컨트롤, 예를 들어 라디오 버튼은 선택한 값 텍스트 설정과 함께 값을 사용합니다. 라디오 버튼이 런타임에 선택되면 "선택한 값 텍스트"가 변수의 새 값이 됩니다. 이런 식으로 각 라디오 버튼은 동일한 변수에 다른 값을 할당할 수 있습니다.

    달력 컨트롤이 변수에 바인딩되면 해당 값은 컨트롤에서 선택한 날짜로 설정됩니다. 변수는 시각적 컨트롤의 값을 미리 설정하고 설정할 수도 있으므로 바인딩은 강력하고 자주 사용되는 기술입니다.

    에 구성된 텍스트 선택한 값 속성은 경계에 할당됩니다 문자열 변수 라디오 버튼 선택됩니다. 바인딩된 변수는 값 설정을 사용하여 구성됩니다.

    예를 들어 양식에 2개의 라디오 버튼이 있고 둘 다 myChoice라는 문자열 변수에 바인딩되어 있다고 가정합니다. 첫 번째 라디오 버튼의 선택된 값 텍스트가 "Dogs"이고 두 번째 라디오 버튼이 "Cats"인 경우 런타임 시 myMyChoice의 값은 다음과 같습니다.

    선택된 가치의 예

    • 라디오 버튼이 선택될 때까지 MyChoice의 기본값입니다.

    • 첫 번째 라디오 버튼이 선택되면 "개"입니다.

    • 두 번째 라디오 버튼이 선택되면 "고양이"입니다.

    작업 테스트

    텍스트 필드에 {{MyChoice}}를 삽입하면 미리보기 모드에서 이것이 어떻게 작동하는지 확인할 수 있습니다. 페이지에 변수를 표시하는 기술에 익숙하지 않은 경우 중괄호를 사용하여 변수 값 표시.

    미리보기 전에 선택한 값

    미리보기 모드에서 라디오 버튼이 선택되면 MyChoice의 값은 "개" 또는 "고양이"입니다.

    선택 가치 속성 미리보기

    모든 구성 요소는 기본적으로 활성화되어 있습니다. Disabled 속성은 True/False 변수를 구성 요소에 바인딩하여 변수의 런타임 값을 기반으로 비활성화하거나 활성화합니다.

      1. 참/거짓 변수를 생성하려면 변수 탭.

      2. 추가를 클릭합니다. 변수를 추가합니다.

        그림은 새 변수를 추가하는 버튼을 보여줍니다.

      3. 선택하다 허위 사실 데이터 유형으로.

        그림은 가변 데이터 유형을 보여줍니다.

      4. 에서 이름 상자에 설명이 포함된 이름을 입력합니다.

        현재 활성화된 변수

      5. 기본값을 다음으로 설정 진실 또는 거짓.

        • 변수가 True이면 구성 요소가 비활성화됩니다.

        • 변수가 False이면 구성 요소가 활성화됩니다.

      6. 변수를 저장하려면 적용하다.
      7. Disabled 속성에 변수를 할당합니다. 아래에 장애가있는, 클릭 변수 선택.

        비활성화된 속성 설정

      8. 참/거짓 변수를 선택합니다.

        현재 활성화 변수 선택

    작업을 테스트하려면 시사.

    NS 액션 변경 속성을 사용하면 이 구성 요소의 상태나 값이 변경될 때 실행되는 작업을 설정할 수 있습니다.

    Scripter 작업, 아웃바운드 작업 또는 사용자 지정 작업을 선택할 수 있습니다. Outbound 속성이 활성화되어 있지 않으면 아웃바운드 작업을 사용할 수 없습니다. 

    모양

    글꼴 설정은 텍스트의 시각적 모양을 수정합니다. 글꼴과 크기를 변경합니다. 굵게, 기울임꼴 또는 밑줄을 원하는 조합으로 적용합니다. 주변 컨테이너 내에서 텍스트 정렬을 정당화합니다.

    Item 설명

    글꼴

    선택할 글꼴 목록을 표시합니다. 그런 다음 컨트롤의 모든 텍스트를 선택한 서체로 설정합니다.

    글꼴 크기

    글꼴 크기를 선택한 포인트 수로 설정합니다.

    글꼴 굵게

    구성 요소의 텍스트에 굵은 글꼴 두께를 적용합니다.

    글꼴 기울임꼴

    구성 요소의 텍스트에 기울임꼴 스타일을 적용합니다.

    글꼴 밑줄

    구성 요소의 텍스트에 밑줄을 긋습니다.
    정당화 왼쪽 왼쪽은 상위 컨테이너를 기준으로 구성 요소를 정렬합니다.
    정당화 중심 상위 컨테이너를 기준으로 구성 요소를 중앙에 배치합니다.
    정당화 권리 오른쪽은 상위 컨테이너를 기준으로 구성 요소를 정렬합니다.

    텍스트 색상을 다음 중 하나로 설정합니다.

    설정-bg-color-popup2
    • 기본- 기본 색상을 지정합니다.

    • 색상— 일반 색상 팔레트에서 선택하거나 RGB 값을 입력하거나 색상 선택기를 새 스펙트럼 위치로 이동하여 고유한 색상을 선택할 수 있습니다. 텍스트와 배경의 색상을 설정하는 것은 모습 패널. 이 속성 패널은 색상 기능이 있는 구성 요소에만 사용할 수 있습니다.
      딸깍 하는 소리 선택하다 현재 선택을 할당합니다.

      설정-텍스트-색상-팝업-색상

    • 변하기 쉬운- 문자열 변수에 저장된 색상을 할당합니다. 예를 들어 진한 파란색을 할당하려면 다음을 수행합니다.

      1. 클릭 변수 탭.

      2. 딸깍 하는 소리 + 변수를 추가합니다.

        그림은 새 변수를 추가하는 버튼을 보여줍니다.

      3. 선택하다 새 변수가 저장하는 값 유형입니다.

      4. 이름 상자에 설명이 포함된 이름을 입력합니다.

      5. 세트 기본 값이자형 0000FF 또는 #0000FF - 진한 파란색의 16진수 코드입니다.

        변수에서 색상 선택

      6. 딸깍 하는 소리 적용하다.
      7. 이 색상 속성에 변수를 할당합니다.

        mycolor-변수