P2SKLife

그림을 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를 클릭하여 방금 업로드한 파일을 선택하면 디자인의 폰트가 변경됩니다.

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

앱인벤터도 최근 복사기능이 추가되었다.

코듈러도 복사[이동]기능이 가능하다.

Kodular에서는 [Copy Screen]을 하면 현재 Screen을 복사하여 새로운 Screen을 만들어 준다.

App Inventor에서는 화면을 추가하고 컴포넌트를 복사하기[Ctrl+C] 또는 잘라내기[Ctrl+X] 후

원하는 위치 바로 위의 컴포넌트를 선택한 후 붙여넣기[Ctrl+V]하면 된다.

해당 컴포넌트의 블럭까지도 복사가 된다.

이제 컴포넌트를 복사하기와 붙여넣기로 손쉽게 작업할 수 있게 되었다.

앱인벤터는 광고를 직접 등록할 수가 없지만 간접적으로 할 수 있습니다.

앱인벤터로 제작한 앱을 파일(aia확장자)로 다운로드 받습니다.

메뉴의 [프로젝트]에서 [선택된 프로젝트(aia)를 내 컴퓨터로 보내기]를 선택하시면 됩니다.

kodular를 실행하시고 메뉴 중 [Project]에서 [Import project (.aia) from my computer]를 선택하고 방금 다운로드 받은 파일을 선택하면 됩니다.

이제 AdMob광고를 디자인하고 블럭코딩을한 후 광고ID를 복사해 넣으면 됩니다.

이때 주의사항은 제작자는 광고를 클릭하시면 안됩니다.

그러면 광고승인이 안될 수 있습니다. 일종의 부정클릭인 셈이라고 할까요.. 이점 주의하세요..

먼저 컴포넌트를 추가해야합니다.

컴포넌트 메뉴 중 맨 밑에서 세번째 [$ Monetization]-[Advertising]를 클릭하면

AdMob광고 컴포넌트가 있습니다.

AdMob Banner는 화면 상단 또는 하단 등 일부 공간을 차지하여 계속 보여주는 배너광고입니다.

AdMob Interstitial은 화면이 바뀔때 화면전체에 광고를 보여주는 전면광고입니다.

[Designer]에서 이것을 원하는 스크린에 추가하세요.

[Blocks]에서 위와 같이 코딩하세요. [Battle]은 스크린이름입니다. [Menu]는 화면이동을 위한 버튼이름입니다.

이제 AdMob에서 광고를 등록하고 ID를 복사해서 붙여넣기 해야합니다.

혹시 AdMob에 아직 등록이 안되었다면 구글계정으로 간편하게 할 수 있습니다.

AdMob에 로그인 한 후

메뉴 중 [앱]을 클릭하고 [앱 추가]를 클릭하세요.

앱을 앱마켓에 아직 등록안 했기 때문에 [아니요]를 클릭합니다.

[앱 정보 입력]에서 [앱이름]을 입력하고, 플랫폼[Android, ios] 중 선택하고 [추가]를 클릭하세요.

[다음단계:광고단위만들기]를 클릭하세요.

[배너]를 선택하세요.

[광고 단위 이름](예:상단,하단,전면 등)을 입력하고 [광고단위만들기]를 클릭하세요.

[완료]를 클릭하세요.

화살표를 클릭하면 광고ID가 복사됩니다.

이제 kodular [designer]로 돌아와서

AdMobBanner를 클릭한 후

속성을 그림처럼 처리합니다.

방금 복사한 ID를 Ad Unit Id에 붙여넣기합니다.

Test Mode는 클릭해제합니다.

[전면]과고도 배너와 같은 방법으로 하시면 됩니다.

이제 앱을 실행하면 광고가 보이게 됩니다.

인터넷에서 아이콘을 다운 받습니다. 이때 그림 파일의 확장자를 png(배경 투명 처리)인 것을 고르시면 됩니다.

일반 jpg확장자 아이콘은 배경색이 투명이 아니라 회전시키면 CD회전하는 모양이 제대로 구현되지 않습니다.

Image 콤포넌트를 핸드폰 화면 원하는 위치에 추가한 후 다운 받은 아이콘을 속성의 picture에 추가합니다.

이때 Height와 Width를 핸드폰에 화면에 맞게 크기를 [숫자, %, auto, parent] 을 사용하여 적절하게 조절합니다.

그리고 디자인에서 콤포넌트 중 [clock]을 추가합니다.

이 클락의 [interval]을 기본 1000으로 하지 말고 대략 50 내외의 숫자로 조정합니다.

그래야 영화의 프레임과 같이 적절한 회전 모양이 구현됩니다. 숫자가 크면 뚝 뚝 끊기는 현상이 발생하니 숫자를 적당히 보기 좋은 모양이 구현되는 것으로 조절하세요.

그리고 위와 같이 블럭을 처리하시면 됩니다. 이때 더하는 숫자도 적절하게 본인의 취향에 맞춰 조절하시면 됩니다.

숫자가 너무 크면 역시 부드럽지 않은 회전이 구현됨으로 적절하게 조절하시면 됩니다.

디자인에서 그림과 같이 버튼을 배치합니다.

물론 이미지는 따로 아이콘을 다운받아서 버튼 속성에서 Image에 추가하면 됩니다.

[Total Time]은 유튜브 음원의 총 재생시간을 처리하는 루틴입니다. 생략해도 됩니다.

[Before]버튼에서는 유튜브를 일시정지시키고 시작 포지션을 0로 세팅해줍니다. 그리고 유튜브 목록의 인덱스를 하나 감소시켜주고 유튜브를 play합니다.

[Next]버튼에서는 유튜브를 일시정지시키고 시작 포지션을 0로 세팅해줍니다. 그리고 유튜브 목록의 인덱스를 하나 증가시켜주고 유튜브를 play합니다.

디자인에서 버튼[Quit]을 만들어 놓습니다.

이 버튼을 클릭하면 앱을 종료할지 여부를 묻고 그 대답에 따라 처리하는 예제입니다.

버튼의 순서가 참 그렇더라구요.. 위 그림처럼 하시면 왼쪽에 [예], 오른쪽에 [아니오], 취소버튼은 생략됩니다.