키스맥 - 4th Dimension 매킨토시 전문 웹 매거진 웹진

  + 파일메이커 기초편
  + 4th Dimension
  + 리얼베이직
  + OS X 10.3
  + 홈페이지 만들기
  + 포토샵 강좌
  + 디카 완전정복
  + 실무로 배우는 Quark
  + MLayout
  + iPod 강좌
  + html 강좌
  + 간단매뉴얼&팁
  + 5세대 iPod 강좌
  + iTunes 한 컷 강좌
  + iPod 한컷강좌
            


Chapter19. 메소드(Method)의 실제 사용법


Chapter_019 : 이번 시간에는 메소드(Method)의 실제 사용법에 대하여 알아보도록 하겠습니다.

학습 순서 1 : 메소드(Method)의 실제 사용법 1.
학습 순서 2 : 메소드(Method)의 실제 사용법 2.
학습 순서 3 : 질문 및 답변.

메소드(Method)라고 하는 것은 4D 명령어들의 조합을 말합니다. 그리고 메소드를 구현하는 방법은 크게 3가지로 분류할 수 있겠습니다.

첫번째 방법은, 가장 많이 그리고 널리 사용되는 방법으로 하나의 오브젝트 안에 메소드를 집어넣는 방법입니다.
두번째 방법은, 별도의 메소드를 외부에 따로 만들어 놓고 이것을 필요로 할 때마다 여러 오브젝트에서 잠깐 불러다 사용하는 방법입니다.
세번째 방법은, 메소드 안에서 또 다른 외부 메소드를 호출하여(한개이든 여러개이든) 사용하는 방법입니다.

사실 위와 같은 설명은 이해가 잘 가지 않기 때문에 오늘 이 시간에는 첫번째 방법과 두번째 방법까지만 살펴보도록 하며, 세번째 방법은 다음 시간에 보다 자세히 살펴보도록 하겠습니다.



위 그림 1 : 데스크탑 화면에서 "4th Dimension KO" 가상본 파일을 더블-클릭하여 실행합니다.

위 그림 2 : Identification 윈도우가 나타나면 하단의 I agree 라디오 버튼을 누르고 하단 오른쪽의 "Next >" 버튼을
눌러줍니다.

위 그림 3 : 이번에는 하단 중앙에 있는 "Demo" 버튼을 누릅니다.

위 그림 4 : "Open Database" 윈도우가 나타나면 상단에 있는 빨간색 원 1~3번까지 차례대로 눌러줍니다.

참고 : 새로운 샘플 프로그램을 만들기 위한 작업이 되겠습니다.

위 그림 5 : 샘플 프로그램이 저장될 "4th Dimension 6.8 Exercise" 폴더로 이동한 다음 파일명을 "Method Sample"라고 적어준 후, 하단 오른쪽에 있는 "저장" 버튼을 눌러줍니다.

위 그림 6 : 4th Dimension 메인 화면입니다. 각각의 윈도우는 보기 좋게 정돈한 것입니다. ^^ 스트럭처 윈도우가 비활성 되어 있다면 "파일구조 : Method Sample" 윈도우를 마우스로 클릭하여 활성화 시키십시오.

참고 : 스트럭처 윈도우가 선택(활성화)된 상태를 "디자인-모드(Design-Mode)"라 부릅니다.

이번에는 기본적인 세팅 과정을 거치기 위하여 메뉴바 "File > Database Properties..." 항목을 선택합니다. 그리고 Chapter_005과의 9~34번 그림과 같은 과정을 거쳐줍니다.

위 그림 7 : 작업에 들어가기전 모든 세팅과정을 마치셨다면 메뉴바의 "Design>Edit Form..." 항목을 선택합니다.

위 그림 8 : 익스플로러 윈도우가 나타납니다. 위 그림과 같이 "Forms" 탭-버튼이 선택되어 있는 상태에서 맨 하단 왼쪽에 있는 "New" 버튼을 눌러줍니다.

위 그림 9 : 별다른 변동사항 없이 하단에 있는 "Use" 버튼을 눌러줍니다.

참고 : 새로운 폼(Form)을 만드는 과정이 되겠습니다.

위 그림 10 : 익스플로러 윈도우로 다시 돌아온 모습입니다. 빨간색 원 1~2번을 차례대로 누르다음 맨 하단에 있는 "Input Form", "Output Form" 체크 버튼 2개를 위 그림과 같이 모두 활성화 시킵니다.(파란색으로 표시된 부분) 그러면 빨간색 원 2번의 맨 오른쪽 부분에 알파벳 "B"라고 표시될 것입니다.(오렌지색으로 표시된 부분)

참고 : 오렌지 색으로 표시된 알파벳 "B"라는 글자의 뜻은, 하나의 폼(Fomr)으로 인풋폼과 아웃풋 폼을 동시에(함께) 사용하겠다는 뜻이 되겠습니다. 원래는 인풋 폼 하나, 아웃풋 폼 하나 이렇게 별도로 만들어줘야 되지만 이렇게도 제작하여 사용할 수 있다는 것을 알려드리기 위함입니다. ^^

모든 설정을 마치셨다면 맨 하단에 있는 "Edit" 버튼을 누릅니다.

위 그림 11 : 폼 안으로 들어온 화면입니다.

이번에는 오브젝트 편집 작업을 보다 손쉽게 하기 위하여 메뉴바의 "Form > Turn Grid On" 항목을 선택합니다. 이 기능을 켜 놓으시면 여러 오브젝트들이 점으로 이루어진 격자에(모눈종이 같은) 자동으로 달라붙어 보기좋은 정렬을 제공하여 줍니다. (격자의 간격을 별도로 조정하기 위해서는 "Form > Grid Definition..." 항목을 선택하시면 되겠습니다.)

참고 1 : 빨간색으로 표시된 "Property List" 윈도우가 나타나지 않는다면 메뉴바의 "Form > Display > Property List" 항목을 선택합니다. (앞으로 해당 오브젝트를 더블-클릭 할 때마다 위 그림과 같이 빨간색으로 표시된 "Property List" 윈도우만 나타날 것입니다. ^^)

