RadioGroup

여러 옵션 중 단일 선택이 필요한 UI의 경우 RadioGroup컨트롤을 직접 사용할 수 있습니다. 옵션 중 하나를 클릭하면 옵션이 자동으로 선택된 상태로 전환되고 동일한 그룹의 다른 옵션은 선택되지 않은 상태가 됩니다. 이러한 옵션의 상태를 전환하는 동안 그림과 색상도 속성 창의 설정에 따라 자동으로 전환됩니다.

사용법

1. 더블 클릭하여 UI 파일을 엽니다.

2. 우측의 컨트롤 박스에서 RadioGroup 컨트롤을 찾습니다.

   
   

3. RadioGroup컨트롤에서 마우스 왼쪽 버튼을 클릭 한 상태에서 원하는 위치로 드래그 한 후 왼쪽 버튼을 놓으면 자동으로 직사각형 영역이 생성되는 것을 볼 수 있고, 그 역역은 RadioButton컨트롤을 보유 할 수있는 컨테이너를 나타냅니다.

4. 동일한 드래그 앤 드롭 방법을 사용하여 지금 바로 직사각형 영역에 여러 RadioButton컨트롤을 추가 할 수 있습니다.

5. 추가 된 RadioButton컨트롤을 마우스 왼쪽 버튼으로 클릭하면 우측에서 관련 속성을 볼 수 있습니다. 필요에 따라 각 컨트롤의 각 상태에 따른 그림과 색상을 설정할 수 있습니다. 여기서 Picture and Background Colors속성에 주의하십시오.

   

   그림을 설정 한 후 그림의 크기가 비정상적으로 표시되는 경우 Picture Location속성에서 그림의 위치와 크기를 조정할 수 있습니다. Default State속성에서 Checked또는 Unchecked을 설정할 수도 있습니다.

6. 속성 설정 후 컴파일하면 해당하는 Logic.cc에 관련 함수가 생성됩니다. RadioButton 중 하나를 클릭하면 시스템에서 관련 함수를 호출합니다. 여기서 int checkedID매개 변수는 선택한 RadioButton의 'ID'를 나타내고, 이 ID 값을 기반으로 현재 클릭 된 RadioButton을 확인할 수 있습니다.
   이 'ID'는 매크로 정의 정수 값입니다. UI파일이 컴파일 된 후 각 컨트롤은 해당 매크로 ID를 자동으로 생성합니다(매크로에 대한 자세한 내용은 이름 지정 규칙을 확인하십시오). 각 옵션의 매크로 ID는 해당Activity.h 헤더 파일에서 찾을 수 있습니다.
   예 :

   

   그런 다음 관련 함수에서 클릭된 항목이 무엇인지 판단 할 수 있습니다.

    static void onCheckedChanged_RadioGroup1(ZKRadioGroup* pRadioGroup, int checkedID) {
      LOGD("Checked ID = %d", checkedID);
      switch (checkedID) {
        case ID_MAIN_RadioButton1:
          LOGD("First RadioButton");
          break;
        case ID_MAIN_RadioButton2:
          LOGD("Second RadioButton");
          break;
        case ID_MAIN_RadioButton3:
          LOGD("Third RadioButton");
          break;
        default:
          break;
      }
    }
   

7. 다운로드 및 디버그하여 효과를 확인합니다.

Sample code

Sample Code의 RadioGroupDemo 프로젝트를 참고하십시오.

예제 미리보기 :