P2SKLife

리스트(list) 사용시 가장 기본적인 것이면서도 놓치기 쉬운 부분이 있는데 같은 데이타유형의 자료끼리 리스트를 만들어야 한다는 것입니다. 숫자면 수자, 문자면 문자로 리스트를 만들어야 합니다. 한마디로 같은 종류의 유형으로만 만들어야 합니다. 다른 데이타유형으로 리스트를 만들어도 일단 만들어지는 것 같지만 실제 앱을 빌드해서 돌려보면 오류가 납니다.

리스트는 같은 데이타유형으로만 만드시기 바랍니다.

리스트 피커(List Picker)를 선택하려고 터치했다가 목록을 선택하지 않고

뒤로가기 버튼을 눌렀을 때 처리하는 방법을 고민하다 알게된 것입니다.

click은 터치하고 떼기까지를 하나의 동작으로 간주합니다.

touch up은 눌렀을 때, touch down은 뗐을 때...

각각의 액션에 맞게 처리해주시면 될듯합니다.

버튼[BattleOwner]를 클릭하면 10000~99999의 정수를 난수발생하여 변수 BattleNo1에 저장합니다.

그러면 스크린명 [BattleOwner]를 오픈합니다. 이때 변수 BattleNo1의 값을 전달합니다.

이제 버튼[BattleVisitor]를 클릭하여 방금 BattleNo1값으로 오픈한 Firebase Realtime DB 버킷에 입장해야 합니다.

버튼 [BattleVisitor]를 클릭하면 Notifier로 숫자를 입력받습니다.

이때 숫자는 BattleNo1의 값을 입력하면 동일한 DB를 공유하게 됩니다.

Notifier로 입력받은 숫자에 0을 추가하여 버킷명으로 삼고, 이것이 예제그림의 182720이라는 폴더가 됩니다.

예제에서 BattleNo1 변수에 저장된 값은 18272인데 실시간DB 활용을 하기 위해서  [BattleOwner]가 오픈할 때 0을 추가하여 폴더를 생성하는 블럭과정이 있습니다. 그래서 폴더명에 0이 추가되어 있습니다.

그리고 tag명에 최하위 폴더명을 입력합니다. 그리고 거기에 기록된 Value가 있는지 값을 체크하고 if문 블럭을 활용하여 거기에 들어 있는 기본 값 "0"가 들어 있는지 여부를 확인합니다.

그래서 값이 있으면 정확하게 번호를 입력한 것이므로 스크린 [BattleVisitor]를 오픈하고,

없으면 잘못 입력한 것이므로 다시 입력하도록 메세지를 출력합니다.

timer 컴포넌트를 사용할 때 주의사항입니다.

속성에서 [Timer Always Fires]를 해제하고 필요할 때만 코딩에서 [Timer Enabled]를 [true]로 하여 사용하세요.

프로그램이 시작하자마자 timer가 무조건 실행되기 때문에

아직 처리할 준비가 되지 못한 상황인 경우에는 예상치 못한 오류가 발생하기도 합니다.

일단은 속성창에서는 언제나 활성화를 해제하고 사용하세요!!

휴! 이거 하나 때문에 에러가 발생했는데 왜 발생하는지 이유를 도저히 몰라서 마구마구 짜증만 난 걸 생각하면

이점 꼭 명심하세요! 타이머는 블럭 코딩에서 직접 활성화 여부를 처리하는 것이 좋을듯 !!!!!

레이블이나 버튼 등 컴포넌트에 들어가는 문자열의 줄바꾸기를 하는 방법입니다.

코둘라의 경우 컴포넌트의 속성 중 [Advanced Properties]를 활성화 한 후 [HTML]을 체크하여 활성화 합니다.

앱인벤터는 속성 중 [HTML 형식]을 체크하여 활성화하면 됩니다.

그리고 해당 컴포넌트의 문자열 중 줄 바꾸기를 희망하는 위치에 <br>을 삽입하시면 됩니다.

일반 문자열 예> 여기를 터치하여 교과서를 선택하세요.

줄바꾸기 예> 여기를 터치하여 <br> 교과서를 선택하세요.

[앱인벤터 도움말 참고] ai2.appinventor.mit.edu/reference/other/any-component-blocks.html

처리할 동일한 모양의 버튼이 다수일 때 일일이 버튼별로 블럭을 만드는 것이 정말 고역입니다.

이때 이것을 쉽게 처리할 수 있는 방법입니다.

어떤 버튼이 눌러지든 그 버튼을 원하는 처리를 하는 방식입니다.

Any Component Blocks 활용하는 예제입니다.

꼭 버튼 뿐만 아니라 동일한 모양의 컴포넌트가 다수일 때 동일하게 적용할 수 있는 방법입니다.

예를 들어서 아래 그림과 같이 디자인을 한 경우

가,갸,거,겨~ 라벨을 클릭가능하게 하고 해당 라벨을 클릭하면 TTS컴포넌트로 자모의 발음을 처리하려고 합니다.