참고 2 : 현재 보고 계시는 폼 윈도우 화면은 1페이지 입니다. (파란색으로 표시된 부분의 1/1 라는 뜻은 총 1페이지 중에서 현재 1번 페이지를 보여주고 있다는 뜻이 되겠습니다.)

위 그림 12 : 빨간색 원 1번으로 표시된 "이전 페이지로 이동" 버튼을 눌러줍니다. 그리고 빨간색 원 2번으로 표시된 "탭-컨트롤" 버튼을 눌러줍니다.

위 그림 13 : 위 그림과 같이 "탭-컨트롤" 오브젝트를 적당한 크기로 만들어 줍니다.

빨간색 원 1번 : 시작점 (마우스 버튼을 누르고 있는 상태에서 빨간색 원 2번 지점까지 이동함)
빨간색 원 2번 : 끝점 (마우스 버튼에서 손을 뗌)

위 화면과 같이 "탭-컨트롤" 오브젝트를 하나 만드셨다면 이번에는 "Property List" 윈도우에 있는 "Value List" 항목에 있는 "Edit..." 버튼을 눌러줍니다. (빨간색의 네모 박스로 표시된 부분)

참고 : 오렌지색으로 표시된 부분을 보시면 "0/1"이라고 나타날 것입니다. 0(영, 제로)페이지는 기본적으로 모든 폼 윈도우에 자동으로 제공됩니다.
폼-페이지는 사용자가 원하는 수만큼 만들거나 또는 삭제할 수 있으며 0페이지에서 만든 오브젝트는 모든 페이지에 동일하게 나타나는 효과를 보여줍니다. 예를 들면 다음과 같습니다. (단, 0페이지와 1페이지는 삭제할 수 없습니다.)

만약 총 5개의 페이지를 사용자가 만든 후, 0페이지에 하나의 오브젝트를 만들었다면 1페이지부터 5페이지까지 다 보여지게 됩니다. ^^
이 부분은 다음 시간에 보다 자세히 살펴보도록 하겠습니다. ^^

위 그림 14 : 위 그림과 같이 "1페이지"라고 입력한 다음 리턴키를 누르고 이와 같은 방법으로 "5페이지"까지 입력한 다음 하단 오른쪽에 있는 "OK" 버튼을 누릅니다.

위 그림 15 : 이번에는 버튼 하나를 만들어 보도록 하겠습니다. 빨간색으로 표시된 "버튼 오브젝트" 버튼을 누릅니다.

참고 : 툴-팔레트에 있는 여러개의 버튼을 자세히 살펴보시면 각 하나 하나의 버튼 오른쪽 하나에 검은색으로 된 작은 삼각형 기호가 있는 것이 있고 없는 것이 있습니다.(노란색 원으로 표시된 부분) 검은색으로 된 작은 삼각형이 있는 버튼을 마우스로 1초 이상 누르고 계시면 여러 종류의 하위 항목이 나타나게 됩니다. ^^

위 그림 16 : "탭-컨트롤" 오브젝트의 오른쪽 맨 하단 부분에 "버튼 오브젝트" 하나를 만들었습니다.

위 그림 17 : "Property List" 윈도우에서 "Standard Action" 항목을 마우스로 누르시면 하늘색으로 표시됩니다. 바로 오른쪽에서 "Cancel" 항목을 선택합니다.

참고 : 버튼 속성으로 "Cancel" 값을 지정하게 되면 취소작업이 아닌 해당 윈도우(현재 화면에 보여지는 윈도우)를 빠져나가는 효과를 나타냅니다.

위 그림 18 :빨간색 1번으로 표시된 "오브젝트 선택" 버튼을 누르신 다음에 곧바로 1페이지로 이동하기 위하여 빨간색 2번으로 표시된 "다음 페이지로 이동" 버튼을 누릅니다.

참고 : 빨간색 원 1번을 누를 필요없이 그냥 2번만 누르셔도 됩니다. ^^

위 그림 19 : 1페이지로 되돌아온 화면입니다. 오른쪽 맨 하단을 보시면 오렌지색으로 표시된 영역안에 "1/1"라고 보이는군요. ^^

14번 그림에서 작업한 탭-버튼에 대한 항목 내용도 한글로 잘 보입니다. ^^ 총 5개의 페이지가 보여지네요. 0페이지까지 포함하면 총 6개의 페이지가 되겠습니다.

참고 : 13번 그림의 참고 설명 중에서, 0페이지에서 만든 오브젝트 내용(화면)은 1페이지를 포함한 그 이상의 페이지에서 동일하게 보여진다고 설명을 드렸었습니다. 이제 대충이나마 이해가 되시지요? 0페이지에서 만든 "탭-컨트롤" 오브젝트와 한개의 "버튼" 오브젝트가 지금 1페이지에서 그대로 보이니까요. ^^

위 그림 20 : 이번에는 1페이지 화면에서 여러개의 오브젝트를 추가해 보도록 하겠습니다. 먼저 툴-팔레트에서 빨간색으로 표시된 "텍스트 오브젝트" 버튼을 누릅니다.

위 그림 21 : 보시는 화면과 같이 하나의 "텍스트 오브젝트"를 만들어 줍니다. "Sample Text" 라는 글자가 자동으로 보여지면서 선택된 상태입니다. (하늘색으로 반전)

위 그림 22 : "문자열 1 :" 이라고 수정하여 줍니다.

위 그림 23 : 이번에는 툴-팔레트에서 빨간색으로 표시된 "액티브(Active, 활성) 오브젝트" 버튼을 선택합니다. 이 오브젝트는 글자나 그림을 입력할 수 있는 오브젝트를 말합니다. 물론 입력된 내용을 보여줄 때도 사용할 수 있습니다. ^^

위 그림 24 : 보시는 화면과 같이 하나의 "액티브 오브젝트"를 만듭니다. 기본적으로 "Variable1"이라는 글자가 자동으로 입력되어 있으나 이것을 수정해 보도록 하겠습니다.

