2011년 7월 19일 화요일

제 13 장 멀티유저용 인터넷 즐겨 찾기 4 (그림파일 등의 추가작업)

1. 상기 예제에서 다음의 구성을 추가한다.  이하의 상세설명은 즐겨찾기 인터넷과 실질적으로 동일하지만 기재상에 있어 근소한 차이가 있는 부분이 있다.

1-1. 프로젝트의 명칭은 MultiuserFavoriteInternetVersion으로 한다.

1-2. 2 단계의 예제에서 사용된 그림파일은 디자이너창의 미디어컬럼의 파일명칭을 클릭하여 컴퓨터에 다운로드할 수 있다.

  
1-3. 또는, 압축파일(MultiuserFavoriteInternetVersion.zip)을 풀어서 폴더(assets)안에 있는 그림파일을 사용하여도 된다.

  
2. 디자이너창의 전체를 나타내는 스크린샷은 다음과 같다.

  
참고사항: 상기 디자이너창의 구성요소와 이후에 설명하는 블록에디터창의 기능블록에 대응하는 넥서스S의 멀티유저 즐겨찾기 화면은 다음의 스크린샷과 같다.


2-1. 상기 스크린샷에서의 즐겨찾기 명칭:인터넷 주소:는 그림파일(favorite.png, internet.png)에 각각 해당하고, 이미지(image1, image2)의 속성컬럼의 그림(Picture)난에서 해당 그림파일을 각각 선택하면 상기 스크린샷과 같이 나타난다.

2-2. “즐겨찾기 추가는 그림파일(favoriteAdd.png)에 해당하고, 버튼(AddButton)의 속성컬럼의 이미지(Image)난에서 상기 그림파일을 선택하면 상기 스크린샷과 같이 나타난다.

2-3. “즐겨찾기 선택즐겨찾기 제거는 그림파일(favoriteSelect.png, favoriteRemove.png)에 각각 해당하고, 리스트피커(SelectListpicker, RemoveListpicker)의 속성컬럼의 이미지(Image)난에서 해당 그림파일을 각각 선택하면 상기 스크린샷과 같이 나타난다.

2-4. “안테나는 그림파일(antenna.png)에 해당하고, 버튼(Button1)의 속성컬럼의 이미지(Image)난에서 상기 그림파일을 선택하면 상기 스크린샷과 같이 나타난다.

2-5. 또한, 즐겨찾기 추가버튼(AddButton)을 터치할 때 순간이미지가 나타나도록 디자이너창에서 클록(Clock1)을 추가한다.  클록의 속성컬럼에서 타이머구동(TimerEnabled)난에 체크표시를 제거하고, 타이머인터벌(TimerInterval)난에 250을 기재한다.

3. 안테나 그림을 터치하면 구글사이트로 이동하는 블록은 이하의 스크린샷과 같다.


  
4. 즐겨찾기 추가버튼에서 제 1 단계의 예제와의 차이점은 버튼을 터치할 때에 클록타이머가 구동하고 순간이미지(favoriteAddVersion.png)가 나타나고 문자도 그림파일에 포함되어 있는 점이다. 

4-1. , 클록타이머를 구동하는 블록{(set Clock1.TimerEnabled to), (true)} 및 버튼이미지를 순간이미지로 설정하는 블록{(set Addbutton.Image to), (text favoriteAddVersion.png)}을 추가한다.


4-2. 상기 두블록을 추가버튼에 조합한 스크린샷은 다음과 같다.


  
5. 상기한 바와 같이 즐겨찾기 추가버튼의 터치에 의해 구동되는 클록타이머(Clock1.Timer)를 부가하여 버튼이미지를 고정이미지(favoriteAdd.png)로 설정하고 클록자신의 타이머의 구동을 중지한다.

  
6. 지금까지 설명한 블록을 종합한 3개의 스크린샷을 이하 나타낸다.








제 13 장 멀티유저용 인터넷 즐겨 찾기 3 (블록에디터창 작업)

6. 구성요소에 활력 불어넣기

