VisualWorksTutorial2:Page12

웹로그의 통계2 레슨11
출력 선택 고르기

| 목차 | 레슨10 | 레슨12 |

현재, 화면과 외부 파일 양쪽에 통계치를 출력할 수 있기 때문에, 유저가 선택할 수 있게 되었습니다.

VisualWorks는 두 개의 드롭다운(선택) 박스가 있습니다. 이 레슨에서는, 유저가 Web로그 통계치 출력 장소를 맘대로 고를 수 있도록, 드롭다운 박스(중 한가지)를 사용하겠습니다(화면, 외부 파일, 양쪽에 출력).

화면이나 파일에만 출력하는 거라면 라디오 버튼만으로도 충분했습니다. 하지만, 양쪽 모두의 경우도 필요합니다. 실제로 세 개를 사용하면 됩니다만(화면, 파일, 양쪽), 이 튜토리얼(라디오 버튼은 레슨 4에서 사용법을 학습했습니다)에서는, 선택(드롭 다운) 박스를 사용합니다.

VisualWorks에는 두 가지의 다른 드롭다운(선택) 박스가 있습니다.

메뉴 버튼
콤보 박스

메뉴 버튼은 선택지가 정적이거나 혹은 고정된 경우에 주로 사용합니다. 콤보 박스는 실행시 데이터에 의해 선택지를 변경할 경우 사용합니다. 콤보 박스의 예는 UIPainter 입력 필드의 속성 다이얼로그에 있습니다. 타입의 위젯은 메뉴버튼입니다만, 포맷의 위젯 버튼은 콤보 박스입니다. 다른 타입이 선택될 경우, 포맷(위젯) 내의 일람이 어떻게 변화하는지 주목해주십시오.

이미 일람의 항목은 알고 있으니, 이 레슨에서는 메뉴 버튼을 사용합니다. 메뉴 바 이외에 메뉴 에디터를 사용하는 경우에 대한 좋은 연습이 될것입니다.

1. System Browser 윈도우가 열려있는 경우엔 닫아주십시오. GUI페인터 툴이 열려있는 경우엔 그곳으로 되돌아가주십시오. 만일 닫혀있는 경우엔 WebLogGUI를 열어주십시오.(레슨 6의 스텝 12-15를 참조)

2. GUI페인터 툴에서 Tool>>Menu Editor 메뉴를 선택해주십시오.

3. 메뉴 에디터 윈도우에서 편집메뉴를 선택하고 신규항목을 선택하거나, 툴바 두 번째 버튼(활성화 되어있는 단 한 가지 버튼)을 클릭해주십시오.

4. 문자열 입력 필드에 외부 파일을 입력해주십시오. 탭 키를 눌러주십시오. 값 필드에 #file을 입력해주십시오.

5. 메뉴 에디터에서 편집 메뉴를 선택하고, 다시 신규항목을 선택하거나 툴바 두 번째 버튼을 클릭해주십시오.

6. 문자열 입력 필드에 화면을 입력해주십시오. 탭 키를 눌러주십시오. value 필드에 #screen을 입력해주십시오.

7. 메뉴 에디터에서 편집 메뉴를 선택해서 다시 신규항목을 선택하거나, 툴바 두 번째 버튼을 클릭해주십시오(이미 이 조작에 익숙해졌을 겁니다).

8. 문자열 입력 필드에 양쪽을 입력해주십시오. 캡 키를 눌러주십시오. value 필드에 #both를 입력해주십시오.

9. 메뉴 에디터에서 Menu>>Install을 선택하거나 툴바에서 첫번째 버튼을 클릭해주십시오.

10. 다음 다이얼로그 박스에서 다음 클래스에 인스톨에 표준으로 표시되는 WebLogGUI은 그대로 두어도 됩니다. 마지막 입력 필드(혹은 신규 셀렉터를 입력:)에 outputChoices를 입력하고 OK를 클릭해주십시오.