위 그림 25 : "Property List" 윈도우의 "Variable Name(변수명, 변수 이름)" 항목을 마우스로 누르시고 (하늘색으로 반전됨) 곧바로 "vs10_String1" 이라고 입력합니다. 그리고 키보드의 리턴키를 눌러줍니다.

위 그림 26 : 변수명이 수정되었습니다. 24번 그림과 비교하여 보시기 바랍니다. ^^

위 그림 27 : 이번에는 마우스를 이용하여 화면에 보이는 2개의 오브젝트를 동시에 선택합니다. (일명, 드래그 선택 또는 마우스 끌기 선택이라고도 부릅니다)

위 그림 28 : 2개의 오브젝트가 함께 선택된 모습입니다. 이번에는 이것을 복사하여 보도록 하겠습니다.



위 그림 29 : 곧바로 메뉴바의 "Object > Duplicate" 항목을 선택합니다.

위 그림 30 : 2개의 오브젝트가 손쉽게 복사되었습니다.

위 그림 31 : 복사된 오브젝트를 적당한 위치로 보기좋게 나열한 모습입니다.

참고 : 11번 그림에서 메뉴바의 "Form > Turn Grid On" 기능을 켜 놓았으므로 선택된 오브젝트를 이리 저리 옮길대마다 작은 검은색의 점으로 이루어진 격자에(모눈종이 같은) 자동으로 달라붙어 보기좋은 정렬을 도와줍니다. (격자의 간격을 별도로 조정하기 위해서는 "Form > Grid Definition..." 항목을 선택하시면 되겠습니다.)

위 그림 32 : 이번에는 방금 복사된 오브젝트 중에서 "텍스트 오브젝트" 내용을 수정하여 보도록 하겠습니다. 툴-팔레트에서 빨간색으로 표시된 "텍스트 오브젝트" 버튼을 누릅니다. 그리고 방금 복사된 2번째 "문자열 1 :"라고 적혀있는 텍스트 오브젝트를 마우스로 한번만 눌러줍니다. 그러면 수정이 가능하도록 입력 커서가 들어갈 것입니다.

위 그림 33 : "문자열 2 :"라고 수정하여 줍니다.

위 그림 34 : 이번에는 툴-팔레트에서 빨간색으로 표시된 "오브젝트 선택" 버튼을 누릅니다.

위 그림 35 : 방금 복사한 2번째 액티브 오브젝트 "vs10_String1"을 마우스로 한번 클릭하여 선택한 다음 "Property List" 윈도우의 "Variable Name" 항목을 마우스로 선택하고(하늘색으로 반전된 부분) 변수명을 "vs10_Strinng2"라고 수정하여 줍니다. 그리고 키보드의 리턴키를 눌러줍니다.

위 그림 36 : 수정된 후의 화면입니다. 35번 그림과 비교하여 보시기 바랍니다. ^^

위 그림 37 : 이번에는 27번 그림과는 다른 방법으로 2개의 오브젝트를 선택하여 보도록 하겠습니다. 먼저 키보드의 쉬프트(Shift) 키를 누르고 있는 상태에서 "문자열 2 :"라고 적혀있는 텍스트 오브젝트를 마우스로 한번만 눌러줍니다. 그리고 계속해서 오른쪽에 있는 "vs10_Strinng2" 라고 적혀있는 "액티브 오브젝트"도 마우스로 눌러줍니다. 그려면 차례대로 선택될 것입니다. 이제 키보드의 쉬프트(Shift) 키에서 손을 뗍니다.

위 그림 38 : 다시 한번 메뉴바의 "Object > Duplicate" 항목을 선택합니다.

위 그림 39 : 복사된 후의 화면이 되겠습니다. 이번에도 복사된 오브젝트의 내용을 수정하도록 하겠습니다. 그림 32번에서와 같이 툴-팔레트에서 빨간색으로 표시된 "텍스트 오브젝트" 버튼을 누르고 방금 복사된 3번째 "문자열 2 :"라고 적혀있는 텍스트 오브젝트를 마우스로 한번 눌러줍니다. 그러면 수정이 가능하도록 입력 커서가 들어갈 것입니다. "문자열 3 :"이라고 수정하여 줍니다.

위 그림 40 : 텍스트 오브젝트의 내용이 "문자열 3 :" 이라고 수정되었습니다. 그리고 이번에는 바로 옆에 있는 "액티브 오브젝트"의 변수명도 수정하여 보도록 하겠습니다.

먼저 34번 그림의 툴-팔레트에서 빨간색으로 표시된 "오브젝트 선택" 버튼을 누릅니다.
마우스를 이용하여 "vs10_String2" 라고 적혀있는 3번째 "액티브 오브젝트"를 눌러줍니다. 그리고 "Property List" 윈도우의 "Variable Name" 항목을 선택하시고(하늘색으로 반전) 변수명을 "vs20_StringTotal" 이라고 수정합니다. 그리고 키보드의 리턴키를 눌러줍니다.

위 그림 41 : 이번에는 버튼 하나를 만들어 보도록 하겠습니다. 먼저 툴-팔레트에서 빨간색으로 표시된 "버튼 오브젝트" 버튼을 눌러줍니다.

위 그림 42 : 위 그림과 같이 새로운 버튼 하나를 만들었습니다. "Button" 이라는 글자가 자동으로 들어가 있습니다. 이부분을 수정하여 보도록 하겠습니다.

위 그림 43 : "Property List" 윈도우에서 "Title" 항목을 선택하고(하늘색으로 반전) "문자열 더하기"라고 수정하여 줍니다. 만약 한글로 입력할 때, 깨어지는 증상이 나타나면 그냥 무시하고 입력하여 보십시오. 입력이나 수정작업을 마치셨다면 키보드의 리턴키를 눌러줍니다. (입력할 때 깨져 보였던 한글이 정상적으로 보일 것입니다.)

위 그림 44 : 버튼 제목이 한글 내용으로 수정되었습니다. 42번 그림과 비교하여 보시기 바랍니다. ^^

위 그림 45 : 이번에는 "vs20_StringTotal" 이라고 적혀있는 오브젝트를 선택합니다.