1. 블록에디터를 오픈하고 좌측에 위치한 사용자 블록(My Blocks)탭을 선택하면, 디자이너창에서 작업한 라벨, 버튼, 수평배열, 수직배열, 선택용 리스트피커, 제거용리스크피커, 액티비티스타터, 소형웹데이터베이스(TinyWebDB) 및 통보자(Notifier) 등에 각각 대응하는 드로워(Drawer)가 나타난다. 이외에도, 나중에 설명하는 바와 같이 변수블록 등을 정의할 때에 자동생성되는 블록을 저장하는 사용자정의(My Definitions)드로워가 나타난다.

2. 메모를 다이내믹하게 임시저장하기 위해 사용하는 리스트변수(타이틀 리스트(TitleList)와 인터넷 주소모음 리스트(dataURLs)), 타이틀리스트의 선택시에 사용되는 인덱스변수(index)(이 인덱스에 대응하여 선택된 인터넷주소를 액티비티스타터의 인터넷주소로 사용됨), 타이틀의 선택제거 시에 사용되는 제거용 인덱스변수(removeIndex)(이 제거용 인덱스에 대응하여 선택된 인터넷주소를 제거함), 인터넷주소리스트(dataURLs) 중에서 인터넷주소를 선택하기 위해 사용되는 URL인덱스변수(urlIndex), 및 이와 같이 선택된 인터넷주소를 임시 저장하는 URL변수(url)에 대해서는 제 12 장의 제 1 단계와 동일하므로 이에 대한 설명은 생략한다.






  
3. 동일한 절차를 중복해서 계속 사용하여야 하는 경우에는 절차(procedure)블록을 사용하면 블록의 조합이 간편하게 된다, 절차블록은 매개변수화하여 사용하면 블록의 조합이 간편하게 된다.   이에 대한 설명도 제 12 장의 제 1 단계와 동일하므로 생략한다.

  
4. 타이틀텍스트박스(TitleTextBox) URL텍스트박스(URLTextBox)에 각각 기재한 즐겨찾기 명칭인터넷 주소, 인터넷라벨(InternetLabel)에 추가하고 또한 소형웹데이터베이스(TinyWebDB)에 저장하기 위해, 즐겨찾기 추가버튼(AddButton)을 사용한다.

이에 관련하여, 즐겨찾기 추가버튼(AddButton)을 터치하여 발생되는 버튼클릭이벤트에 의해 호출하는 버튼클릭이벤트핸들러에 대해서는, 안드로이드폰 내부에 있는 소형 데이터베이스(TinyDB)를 사용하는 대신에, 소형 웹데이터베이스(TinyWebDB)를 사용하는 점을 제외한 다른 구성은 제 12 장의 제 1 단계와 동일하다나머지의 동일한 구성에 대해서는 상세설명을 생략한다.

4-1. , 다수사용자의 인터넷 즐겨찾기에서는,

 

등의 블록을 사용하는 대신에,


  
등의 블록을 사용한다.

4-2. 따라서, 버튼클릭이벤트핸들러의 블록조합은 다음의 스크린샷과 같이 구성된다.

  
5. 소형데이터베이스에 저장한 인터넷주소에 해당하는 인터넷을 열기 위해 선택용 리스트피커를 사용하는 방법에 대해서도 제 12 장의 제 1 단계와 동일하므로 생략한다.


  
6. 소형웹데이터베이스에 저장한 한 쌍의 즐겨찾기 명칭과 인터넷주소를 제거하기 위해 제거용 리스트피커를 사용하는 방법에 대해 설명한다즐겨찾기 제거리스트피커를 터치하면, 제거용 리스트피커에 이벤트가 발생한다. 제거하고자 하는 즐겨찾기 명칭의 피크(선택) 전후로 구분하여 조합블록을 구성한다.

6-1. 제거용 리스트피커의 피크전블록(RemoveListPicker.BeforePicking)에 대한 설명은 제 12 장의 제 1 단계와 동일하므로 생략한다.

  
6-2. 제거용 리스트피커의 피크후블록(RemoveListPicker.AfterPicking)의 설명은 제 12 장의 제 1 단계와 동일하다. 다만, 소형 데이터베이스를 사용하는 대신에 소형 웹데이터베이스를 사용하는 점이 다르다

