P2SKLife

타이머를 이용하여 깜빡거림을 구현해 봤습니다.

이때 깜빡이는 속도는 시계의 타임인터벌로 조정하면 됩니다.

간격을 0.5초로 하려면 500으로 인터벌값을 주면됩니다.

그리고 번갈아 가면서 색을 바꿔주기 위해 변수에 매번 타이머가 작동할 때마다 -1을 곱하는 방식으로 처리하였습니다.

그러면 if문으로 두 가지 색을 번갈아 가면서 인터벌 만큼 보여주므로 깜빡이는 효과로 보여집니다.

그만두고 싶으면 타이머 enabled를 false 처리하면 됩니다.

파이어베이스 실시간 데이타베이스(Firebase Realtime DB)를 사용할 때 느낀점입니다.

일단 프로젝트와 버킷별로 실시간 데이타변경여부를 체크하는 것 같습니다.

물론 기본적으로는 태그별로 해야될 것 같은데 테스트를 해보니 간혹 의아한 처리결과가 발생하는 것을 보면 시간차가 발생하는 것 같아보입니다. 같은 버킷이라도 태그별로 저장하고 읽는 시간차가 발생할 수 있다고 봐야할 것입니다.

동시에 처리할 변수나 항목이 있는 경우라면 리스트로 만들거나 한 문자열로 만들어 저장했다가 다시 쪼개는 방법 등 따로 저장하지 않고 한번에 저장하고 읽는 방법을 고민해봐야 할 듯합니다.

로직은 간단한데 실제 변수가 너무 많이 발생해서 처리하기 참 어렵습니다.

리스트(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]를 선택하고 다운로드 한 첨부 파일을 선택하면 확인하실 수 있습니다.