위 그림 46 : "Property List" 윈도우의 "Enterable" 항목을 선택하시고(하늘색으로 반전) 바로 옆에 있는 체크 박스를 해제합니다.

참고 : 오브젝트 안에 어떠한 내용을 입력할 수 없도록, 다시 말하면 보여주기만 가능한(보기 전용) 오브젝트로 만드는 과정이 되겠습니다.

위 그림 47 : 해당 오브젝트의 색상이 조금 바뀌었네요.(자동으로 바뀝니다.) 변경하기 전의 45번 그림과 비교하여 보시기 바랍니다. ^^
이왕 이렇게 된 것 기왕이면 컬러색상을 입혀보도록 하겠습니다. ^^

메뉴바의 "Form > Display > Object Properties" 항목을 선택합니다.

위 그림 48 : "Object Properties" 윈도우가 나타납니다. 보시는 화면과 같이 빨간색 1번~4번까지 차례대로 따라합니다.

위 그림 49 : 변경한 후의 화면이 되겠습니다. ^^ 해당 오브젝트에 칼라 색상을 입히시려면 이와 같은 방법을 사용하시면 되겠습니다.

위 그림 50 : "vs10_String1" 오브젝트를 마우스로 선택합니다. 그리고 "Property List" 윈도우를 다시 호출하기 위하여 메뉴바의 "Form > Display > Property List" 항목을 선택합니다. 위 그림과 같이 "Property List" 윈도우가 나타나면 "Events" 항목으로 이동한 다음 "On Load" 이벤트 하나만 활성화 하시고 나머지는 전부 해제합니다. (체크박스 버튼)

참고 1 : 불필요한 이벤트는 가급적 해제하여 놓으시고 꼭 필요한(사용될) 이벤트 항목만 체크하여 사용하시길 권장합니다. (나중에 혹시라도 발생할 수 있는 여러 에러 증상을 미연에 방지할 수 있는 좋은 습관이라 하겠습니다.)

참고 2 : "On Load" 이벤트는 해당 폼(Form) 윈도우가 열리기 전 어떠한 내용을 먼저 실행(초기화 및 계산)한 다음, 폼-윈도우가 화면에 나타나도록 하는 이벤트입니다.
다시 설명드리면, 폼 윈도우를 먼저 화면에 보여주고 변수의 초기화 및 계산같은 작업을 뒤늦게 하는 것이 아니라 먼저 초기화할 변수는 초기화하고(0이나 또는 공백등으로...) 또는 계산할 것이 있으면 계산할 것 다하고 난 맨 마지막에 가서야 폼-윈도우가 화면에 보여지는 것을 말합니다.

위 그림 51 : 이번에는 실제적인 메소드 내용을 해당 오브젝트 안에 집어넣도록 하겠습니다. 이번에는 "Object Method" 항목을 마우스로 선택한 다음, 바로 옆에 있는 "Edit..." 버튼을 눌러줍니다.

참고 : 이와 같이 메소드 내용을 해당 오브젝트 안에 집어 넣는 방법은 가장 보편적이고 널리 사용되는 방법이 되겠습니다. ^^

위 그림 52 : 변수명 "vs10_Strinng1" 오브젝트의 메소드 화면이 되겠습니다. 위와 동일한 내용을 입력하시고 윈도우를 닫습니다.

참고 : 위 내용중 "" (이중 따옴표 기호를 2번 연속으로 입력합니다) 기호는 빈 공백을 뜻합니다. 다시말하면 나중에 폼-윈도우가 열리기 전 vs10_String1 변수를 아무런 내용도 들어있지 않은 빈 공백으로 채워넣은 후 폼-윈도우를 보여줘라~ 하는 뜻이 되겠습니다.

위 그림 53 : "vs10_Strinng1" 오브젝트안에 메소드 내용이 들어가면(첨가되면) 보시는 화면과 같이 오브젝트의 색상이 약간 달라집니다. 50번 그림과 비교하여 보시기 바랍니다. ^^

위 그림 54 : 이번에는 "vs10_Strinng2" 오브젝트를 선택하고 지금 보고 계시는 "Property List" 윈도우 화면과 같이 똑같이 이벤트 항목을 설정하여 줍니다.

위 그림 55 : 이벤트만 체크한다고해서 해당 오브젝트가 53번 그림과 같이 변경되지는 않습니다. ^^;;;

위 그림 56 : 이번에는 51번 그림에서 이미 설명드린 것과는 조금 다른 방법으로 메소드 윈도우를 호출하여 보도록 하겠습니다.
키보드의 컨트롤(Control) 키를 누르고 있는 상태에서 "vs10_String2" 오브젝트를 마우스로 한번 클릭하면 보시는 화면과 같이 팝업윈도우가 나타납니다. 그곳에서 "Object Method" 항목을 선택합니다.

위 그림 57 : 역시 위 화면과 동일하게 입력하시고 메소드 윈도우를 닫습니다.

위 그림 58 : 역시 메소드 내용이 들어가니 오브젝트 모습이 약간 달라졌지요? ^^ 55번 그림과 비교하여 보시기 바랍니다. ^^

위 그림 59 : 계속해서 이번에는 "vs20_StringTotal" 오브젝트에 대한 변경 내용입니다. 위 화면과 동일하게 이벤트 항목을 변경합니다.

위 그림 60 : 이번에는 메뉴바를 통하여 메소드를 집어 넣도록 하겠습니다. "vs20_StringTotal" 오브젝트가 선택되어 있는 상태에서 메뉴바의 "Object > Object Method..." 항목을 선택합니다.

위 그림 61 : 역시 위 화면과 동일하게 입력하시고 메소드 윈도우를 닫습니다.

위 그림 62 : 메소드가 첨가된 후의 "vs20_StringTotal" 오브젝트의 모습입니다. 59번 그림 또는 60번 그림과 비교하여 보시기 바랍니다.

위 그림 63 : 이번에는 "문자열 더하기" 버튼을 선택하시고 위 그림과 같이 이벤트 항목을 똑같이 선택합니다.