, 다수사용자의 인터넷 즐겨찾기에서는,


등의 블록을 사용하는 대신에,

 

 
등의 블록을 사용한다.

6-3. 따라서, 제거용리스트피커의 피크후블록(RemoveListPicker.AfterPicking)의 조합은 다음과 같은 스크린샷을 구성한다.

  
참고 사항: 안드로이드폰의 내부에 있는 소형 데이터베이스(TinyDB)를 사용하는 경우, 소형 데이이터베이스의 저장 여부의 확인을 라이브테스트로 할 수 없지만, 소형웹데이터베이스(TinyWebDB)는 저장장소가 구글 서버이기 때문에, 저장여부의 확인을 라이브테스트로 할 수 있다.

7. 다수 사용자의 즐겨찾기에서는, 핸드폰 자체의 데이터베이스에서 소형 데이터베이스의 값을 가져오지 않고, 웹사이트의 데이터베이스에서 소형 웹데이터베이스의 값을 가져온다따라서, 초기화 이벤트핸들러의 기능블록조합이 제 12 장의 제 1 단계의 개인용 즐겨찾기와 상이하다.

7-1. 앱을 시작할 때에 발생하는 초기화 이벤트에 의해 초기화 이벤트핸들러의 블록조합을 트리거한다초기화 이벤트핸들러를 사용하여 기능블록을 조합한다.

  
7-2. 개인용 인터넷 즐겨찾기에서는 핸드폰 자체의 데이터베이스에서 소형 데이터베이스의 값을 가져오기 때문에, 시간이 지체되지 않아 소형 데이터베이스의 겟밸류 블록(call TinyDB1.GetValue)의 좌측(call)에 플러그가 형성되어 있다따라서 타이틀리스트 또는 인터넷주소모음리스트에 직접 플러그인할 수 있다.   , 핸드폰 자체의 데이터베이스에 태그를 사용하여 데이터를 호출하여 타이틀리스트(TitleList)와 인터넷주소모음리스트(dataURLs)에 기재한다.

이에 반해서, 웹사이트의 데이터베이스에서 소형 웹데이터베이스의 값을 가져오기 때문에, 시간이 지체되어 타이틀리스트(TitleList)와 인터넷 주소모음 리스트(dataURLs)에 즉시 연결할 수 없다이 때문에, 소형 웹데이터베이스의 겟밸류 블록(call TinyWebDB1.GetValue tag)의 좌측(call)에 플러그가 형성되어 있지 않다그 결과, 타이틀리스트(TitleList) 또는 인터넷 주소모음 리스트(dataURLs)에 직접 연결할 수 없다. 웹사이트의 데이터베이스에 태그를 사용하여 단지 데이터의 요청만 한다. 그 결과, 소형 데이터베이스의 갓밸류 블록(TinyWebDB.GotValue)을 별도로 사용한다.

다수 사용자의 인터넷즐겨찾기에서는,


 
등의 블록을 사용하는 대신에,



 
등의 블록을 사용한다

7-3. 상기 참고 사항에 설명한 바와 같이 소형데이터베이스(TinyDB)와 소형웹데이터베이스(TinyWebDB)는 그 개념이 다르기 때문에, 스크린 초기화 방식이 또한 다르다.

, 스크린초기화블록은,

 
의 블록조합을 사용하는 대신에,

 
의 블록조합을 사용한다.

7-4. 상기 블록조합에 나타난 바와 같이, 소형데이터베이스(TinyDB)의 스크린초기화블록에서는 다수의 블록조합을 사용하지만, 소형웹데이터베이스(TinyWebDB)의 스크린초기화블록에서는 2개의 소형웹데이터베이스의 겟밸류 블록만이 사용된다. 소형웹데이터베이스(TinyWebDB)의 스크린초기화블록에서 사용되지 않은 다수의 블록은 소형웹데이터베이스의 갓밸류블록(TinyWebDB.GotValue)에서 사용된다.   여기서, 사용되지 않는 블록을 그대로 사용하지 않기 때문에 블록을 처음으로 조합하는 경우에는 상당한 주의가 필요하다특히, 2개의 이상의 태그를 사용하는 경우에는 상당한 시행착오를 거쳐야 한다.

