본문 바로가기

앱인벤터기초

[앱인벤터 기초] 그리기&애니매이션 - 공 이해하기 앱인벤터에서 공은 '캔버스'라는 공간 안에서 움직일 수 있는 컴포넌트입니다. 캔버스와 비슷하게 손가락으로 할 수 있는 액션(드래그, 플링, 터치)에 대해서 이벤트를 호출할 수 있습니다. 터치되는 위치는 X, Y 좌표 값으로 가져올 수 있습니다. X는 왼쪽에서부터 떨어진 픽셀 수입니다. Y는 위쪽에서부터 떨어진 픽셀 수입니다. 다른 이미지스프라이트 또는 공과 충돌하는지 이벤트를 호출할 수 있습니다. 공과 이미지스프라이트의 차이점은 이미지를 파일로 넣을 수 있으면 이미지스프라이트이고, 이미지를 넣을 수 없으면 공입니다. 공 블록 블록 설명 현재 공과 다른 스프라이트가 충돌했을 때 실행되는 이벤트입니다. 회전된 상태의 충돌까지 감지하진 않습니다. 따라서 얇고 긴 스프라이트의 경우 눈으로 보이는 것과 충돌이벤트.. 더보기
[앱인벤터 기초] 그리기&애니매이션 - 이미지스프라이트 이해하기 앱인벤터에서 이미지스프라이트는 '캔버스'라는 공간 안에서 움직일 수 있는 컴포넌트입니다. 캔버스와 비슷하게 손가락으로 할 수 있는 액션(드래그, 플링, 터치)에 대해서 이벤트를 호출할 수 있습니다. 터치되는 위치는 X, Y 좌표 값으로 가져올 수 있습니다. X는 왼쪽에서부터 떨어진 픽셀 수입니다. Y는 위쪽에서부터 떨어진 픽셀 수입니다. 다른 이미지스프라이트 또는 공과 충돌하는지 이벤트를 호출할 수 있습니다. 이미지스프라이트는 움직이는 애니매이션이 있는 컴포넌트로 게임 앱에서 가장 많이 활용합니다. 이미지스프라이트 블록 블록 설명 현재 이미지스프라이트와 다른 스프라이트가 충돌했을 때 실행되는 이벤트입니다. 회전된 상태의 충돌까지 감지하진 않습니다. 따라서 얇고 긴 이미지스프라이트의 경우 눈으로 보이는 것.. 더보기
[앱인벤터 기초] 그리기&애니매이션 - 캔버스 이해하기 앱인벤터에서 캔버스 컴포넌트는 그림을 그리거나 '공' 또는 '이미지스프라이트'가 움직일 수 있는 공간입니다. 손가락으로 할 수 있는 액션(드래그, 플링, 터치)에 대해서 이벤트를 호출할 수 있습니다. 터치되는 위치는 X, Y 좌표 값으로 가져올 수 있습니다. X는 왼쪽에서부터 떨어진 픽셀 수입니다. Y는 위쪽에서부터 떨어진 픽셀 수입니다. 캔버스 안에 선, 원, 원호, 도형, 글자를 그리거나 표시할 수 있습니다. 캔버스 블록 블록 설명 사용자가 캔버스를 드래그 할 때 발생하는 이벤트입니다. 드래그는 처음 시작하는 지점(시작X, 시작Y), 이전 지점(이전X, 이전Y), 현재 지점(현재X, 현재Y) 값을 가져올 수 있습니다. 사용자가 캔버스를 플링(빠른 스와이프) 했을 때 발생하는 이벤트입니다. 왼쪽 상단을.. 더보기
[앱인벤터 기초] 레이아웃 - 수평배치, 수직배치 이해하기 스크린에 넣는 컴포넌트는 한줄에 하나씩만 들어갈 수 있습니다. 한 줄에 여러개의 컴포넌트들을 넣고 싶을 때에는 레이아웃 요소들을 사용하면 됩니다. 수평배치 블록 수평배치는 컴포넌트들이 왼쪽에서부터 오른쪽으로 가로로 정렬되도록 하는 레이아웃입니다. 수평배치는 기본적으로 수평정렬은 왼쪽에서부터, 수직정렬은 위쪽에서부터 시작됩니다. 화면 안에 컴포넌트들이 정렬되게 할 때 주로 사용합니다. 블록 설명 수평배치 안에 들어있는 컴포넌트들이 가로로 정렬될 때 왼쪽, 가운데, 오른쪽으로 정렬되도록 설정합니다. 수평배치 안에 들어있는 컴포넌트들이 세로로 정렬될 때 위쪽, 가운데, 아래로 정렬되도록 설정합니다. 배경색을 가져오거나 변경할 수 있는 블록입니다. 기본적으로 rgba 배경값을 가지고 있습니다. 세로길이 값을 가.. 더보기
[앱인벤터 기초] 사용자 인터페이스 - 웹뷰어 이해하기 사용자 인터페이스는 화면 구성에 가장 많이 사용되는 컴포넌트들을 모아 놓은 그룹입니다. 그룹안에는 버튼, 체크박스, 날짜선택버튼, 이미지, 레이블, 목록선택버튼, 목록뷰, 알림, 암호텍스트박스, 슬라이더, 스피너, 스위치, 텍스트박스, 시간선택버튼, 웹뷰어가 포함되어 있습니다. 웹뷰어 블록 스크린 안에서 웹페이지를 보여주는 컴포넌트입니다. 웹뷰어 안에서 링크를 눌렀을 때 페이지가 변경될 수 있게 설정하거나 쿠키데이터를 삭제하거나 JavaScript 코드와 연동해서 동작하게 할 수 있습니다. 스마트폰 자체 뒤로가기 버튼을 누르면 웹뷰어가 뒤로가는게 아니라 앱이 종료될 수 있습니다. 블록 설명 페이지가 로딩되기 전에 '실행' 안의 블록들을 실행합니다. 오류가 발생하면 이벤트가 실행됩니다. 페이지가 로딩된 후.. 더보기
[앱인벤터 기초] 사용자 인터페이스 - 시간선택버튼 이해하기 사용자 인터페이스는 화면 구성에 가장 많이 사용되는 컴포넌트들을 모아 놓은 그룹입니다. 그룹안에는 버튼, 체크박스, 날짜선택버튼, 이미지, 레이블, 목록선택버튼, 목록뷰, 알림, 암호텍스트박스, 슬라이더, 스피너, 스위치, 텍스트박스, 시간선택버튼, 웹뷰어가 포함되어 있습니다. 시간선택버튼 블록 '버튼'과 비슷하게 생겼지만 클릭했을 때 시간을 선택할 수 있는 창이 보이는 컴포넌트입니다. 스마트폰의 시간과 연결되어 있어서 현재 시간이 자동으로 표시됩니다. 블록 설명 시간설정 후에 '실행' 안의 블록들을 실행합니다. (다른 컴포넌트에서)시간선택버튼이 선택되었을 때 '실행' 내부의 명령을 실행합니다. 시간선택버튼에서 다른 컴포넌트가 선택되었을 때 '실행' 내부의 명령을 실행합니다. 시간선택버튼을 누르고 있으면.. 더보기
[앱인벤터 기초] 사용자 인터페이스 - 텍스트박스 이해하기 사용자 인터페이스는 화면 구성에 가장 많이 사용되는 컴포넌트들을 모아 놓은 그룹입니다. 그룹안에는 버튼, 체크박스, 날짜선택버튼, 이미지, 레이블, 목록선택버튼, 목록뷰, 알림, 암호텍스트박스, 슬라이더, 스피너, 스위치, 텍스트박스, 시간선택버튼, 웹뷰어가 포함되어 있습니다. 텍스트박스 블록 텍스트박스는 사용자에게 글자(텍스트)를 입력할 수 있게 하는 컴포넌트입니다. 기본적으로 텍스트박스가 비어있을 경우 힌트를 통해 사용자가 어떤 값을 입력해야되는지 제시할 수 있습니다. 여러줄(MultiLine) 속성을 사용하면 두 줄이상 글자를 입력할 수 있으며 한 줄 입력상태 일 때는 완료버튼을 누르면 키보드가 닫히지만 여러줄일 경우 '키보드화면숨기기'를 호출하거나 Back를 눌러야 벗어날 수 있습니다. 블록 설명.. 더보기
[앱인벤터 기초] 사용자 인터페이스 - 스위치 이해하기 사용자 인터페이스는 화면 구성에 가장 많이 사용되는 컴포넌트들을 모아 놓은 그룹입니다. 그룹 안에는 버튼, 체크박스, 날짜선택버튼, 이미지, 레이블, 목록선택버튼, 목록뷰, 알림, 암호텍스트박스, 슬라이더, 스피너, 스위치, 텍스트박스, 시간선택버튼, 웹뷰어가 포함되어 있습니다. 스위치 블록 스위치는 사용자가 탭을 하면 불리언 상태를 변경할 수 있는 컴포넌트입니다. 여기서 불리언(Boolean)은 참과 거짓을 나타내는 데이터형입니다. 스위치를 탭하면 참에서 거짓, 거짓에서 참으로 바뀌게 됩니다. 스위치 컴포넌트는 체크박스 컴포넌트와 외형만 다를 뿐 기능은 거의 비슷합니다. 블록 설명 스위치의 상태가 참에서 거짓, 거짓에서 참으로 변경될 때 '실행' 내부의 명령을 실행합니다. (다른 컴포넌트에서)스위치가 .. 더보기