참고 : "On Clicked" 이벤트는 마우스 버튼이 한번 눌렸다가 떼어질 때 발생하는 이벤트입니다. 즉, 마우스로 "문자열 더하기" 버튼을 클릭하게되면 버튼 안에 미리 입력했던 메소드 내용을 실행하라는 뜻이 되겠습니다.

위 그림 64 : 여기서 잠깐! 위 그림에서 보는바와 같이(51번 그림에서는) "Property List" 윈도우 안에 있는 "Object Method" 항목을 마우스로 선택한 다음, 바로 옆에 있는 "Edit..." 버튼을 눌러서 메소드 윈도우를 호출하였습니다.

메소드 윈도우를 호출하는 방법을 다시 한번 정리하면 아래와 같습니다.

첫번째 방법 : 51번 그림과 같이 "Property List" 윈도우를 이용하는 방법
두번째 방법 : 56번 그림과 같이 키보드의 컨트롤(Control) 키를 누르고 있는 상태에서 해당 오브젝트를 클릭하는 방법
세번째 방법 : 60번 그림과 같이 메뉴바의 "Object > Object Method..." 항목을 선택하는 방법

이와 같이 자신이 제일 편하다고 생각하는 방법으로 메소드 윈도우를 호출하여 사용하면 되겠습니다.

위 그림 65 : "문자열 더하기" 버튼의 메소드 내용을 위 그림과 동일하게 입력하고 윈도우를 닫습니다.

위 그림 66 : "문자열 더하기" 버튼 안에 메소드를 집어 넣은 후의 달라진 모습입니다. 63번 그림과 비교하여 보시기 바랍니다.

위 그림 67 : 이제 모든 작업을 마쳤으므로 폼 윈도우를 닫고 빠져나갑니다. (저장은 자동으로 됩니다.)

위 그림 68 : 폼 윈도우를 빠져나오니 익스플로러 윈도우가 보이는군요. 이 윈도우도 닫아버립니다.

위 그림 69 : 초기 화면으로 되돌아온 화면입니다. 그러면 지금까지 작업한 내용을 실행 및 테스트하기 위하여 위 그림과 같이 빨간색 원으로 표시된 것처럼 유저-엔바이론먼트 윈도우의 아무곳이나 더블-클릭 합니다.

위 그림 70 : 드디어 68번 그림에서 하늘색으로 반전된 "Form1" 폼-윈도우가 실행된 화면입니다. 하지만 윈도우가 조금 작게 보이네요. 빨간색 원으로 표시된 부분을 마우스로 클릭하여 전체 윈도우로 만듭니다.

위 그림 71 : 윈도우가 커졌습니다. ^^ "문자열 1 :" 오브젝트가 있는 오른쪽 입력박스 안에 입력커서가 들어간 상태입니다. 그러면 연습용 데이타를 차례대로 입력하여 보도록 하겠습니다.

위 그림 72 : 위 그림과 같이 소문자로 된 "abcde" 5글자를 입력하고 키보드의 탭(Tab) 키를 눌러서 다음 입력 오브젝트로 이동합니다.

위 그림 73 : 이번에는 "문자열 2 :" 오브젝트가 있는 오른쪽 입력박스 안에 대문자로 된 "ABCDE" 5글자를 입력합니다. 그리고 하단에 있는 "문자열 더하기" 버튼을 클릭합니다.

위 그림 74 : 보시는 화면과 같이 2개의 문자열끼리 서로 더한 결과값이 "문자열 3 :" 오브젝트가 있는 오른쪽 "vs20_StringTotal" 오브젝트에 나타났습니다. 결과는 "abcdeABCDE" 입니다. ^^

참고 : "vs20_StringTotal" 오브젝트는 46번 그림에서 "Property List" 윈도우의 "Enterable" 체크 박스 항목을 해제하였으므로 입력 커서가 들어가질 않습니다. 다시 말하면, 오브젝트 안에 어떠한 내용을 입력할 수 없도록, 보여주기만 가능한(보기 전용) 오브젝트이기 때문입니다.

위 그림 75 : 모든 테스트를 마쳤으므로 윈도우를 빠져나가기 위하여 맨 하단에 있는 "Button" 버튼을 누릅니다.

참고 : 17번 그림에서 "Button" 버튼에 대한 속성을 "Property List" 윈도우의 "Standard Action" 항목을 "Cancel" 항목을 지정하였기 때문에 현재 화면에 보여지는 폼-윈도우를 닫고 빠져나가게 됩니다.

그리고 영문으로 되어 있으니까 그다지 보기가 않좋으네요. 버튼 이름이 "나가기"로 되어 있으면 참 좋을텐데 말입니다. 그러면 이 부분을 수정하여 보도록 하겠습니다. ^^

여기서 잠깐!

만약에 말입니다~

위 그림에서 보는바와 같이 "문자열 1 :" 오브젝트와 "문자열 2 :" 오브젝트 안에 아무런 내용도 입력하지 않은 상태에서 "문자열 더하기" 버튼을 누르면 어떻게 될까요?

또는 "문자열 1 :" 오브젝트 안에는 데이타를 입력하고 "문자열 2 :" 오브젝트 안에만 데이타를 입력하지 않으채 "문자열 더하기" 버튼을 누르면 어떻게 될까요?

이와 같이 사용자가 실수를 범했을 때, 그 실수를 바로 잡아주기 위하여 경고 윈도우를 통하여 무슨 작업을 완료해 달라는 친절한 메시지를 보여주게 되면 참으로 편리할 것입니다. 그러므로 개발자는 프로그램을 만들 때, 사용자들이 실수를 범하였을 때까지 미리 생각하여 꼼꼼히 만드는 습관이 중요합니다.

다시 예를 들면 이렇습니다. 친구들의 연락처를 위한 프로그램을 만든다고 가정합니다. 일명, 주소록이라고 하지요.
그런데 전화번호, 주소, 기타등등의 다른 데이타는 다 입력하였는데 가장 중요한 친구 이름을 입력하지 않았다면 어떻게 하시겠습니다. 그럴때에는 이름이 입력되지 않았다는 경고 윈도우를 보여주면 참을로 편리하지 않겠습니까? 이제 대충이나마 이해가 되시겠지요? ^^