7-5. 상기 초기화블록으로부터 알 수 있는 바와 같이, 태그(text titles, text urls)를 사용하여 소형 웹데이터베이스(TinyWebDB1)에 데이터값을 호출하여, 소형웹데이터베이스에서 한 쌍의 태그와 값(name tagFromWebDB, name valueFromWebDB)이 핸드폰에 도달한 경우에, 이하의 소형웹데이터베이스의 갓밸류 블록(TinyWebDB1.GotValue)을 트리거한다.

   
참고 사항: 사용자블록(My Blocks)탭의 소형웹데이터베이스(TinyWebDB1)드로워를 열고 소형웹데이터베이스에서 얻은 값(TinyWebDB1.GotValue)을 작업영역으로 드래그할 때 상기 한 쌍의 기능인수인 태그와 값블록(name tagFromWebDB, name valueFromWebDB)이 상기 값(TinyWebDB1.GotValue)의 좌측에 자동생성된다또한, 사용자블록(My Blocks)탭의 사용자정의(My Definitions)에 한 쌍의 기능인수에 대응하는 한 쌍의 값인 태그와 값블록(value tagFromWebDB, value valueFromWebDB)이 자동생성된다.

7-6. 앱을 처음 사용하는 경우로서 웹데이터베이스에 데이터가 저장되어 있지 않은 경우 또는 처음 사용자가 아닌 경우에도 웹데이터베이스를 모두 삭제한 경우를 고려한다, 타이틀리스트와 인터넷 주소모음 리스트에 각각 타이틀(즐겨찾기 명칭)과 인터넷주소가 없는 경우를 나타내는 각각의 조건블록에 대해서 설명한다.

7-6-1. 우선, 타이틀리스트에 타이틀(즐겨찾기 명칭)이 없는 경우의 조건블록은 다음과 같다.

7-6-1-1. 조건블록(if)을 사용하고,

  
웹 데이터베이스에서 수신한 태그가 titles을 나타내는 블록을,

  
상기 조건블록의 소켓(test)에 플러그인한 블록은 다음과 같다.

  
7-6-1-2. 웹데이터베이스에서 수신한 태그가 titles인 경우에는, 웹테이터베이스에서 수신한 값(명칭)을 타이틀리스트에 저장하고,

  
7-6-1-3. 타이틀리스트에 즐겨찾기 명칭이 없는 지의 여부를 나타내는

 
조합블록을,

 
조건블록에 다음과 같이 조합한다

  
7-6-1-3. 타이틀리스트(TitleList)에 타이틀(즐겨찾기 명칭)이 없음을 나타내는 블록을 설정한다이 경우는 앱을 처음 실행한 경우이거나 이미 실행한 경우로서 저장된 타이틀을 모두 지운 경우에 해당한다.

  
7-6-1-4. 상기 설명을 종합하면, 웹데이터베이스에서 수신한 태그가 타이틀(titles)인 경우에는, 웹데이터베이스에서 수신한 (즐겨찾기 명칭)타이틀리스트에 저장한다.
즐겨찾기 명칭이 타이틀리스트에 없는 경우에는, 즉 웹데이터베이스에서 수신한 값(즐겨찾기 명칭)이 없는 경우에는, 즐겨찾기 명칭이 없는 공백상태인 타이틀리스트를 설정한 조건블록은 다음의 스크린샷과 같다.

  

7-6-2.  마찬가지로, 인터넷 주소모음 리스트(dataURLs)에 인터넷주소(이미 저장된 인터넷주소)가 없는 경우의 조건블록은 다음과 같다.