만약 이것을 각 라벨을 클릭하면 해당 라벨의 Text를 읽어서 TTS처리하고, 텍스트색상을 적색으로 변경하려한다면

다음과 같이 코딩을 해야할 것입니다. 라벨이 한 두개면 몰라도 수십 수백개일 경우 각 라벨마다 하나씩 블럭코딩을 해야할 것입니다.

그런데 이것을 하나의 블럭코딩으로 처리하는 방법이 바로 일괄버튼(Any component)을 사용하는 것입니다.

일괄버튼은 블록의 맨 맽에 있습니다. +를 클릭하면 사용할 수 있는 컴포넌트 목록이 펼쳐집니다.

Any Label을 클릭하면 다음과 같은 블럭들이 목록에 뜨게 되고 그 중 선택을 합니다.

노란색은 아무 레이블이나 클릭했을 때 처리하기 위한 블럭이며

연한 색은 해당 컴포넌트의 값을 가져오는 것이고

진한 색은 해당 컴포넌트의 값을 변경하는 것입니다.

이제 다음과 같이 블럭을 구성하시면 됩니다.

1(component)을 클릭하고 2에서 get.component를 클릭하여 3에 결합하면 됩니다.

이제 어떤 레이블을 클릭하면 해당 레이블의 text를 가져와서 TestToSpeech처리를 하고

해당 레이블의 텍스트 색상을 적색으로 변경하는 처리를 하게 됩니다.

수십개의 블럭을 하나로 처리할 수 있게 되었습니다.

Firebase의 Realtime Database를 활용하면서 알게된 몇가지를 공유하려 합니다.

혹시 실시간 데이타베이스 사용에 관한 더 많은 정보를 알고 계시면 알려주시면 감사하겠습니다.

일단 실시간데이타베이스는

1. 온라인상에서 바로 바로 데이타베이스를 공유하면 변경내용을 참조할 필요가 있을 때 사용합니다.

  예를 들자면 둘 이상이 사용자가 게임을 할 때 실시간으로 데이타를 공유할 필요가 필요할 때일 것입니다.

2. 파이에베이스 실시간 데이타베이스를 제가 여러가지 방법으로 실시간 데이타 변경내용을 참조하다보니 체득하게 된 사항입니다. 버킷내에 태그가 여러 개 있을 경우에 실시간 데이타 변경이 짧은 시간에 여러 개가 발생할 경우 시간상 제일 나중에 변경된 것을 참조하는 것 같았습니다. 무슨 말인가하면 앱에서 순ㄴ차적으로 발생시켰다고 실시간 데이타베이스도 그 순서대로 변경되지 않을 수도 있기 때문에 참조하는 데 있어서 혼란이 발생하기도 한다는 것입니다.

3. 그래서 이런 혼란을 방지하고자 생각해낸 방법이 변수 하나에 버킷 하나만 만드는 것입니다.

당연히 RealtimeDatabase의 컴포넌트도 각 변수대로 추가하여야 할 것입니다. 버킷에 태그도 1개만 만드세요. 그래야 혼란이 발생하지 않더라구요.

4. 그래서, 각 변수에 한 개의 컴포넌트를 추가하고 각 컴포넌트 별로 한 개의 버킷,태그만을 지정하면 서로 헛갈리지 않고 잘 인식합니다. |^.^|

프로그레스바를 구현한 예제(aia)를 파일로 첨부했습니다.

프로젝트 메뉴 중 [Import project(.aia) from my computer]를 선택하고 다운로드 한 첨부 파일을 선택하면 확인하실 수 있습니다.

그림을 1초간만 보여주고 사라지게 하는 예제입니다.

먼저 다른 블록에 원하는 [ image / picture / 그림 파일명]을 지정합니다.

clock의 Time Interval을 원하는 시간[1000은 1초에 해당]의 숫자를 연결합니다.

clock의 Time Enavled를 true로 해줍니다.

그리고 clock.Timer에다가 

Time Enabled를 [False]로 해주고

Image Picture의 파일명을 공백처리해줍니다.

그러면 해당하는 그림을 1초간 보여주고 그림이 사라집니다.

이 기능을 구현하기 위해서 참 오랜 시간과 노력이 필요했었습니다.

이 기능을 구현하게 되어 참 기쁩니다. |^.^|

코둘라에서 폰트를 내가 원하는 것으로 변경이 가능합니다. 

먼저, 인터넷에서 원하는 폰트를 파일로 다운로드합니다.

아래 링크로 가시면 이쁜 무료 폰트가 다양하게 있습니다.

다운로드 한 폰트파일을 [Assets]에 업로드합니다.

해당 레이블이나 버튼 등 텍스트가 있는 컴포넌트의 속성 중 [Advanced properties]를 클릭하고

Font TypeFace Import를 클릭하여 방금 업로드한 파일을 선택하면 디자인의 폰트가 변경됩니다.

야호! 이제 원하는 폰트로 이쁘게 바로 디자인 해보세요!