위 그림 76 : 그러면 잘못된 부분을 다시 수정 및 추가하여 보도록 하겠습니다. 메뉴바의 "Use > Design" 함옥을 선택합니다.

위 그림 77 : 메뉴바의 "Design > Edit Form..." 함옥을 선택합니다.

위 그림 78 : 익스플로러 윈도우가 나타날 것입니다. 상단의 "Forms" 탭-버튼에서 "Form1" 폼을 더블-클릭합니다.

위 그림 79 : 먼저 "문자열 더하기" 버튼부터 수정하도록 하겠습니다. "문자열 더하기" 버튼을 마우스로 한번 클릭하여 해당 오브젝트를 선택하고 위 그림과 같이 "Edit..." 버튼을 눌러 메소드 윈도우를 호출합니다.

위 그림 80 : 이와 같은 윈도우가 나타날 것입니다. 그러면 메소드 내용을 수정하여 보도록 하겠습니다. ^^

위 그림 81 : 위 메소드 내용과 동일하게 입력하고 윈도우를 빠져나갑니다.

참고 : If(만약 조건식이 이러하면)~Else(그렇지 않으면 또는 반대의 경우라면)~End if(조건식 If 문장의 끝맺기) 문장은 조건을 구별하는 문법이 되겠습니다.
이 부분에 대한 자세한 내용은 21과에서 따로 정밀하게 살펴보도록 할 것입니다.
그러므로 여기에서는 간략한 설명만 드리도록 하겠습니다.

1번째 줄 : if (vs10_String1="")
이 부분은 vs10_String1 오브젝트 안에 ""(공백) 아무런 내용도 입력되지 않으면~ 이러한 조건식이 되겠습니다.

2번째 줄 : ALERT명령어를 통하여 경고 메시지 윈도우를 보여줍니다.

3번째 줄 : 경고 윈도우를 보여준 후, vs10_String1 오브젝트 안으로 이동합니다. 다시 말하면 데이타를 입력할 수 있도록 입력커서를 넣어줍니다.

4번째 줄 : 1번째 줄의 조건식에 반대이면~ 이런 뜻으로 vs10_String1 오브젝트 안에 어떠한 데이타가 입력되면~ 이런 뜻이 되겠습니다.

5번째 줄 : 빈 공백의 라인이지요? If 문장을 보다 쉽게 이해할 수 있도록 건너뛰기한 모습니다. ^^

6번째 줄 : if (vs10_String2="")
vs10_String1 오브젝트 안에 어떠한 데이타가 입력된 상태라면 이번에는 vs10_String2 오브젝트를 검사합니다. vs10_String2 오브젝트 안에 ""(공백) 아무런 내용도 입력되지 않으면~ 이러한 조건식이 되겠습니다.

7번째 줄 : ALERT명령어를 통하여 경고 메시지 윈도우를 보여줍니다.

8번째 줄 : 경고 윈도우를 보여준 후, vs10_String2 오브젝트 안으로 이동합니다. 다시 말하면 데이타를 입력할 수 있도록 입력커서를 넣어줍니다.

9번째 줄 : 6번째 줄의 조건식에 반대이면~ 이런 뜻으로 vs10_String2 오브젝트 안에 어떠한 데이타가 입력되면~ 이런 뜻이 되겠습니다.

10번째 줄 : vs10_String1 오브젝트 안에 있는 데이타와 vs10_String2 오브젝트 안에 있는 데이타를 서로 더하여 vs20_StringTotal 이라는 문자열 변수에 그 결과를 넣어줍니다.

11번째 줄 : 6번째 줄에 있는 If 문장의 시작을 이곳에서 End if 문장으로 마무리 합니다. (닫습니다)

12번째 줄 : 역시 빈 공백의 라인입니다. If 문장을 보다 쉽게 이해할 수 있도록 건너뛰기한 모습니다. ^^

13번째 줄 : 1번째 줄에 있는 If 문장의 시작을 이곳에서 End if 문장으로 마무리 합니다. (닫습니다)

만약, 위에 적어놓은 설명을~

1번만 읽고 이해를 하셨다면 : 프로그래밍에 천부적인 소질을 가지고 계신 분이십니다. ^^

2~5번만에 이해를 하셨다면 : 갈고 닦고 노력할수록 프로그래밍 실력이 쑥쑥 향상될 분이십니다.

6~10번만에 이해를 하셨다면 : 이글을 쓰고 있는 저보다 높은 이해력을 가지신 분이십니다.

11~15번만에 이해를 하셨다면 : 저와 똑같으십니다.

16~20번만에 이해를 하셨다면 : 주무시면 어떻해요~ ㅋㅋㅋ

위 그림 82 : vs10_String1 오브젝트를 마우스로 한번 클릭하여 선택한 다음 위 그림과 같이 메소드 윈도우를 호출합니다.

위 그림 83 : 우리는 지난 시간에(Chapter_16과) 배웠듯이 변수를 만들어 사용할 때에는 미리 컴파일러 지시어를 통하여 변수의 속성을 미리 지정하는 것에 대하여 배운바가 있습니다. 그러므로 이것에 대한 추가 문장을 위와 같이 적어주고 메소드 윈도우를 닫습니다. (빠져나갑니다.)

위 그림 84 : vs10_String2 오브젝트를 마우스로 한번 클릭하여 선택한 다음 위 그림과 같이 메소드 윈도우를 호출합니다.

위 그림 85 : 역시 컴파일러 지시어에 대한 추가 문장을 위와 같이 적어주고 메소드 윈도우를 닫습니다. (빠져나갑니다.)

위 그림 86 : vs20_StringTotal 오브젝트를 마우스로 한번 클릭하여 선택한 다음 위 그림과 같이 메소드 윈도우를 호출합니다.

위 그림 87 : 역시 컴파일러 지시어에 대한 추가 문장을 위와 같이 적어주고 메소드 윈도우를 닫습니다. (빠져나갑니다.)