7-6-2-1. 조건블록(if)을 사용하고,

  
웹 데이터베이스에서 수신한 태그가 urls를 나타내는 블록을,

  
상기 조건블록의 소켓(test)에 플러그인한 블록은 다음과 같다.  

  
7-6-2-2. 웹데이터베이스에서 수신한 태그가 urls인 경우에는, 웹테이터베이스에서 수신한 값(인터넷 주소)을 인터넷 주소모음 리스트(dataURLs)에 저장하고,

  
7-6-2-3. 인터넷 주소모음 리스트(dataURLs)에 인터넷 주소가 없는 지의 여부를 나타내는

 
조합블록을,

 
조건블록에 다음과 같이 조합한다

  
7-6-2-4. 인터넷 주소모음 리스트에 인터넷주소(이미 저장된 인터넷주소)가 없음을 나타내는 블록을 설정한다이 경우는 앱을 처음 실행한 경우이거나 이미 실행한 경우로서 저장된 인터넷주소를 모두 지운 경우에 해당한다.

  
6-2-6. 상기 설명을 종합하면, 웹데이터베이스에서 수신한 태그가 urls인 경우에는, 웹데이터베이스에서 수신한 (인터넷주소)을 인터넷 주소모음 리스트에 저장한다.
인터넷주소인터넷 주소모음 리스트에 없는 경우에는, 즉 웹데이터베이스에서 수신한 값(인터넷주소)가 없는 경우에는, 인터넷주소가 없는 공백상태인 인터넷주소리스트를 설정한 조건블록은 다음의 스크린샷과 같다.

  
7-7. 절차호출블록 및 절차블록을 사용하기 위한 조건블록에 대해 설명한다.

상기 두개의 조건블록을 사용한 다음, 절차블록을 호출하는 블록은 타이틀리스트의 타이틀(즐겨찾기 명칭)의 개수와 인터넷 주소모음 리스트의 인터넷 주소의 개수가 동일한 것을 전제로 하여야 한다.  그렇치 않은 경우에는 개수가 서로 다른 경우에는 웹에 저장된 데이터베이스 등에 에러가 있는 것을 예상할 수 있다. 이에 관련하여 필요한 조건블록은 다음과 같이 조합한다.

7-7-1. 타이틀리스트의 타이틀 개수와 인터넷주소리스트의 인터넷주소 개수를 동일한

 
블록을,

 
조건블록에 조합한 블록은 다음과 같다.

  
7-7-2. 다음에, 이전에 설명한 절차블록(displayInternetAddress)을 호출하는 블록(call displayInternetAddress)을 추가하여 조합한다

  
, 타이틀리스트(TitleList)에 있는 타이틀전체에 대해서 한 개의 타이틀마다 순차적으로 순환하여 인터넷라벨에 타이틀을 기록하고 또한 인터넷 주소모음 리스트(dataURLs)에 있는 인터넷주소전체에 대해서도 상기 타이틀에 대응하는 인터넷주소를 한 개씩 순차적으로 순환하여 인터넷라벨에 인터넷주소를 기록하는 절차블록을 간편화하는 절차호출블록을 이벤트핸들러에 추가한다.

7-7-3. 다음에, 타이틀리스트의 타이틀(즐겨 찾기 명칭)중에서 브라우징하고자하는 인터넷에 대응하는 명칭을 선택하기 전에 타이틀리스트의 타이틀 전체를 선택용 리스트피커의 구성요소로 설정하는 조합블록을 추가하여 조합한다.

gd'> 
7-6-1. 우선, 타이틀리스트에 타이틀(즐겨찾기 명칭)이 없는 경우의 조건블록은 다음과 같다.

7-6-1-1. 조건블록(if)을 사용하고,


  
7-7-4. 상기 설명한 블록을 전체적으로 나타내는 조합블록의 스크린샷이다.

  
7-8. 소형웹데이터베이스의 갓밸류 블록(TinyWebDB.GotValue)을 완성한 스크린 샷은 다음과 같다.



8. 지금까지의 설명한 블록을 종합한 3개의 스크린 샷을 이하 나타낸다.