그림 11-4. WebLogGUI 클래스에 outputChoices메뉴를 인스톨

11. 메뉴 에디터를 닫아주십시오.

12. 캔버스의 logList 위젯 위에 메뉴버튼 위젯(상단 8번째)를 배치하고, 메뉴 버튼 위에 라벨을 배치합니다.

13. 아래 표에 따라 속성을 설정해주십시오.

Entity	속성	설정
라벨	문자열	Results
메뉴 버튼	문자열	공백 그대로
메뉴 버튼	Aspect	#outputChoiceUI
메뉴 버튼	메뉴	#outputChoices

14. GUI페인터 툴로 돌아가주십시오. 메인 윈도우(위젯 일람에서 첫 엔티티)를 선택해주십시오. 배치/사이즈 탭을 클릭하고 윈도우 사이즈 변경을 반영하기 위해 아래와 같은 설정을 해주십시오.

어드벤스 라디오 버튼을 클릭해주십시오.
배치 아래 있는 첫 번째 라디오 버튼(시스템 표준)을 클릭해주십시오
사이즈 아래 있는 두 번째 라디오 버튼(지정 사이즈)를 클릭후, 지정 버튼을 클릭해주십시오

15. 인스톨 버튼을 클릭해주십시오

16. 메뉴 버튼을 선택하고, 지정 버튼을 클릭해 부십시오. 메뉴 버튼(outputChoiceUI)만 표시되어 있을 것입니다.

17. outputChoicesUI와 초기화를 추가 박스에 체크가 되어있는 것을 확인해주십시오. OK를 클릭해주십시오.

18. 메인 윈도우를 클릭(선택)하고 인스톨 버튼을 클릭해주십시오.

outputChoicesUI가 인스턴스 변수 일람에 자동적으로 추가됩니다.

19. GUI페인터 툴의 Browse 버튼을 클릭해주십시오. 인스턴스 탭이 선택된 것을 확인해주십시오. startWebLog 메서드를 아래와 같이 수정해주십시오.

startWebLog 
	aWebLog initialize. 
	aWebLog filter: filterUI value. 
	aWebLog logDirectory: logDirectoryUI value. 
	aWebLog maxPages: maxPagesUI value. 
	Cursor wait showWhile: [aWebLog start]. 
	(outputChoiceUI value = #file) | (outputChoiceUI value = #both) 
		ifTrue: [aWebLog outputStats.]. 
	(outputChoiceUI value = #screen) | (outputChoiceUI value = #both) 
		ifTrue: [logList list: aWebLog stats].

드롭다운의 선택을 조작하는 이 메서드에 대한 로직을 추가하면 모두 완료입니다. 세로줄(pipe)은 "논리OR" 을 의미합니다. 어느 한쪽의 조건이 참이면 문 전체가 참이 됩니다.

20. System Browser를 닫아주십시오. GUI페인터 툴의 윈도우 열기 버튼을 클릭해주십시오. 어플리케이션을 테스트합니다. 전부 동작하는 것을 확인해주십시오.

21. System Browser 윈도우로 돌아가주십시오. 패키지 Pane(맨 좌측)에서 WebLogStats 패키지까지 스크롤해주십시오.

22. 패키지 Pane에서 WebLogStats를 클릭(선택)해주십시오. <오퍼레이트 클릭>후 Save to File을 선택해주십시오.

23. weblogstats_2_stage8.st를 입력해주십시오.

정리

GUI에서 리스트 선택과 드롭다운으로 선택(메뉴버튼)을 추가하는 방법을 학습하였습니다. 이것으로 어플리케이션에 대한 기능은 완성입니다. 남은 것은 GUI을 좀 더 보기 좋게 만드는 것 뿐입니다.

아래와 같은 내용을 학습하였습니다

드롭다운으로 선택(메뉴 버튼)을 사용

| 목차 | 레슨10 | 레슨12 |

VisualWorksTutorial2:Page12

Navigation menu

Search