위 그림 88 : 이번에는 맨 하단에 있는 "Button" 버튼을 마우스로 한번 눌러 선택합니다. 영어로 된 글자를 한글로 수정하는 작업이 되겠습니다.

위 그림 89 : 하지만 이상하게도 버튼이 선택되지 않을 것입니다. 왜냐하면 오렌지색으로 표시된 부분 "1/1" 부분을 보시면 아시겠지만 "Button" 버튼은 0페이지에 있는 오브젝트이고 지금 우리가 작업하는 곳은 1페이지이기 때문입니다. 그러므로 해당 버튼이 선택되지 않는 것은 당연한 결과라 하겠습니다. 그러면 어떻게 해야 될까요? 아래의 방법을 따라하여 보시기 바랍니다. ^^

위 그림 90 : 툴-팔레트에서 빨간색으로 표시된 "이번 페이지로 이동" 버튼을 누릅니다.

위 그림 91 : 드디어 0페이지로 이동한 모습입니다. 오렌지색으로 표시된 부분을 보시면 "0/1"이라고 표시될 것입니다.

위 그림 92 : 하늘색으로 표시된 "Title" 부분을 마우스로 클릭하시고 한글로 "나가기"라고 버튼 제목을 수정하여 준 후, 키보드의 리턴키를 한번 눌러줍니다.

위 그림 93 : 곧바로 이번에는 조금 아래에 있는 "Shortcut" 항목을 마우스로 한번 선택하시고 맨 오른쪽에 있는 "..." 버튼을 눌러줍니다. 이부분은 해당 버튼의 단축키를 지정하는 작업이 되겠습니다.

위 그림 94 : 보시는 화면과 같이 Keys 윈도우가 나타날 것입니다. 이 화면에서 곧바로 키보드의 맨 삳단의 맨 왼쪽에 있는 ESC키를 한번만 눌러줍니다. 그러면 Associated Key 바로 아래 부분에 Esc 키로 지정되었다면 글자가 표시될 것입니다. 그리고 하단의 맨 오른쪽에 있는 "OK" 버튼을 눌러서 빠져가갑니다.

위 그림 95 : 단축키를 지정하고 나온 후 확인하면 Esc 라는 글자가 자동으로 나타나는 것을 확인하실 수 있습니다.

위 그림 96 : 이제 모든 수정을 마쳤으므로 폼 윈도우를 닫고 빠져나갑니다. (변경된 내용은 자동으로 저장됩니다.)

위 그림 97 : 익스플로러 윈도우가 보여지나 그냥 빠져나갑니다.

위 그림 98 : 초기화면으로 돌아온 화면입니다. 빨간색으로 표시된 부분의 빈 공백 아무곳이나 클릭하여 유저-엔바이론먼트 윈도우로 전환합니다.

위 그림 99 : 이제 지금까지 수정한 내용을 확인하기 위하여 빨간 색으로 표시된 부분의 아무곳이나 더블-클릭합니다.

위 그림 100 : 보시는 화면과 같이 아무런 데이타도 입력하지 않은 상태에서 "문자열 더하기" 버튼을 클릭하여 보도록 하겠습니다.

위 그림 101 : 보시는 화면과 같이 경고 메시지 윈도우가 나타날 것입니다. ^^ "OK" 버튼을 클릭하여 윈도우를 닫습니다.

위 그림 102 : 이번에는 "문자열 1 : " 항목의 입력 오브젝트 안에 "abcde" 라고 데이타를 입력한 후, "문자열 더하기" 버튼을 다시 한번 눌러보도록 하겠습니다.

위 그림 103 : 역시 "문자열 2 :" 항목의 입력 오브젝트에 데이타를 입력하지 않았다는 경고 윈도우가 나타날 것입니다. "OK" 버튼을 눌러서 빠져나갑니다.

위 그림 104 : 이번에는 "문자열 2 : " 항목의 입력 오브젝트 안에 "ABCDE" 라고 데이타를 입력한 후, "문자열 더하기" 버튼을 다시 한번 눌러보도록 하겠습니다.

위 그림 105 : 결과값이 정상적으로 나타났습니다. ^^ 이제 윈도우를 닫기 위하여 "나가기" 버튼을 누르시거나 또는 키보드의 "ESC" 키를 한번 누르셔도 동일한 효과를 얻으실 수 있습니다.


이번에는 메소드(Method)를 구현하는 2번째 방법인 별도의 메소드를 외부에 따로 만들어 놓고 이것을 필요로 할 때마다 여러 오브젝트에서 잠깐 불러다 사용하는 방법에 대하여 알아보도록 하겠습니다.

위 그림 106 : 메뉴바의 "Use > Design" 항목을 선택합니다. 디자인 모드로 전환하는 과정이 되겠습니다.

위 그림 107 : 곧바로 이번에는 메뉴바의 "Design > Edit Form..." 항목을 선택합니다.

위 그림 108 : 익스플로러 윈도우가 나타날 것입니다. 상단의 "Forms" 탭-버튼에서 "Form1" 폼을 더블-클릭합니다.

위 그림 109 : 폼 윈도우 안으로 들어온 화면입니다. "문자열 더하기" 버튼을 마우스로 한번 클릭하여 선택한 다음 "Property List" 윈도우의 "Object Method" 항목에 있는 "Edit..." 버튼을 눌러줍니다. 즉, 해당 버튼의 메소드 안으로 들어가는 과정이 되겠습니다.

위 그림 110 : 메뉴바의 "Edit > Select All" 항목을 선택하여 미리 입력되어 있던 모든 메소드 내용을 전체 선택합니다.

위 그림 111 : 메소드 내용이 전체 선택될 것입니다. (하늘색으로 반전된 부분) 이번에는 메뉴바의 "Edit > Cut" 항목을 선택합니다. 전체 선택한 내용을 오려두기 하는 작업이 되겠습니다.

위 그림 112 : 메소드 내용이 없어지나 당황하지 마시고 곧바로 메소드 윈도우를 닫고 빠져나옵니다.

위 그림 113 : 이번에는 폼 윈도우를 빠져나옵니다.

위 그림 114 : 익스플로러 윈도우로 돌아오면 곧바로 빨간색 원 1번부터 3번까지 그대로 따라합니다.

위 그림 115 : "New Method" 윈도우가 나타나면 메소드 이름을 "Method_Page01_01"이라고 적어주고 하단 오른쪽에 있는 "OK"버튼을 누릅니다.

참고 : 메소드 이름은 개발자 나름대로 알아보기 쉽게 정해주는 것이 좋습니다. ^^

위 그림 116 : "Method_Page01_01" 메소드 윈도우가 열릴 것입니다. 곧바로 메뉴바의 "Edit > Paste" 항목을 선택합니다.

위 그림 117 : 아까 111번 그림에서 오려두었던 내용이 지금 이곳에 붙여넣은 상태입니다. 보시는 화면과 똑같이 되었다면 윈도우를 닫고 빠져나갑니다.

위 그림 118 : "Method_Page01_01" 메소드 하나가 추가된 화면입니다. 이번에는 키보드의 커멘드 키를 누른 상태에서 하늘색으로 반전된 "Method_Page01_01" 부분을 한번 클릭하여 둡니다.

위 그림 119 : 수정할 수 있도록 입력 커서가 들어갈 것입니다. 입력 커서가 들어가면 이곳에서 곧바로 메뉴바의 "Edit > Select All" 항목을 선택하여 줍니다.

위 그림 120 : 이번에는 메뉴바의 "Edit > Copy" 항목을 선택합니다. 메소드명 "Method_Page01_01" 이 부분을 복사하는 작업이 되겠습니다.

위 그림 121 : 빨간색 원으로 표시된 빈 공백 아무곳이나 눌러서 수정 상태에서 빠져나옵니다.

위 그림 122 : 이번에는 빨간색 네모로 표시된 "Forms" 탭-버튼을 한번 눌러서 익스플러러 윈도우의 폼 항목으로 이동합니다..

위 그림 123 : 보시는 화면과 같이 이동했다면 빨간색 원 1번~2번을 차례대로 눌러줍니다.

참고 : 여러번 반복하여 말씀드리지만 빨간색 1번으로 표시된 부분을 더블-클릭하셔도 됩니다. ^^

위 그림 124 : 다시 폼 윈도우로 들어온 화면입니다. "문자열 더하기" 버튼을 마우스로 한번 클릭하여 선택한 다음 보시는 화면 그대로 해당 오브젝트의 메소드 윈도우를 호출합니다.

위 그림 125 : "문자열 더하기" 버튼의 메소드 안으로 들어온 화면입니다. 여기서 곧바로 메뉴바의 "Edit > Paste" 항목을 선택합니다. 120번 그림에서 메소드 이름을 복사해 두었던 내용을 붙여넣기 하는 작업이 되겠습니다.

위 그림 126 : 보시는 화면과 같이 메소드 이름이 들어갔습니다. 여기서 곧바로 키보드의 리턴키를 한번 눌러 다음 줄로 이동합니다.

위 그림 127 : 메소드 이름이 빨간색으로 자동으로 변환되었습니다. ^^ 이제 윈도우를 닫고 빠져나갑니다.

위 그림 128 : 폼 윈도우도 빠져나갑니다.

위 그림 129 : 역시 익스플로러 윈도우도 빠져나갑니다.

위 그림 130 : 초기화면으로 돌아온 모습입니다. 빨간색으로 표시된 부분의 빈 공백 아무곳이나 클릭하여 유저-엔바이론먼트 윈도우로 전환합니다.

위 그림 131 : 이제 지금까지 변경한 내용을 확인하기 위하여 빨간 색으로 표시된 부분의 아무곳이나 더블-클릭합니다.

위 그림 132 : 위 그림과 같이 데이타를 입력한 다음에 "문자열 더하기" 버튼을 눌러줍니다.

참고 1 : 문자열 더하기 버튼을 누르게 되면 127번 그림의 "Method_Page01_01" 메소드명이 실행됩니다.

참고 2 : 메소드명이 실행되면 118번 그림의 "Method_Page01_01" 메소드를 잠깐 호출합니다. 그리고 그 안에 있는 117번 그림의 명령어들이 실행되고요. 이제 간략하나마 이해가 되십니까? ^^

위 그림 133 : 문자열을 더한 결과가 화면에 보여지는군요. ^^ 이제 모든 테스트를 정상적으로 다 마쳤으므로 하단에 있는 "나가기" 버튼을 눌러서 빠져나갑니다. 또는 "나가기" 버튼 대신에 키보드의 "ESC" 키를 누르셔도 되겠습니다.

위 그림 134 : 유저-엔바이론먼트 윈도우에서 디자인-모드로 전환하기 위하여 메뉴바의 "Use > Design" 항목을 선택합니다.

위 그림 135 : 디자인-모드로 전환된 화면입니다. 지금까지 공부하시느라 고생 많으셨습니다. ^^ 그러면 다음번 20과에서 다시 뵙도록 하겠습니다. ^^


질문 1) 115번 그림에서의 메소드 이름 말인데요? 한글로 적어주면 안될까요? 이해가 더욱 빠를 것 같아서요. ^^
답변 1) 메소드 이름을 한글로 적어주어도 상관은 없으나 가급적이면 영문과 숫자의 조합으로 만드실 것을 권장하고 싶습니다. ^^ 왜냐하면 만들어 놓은 프로그램을 나중에 컴파일하거나 새로운 4D 상위 버전으로 업그레이드 할 때, 테이블명, 필드명, 변수명, 메소드명 등등이 한글로 된 부분에서 종종 에러를 일으키기 때문입니다. 번거롭더라도 영문과 숫자의 조합으로 연습하실 것을 추천하는 바입니다. ^^



다음글 - Chapter20. 메소드(Method)의 또 다른 사용법 -1-
현재글 - Chapter19. 메소드(Method)의 실제 사용법
이전글 - Chapter18. 샘플을 통한 문법 및 명령어 적용하기