대디의 IT공방

메뉴-아이콘

#앱인벤터 강좌 (8)

앱인벤터 데이터 저장 - TinyDB 사용하기

프로그래밍/앱 인벤터(App Invertor) 아빠달 2017. 3. 19. 08:00

앱인벤터 데이터 저장 - TinyDB 사용하기 앱인벤터에서는 기본 저장소를 제공해 주고 있습니다. TinyDB라는 저장소에 데이터를 저장했다가 다시 불러오는 연습을 해보도록 하겠습니다. TinyDB 는 태그라는 이름으로 저장을 시키는데요. 예를 들어 입력 전화번호 앱을 만든다면 이름과 전화번호가 들어가겠지요? 이름을 A, 전화번호가 000 일때 찾을 때도 A로 찾으면 000이 나옴니다. 실제로 한번 보는게 이해하시기가 빠르겠지요? 화면 디자인하기 먼저 버튼과 텍스트 박스 그리고 라벨을 이용하여 아래 그림처럼 배치를 시켜 줍니다. 그리고 버튼의 속성에서 버튼 텍스트를 저장하기와 불러오기로 수정해 줍니다. 그리고 저장소 Storage에서 빈화면에 옮겨 줍니다. 그러면 화면 디자인은 끝이 납니다. 아주 간단하..

앱인벤터 시간 표시 - 시계앱만들기

프로그래밍/앱 인벤터(App Invertor) 아빠달 2017. 3. 17. 01:36

앱인벤터 시간 표시 - 시계 앱만들기 이번에는 간단하게 시간이 계속 출력되는 간단한 시계앱 예제를 만들어 보겠습니다. 시간 관련 컴퍼넌트는 Clock 이라는 컴포넌트를 사용합니다. Clock 컴퍼넌트는 시간을 알려주거나 타이머가 필요할때 사용하는 컴퍼넌트입니다. 시간 표시 앱 디자인하기 먼저 새 프로젝트를 실행 시킨 다음 Label을 컴퍼넌트를 오른쪽 화면에 옮겨 놓습니다. 이번에는 Sensors에 들어 있는 Clock 컴퍼넌트를 화면에 옮겨 놓으면 아래 하단에 보이지 않는 컴퍼넌트로 이동을 합니다. Label 위치를 가운데로 변경하려면 스크린을 선택을 한 다음 AlignHorizontal 속성을 Center:3 으로 변경합니다. 그러면 라벨 위치가 가운데로 이동합니다. 시계 앱 코딩하기 시계는 앱이 보..

앱인벤터 - 위치센서 사용방법

프로그래밍/앱 인벤터(App Invertor) 아빠달 2017. 1. 14. 09:43

앱인벤터 센서 기능 중 위치 센서 사용방법을 알아보도록 하겠습니다. 앱인벤터 위치 센서는 위도, 경도뿐만 아니라 고도, 현재 위치 주소까지 알려줍니다. 이번 시간에는 앱인벤터 위치 센서를 가지고 현재 위치의 위도, 경도, 현재 주소를 알아보는 예제를 만들어 보도록 하겠습니다. 앱인벤터 위치센서 이용하여 현재 위치 주소 알기 화면 디자인하기 1. 화면 디자인을 하겠습니다. 사용자 인터페이스에서 버튼과 레이블을 옮긴 다음 버튼을 클릭하고 오른쪽에 있는 속성 중 텍스트 속성에서 버튼은 [현재 위치] 나머지 레이블은 [위도 표시], [경도 표시], [주소 표시]로 변경해줍니다. 2. 그리고 컴포넌트에서 각각의 버튼과 레이블 이름도 변경시켜줍니다. 그래야 나중에 헷갈리지 않습니다. 3. 이제는 필요한건 위치센서입..

앱인벤터 강좌 전화걸기 연결 예제

프로그래밍/앱 인벤터(App Invertor) 아빠달 2017. 1. 11. 13:57

이번 시간에는 앱인벤터 강좌 전화번호 연결하는 예제를 만들어 보도록 하겠습니다. 이렇게 예제 하나하나 만들다 보면 제대로 된 앱 하나 만들 수 있겠조? 전화번호 앱은 동작 예제는 텍스트 박스에 전화번호를 입력하고 버튼을 클릭하면 바로 전화를 거는 것과 버튼을 클릭하면 전화번호부 목록이 나타나는 프로그램을 만드는 것입니다. 화면 디자인하기 1. 사용자 인터페이스에서 텍스트 상자와 버튼을 하나씩 가져와 배치를 시켜줍니다. 여기서 텍스트 상자에 전화번호를 넣고 버튼을 누르면 전화통화를 할 수 있게 만들 것입니다. 2. 소셜을 클릭하면 [전화번호 선택]이 있습니다. 선택을 한 다음 끌어 놓습니다. 여기서 [전화번호 선택] 버튼을 클릭하면 전화번호부 앱이 나타나게 할것입니다. 3. [전화]도 컴포넌트에 넣습니다...

앱인벤터 그림그리기 앱만들기

프로그래밍/앱 인벤터(App Invertor) 아빠달 2016. 11. 19. 18:00

엔트리와 스크래치2.0 로 그림판을 아주 간단히 만들어 봤는데요 이번에는 앱인벤터로 그림을 그릴 수 있는 간단한 앱을 만들어보겠습니다. 이번 시간에는 간단하게 손으로 스마트폰 화면을 안에서 손가락으로 드래그하면 선이 그려지는 그림그리기앱을 만들어 보겠습니다. 앱인벤터 그림그리기 앱만들기 화면 디자인 그림을 그리기 위해서는 그림을 그릴 수 있는 스케치북 같음 무언가가 필요한데요 앱을 만들 때에도 그 무언가가 필요합니다. 여기서는 캔버스라는 컴퍼넌트가 필요합니다. [그리기 & 애니메이션]을 클릭한 다음 [캔버스] 를 드래그하여 뷰어에 옮겨 놓습니니다. 이번에는 캔버스의 크기를 맞춰 줄 것입니다. 화면 전체 다 사용을 할 것이기 때문에 화면을 크게 맞춰 줘야합니다. 먼저 컴포넌트에 있는 [캔버스1]을 선택을 ..

앱인벤터 강좌 - 음성인식 컴포넌트 활용하기

프로그래밍/앱 인벤터(App Invertor) 아빠달 2016. 7. 2. 07:49

앱인벤터 강좌 - 음성인식 컴포넌트 활용하기 첫 시간에 텍스트를 음성으로 변환시겨 보았는데요이번에는 반대로 음성인식 컴포넌트를 이용하여 텍스트로 출력해보겠습니다. 앱인벤터 음성인식 컴포넌트 실행 동영상 어플리케이션 실행 조건1. 버튼을 클릭하면 음석인식 컴포넌트를 실행시킨다.2. 음성인식 컴포넌트가 실행 되어 음성인식을 시작합니다.3. 음성 인식이 끝나면 레이블에 텍스트가 표시된다. 화면 구성▲ 위 그림 처럼 버튼과 레이블을 배치하고 버튼의 이름과 텍스트를 변경시겨 주세요 ▲ 미디어에서 [음성인식] 컴포넌트를 뷰어 화면에 옮겨 놓으면 3번 보이지 않는 컴포넌트 안에 [음성 인식] 컴포넌트가 자동으로 들어갑니다. 블록 설정하기▲ 음성인식 버튼을 클릭하여 실행 블록을 옮겨 놓습니다. ▲ 음성인식 컴포넌트를 ..

앱인벤터 강좌 - 텍스트 음성으로 변환하기

프로그래밍/앱 인벤터(App Invertor) 아빠달 2016. 6. 26. 23:23

앱인벤터 강좌 - 텍스트 음성으로 변환하기 앱인벤터로 간단한 예제를 한번 만들어보겠습니다.텍스트 상자에 글씨를 입력하고 버튼을 누르면 텍스트 상자에 있는 문자를 음성으로 변화하여 읽어주는 앱을 만들어 보겠습니다. 앱인벤터 텍스트 음성으로 변환 실행 동영상 꼭 알아두기컴퍼넌트를 추가하는 방법과 이름을 변경하는 방법블록 사용하는 방법을 꼭 알아두시기 바랍니다. 어플리케이션 실행 조건1. 텍스트 상자에 문자를 입력한다.2. 버튼을 클릭하면 텍스트 상자에 있는 문자를 음성으로 변환시켜 준다. 화면 구성하기▲ 먼저 새로운 프로젝트를 생성해 줍니다.파일이름은 꼭 시작을 영문으로 시작해야합니다. ▲ 사용자 인터페이스에 있는 텍스트 상자와 버튼 상자를 클릭하여 위에 그림 처럼 배치를 시켜 줍니다. ▲ 컴포넌트에서 텍스..

앱인벤터 강좌 - AI 컴패니언 설정하기

프로그래밍/앱 인벤터(App Invertor) 아빠달 2016. 6. 16. 15:08

앱인벤터에서 앱을 제작하는 동안 실제 앱이 제대로 동작을 하는지 보려는 작업을 [라이브 테이트]라고 합니다. 연결을 클릭해 보면 라이브테스트 설정하는 방법은 AI companion, Emulator, USB 방법 3가지가 있습니다. ▲AI companion, Emulator, USB 각각의 연결 방법을 알아보도록 하겠습니다. ▲ AI컴패니언(AI companion) AI컴패니언(AI companion) 방법은 앱인벤터에서 권장하는 방법으로실시간으로 앱 동작을 확인 할 수 있는 방법입니다.전제 조건은 안드로이드 기기와 컴퓨터가같은 망으로 연결이 되어 있어야 한다는 것입니다. ▲ 에뮬레이터 이 방법은 안드로이드 기기가 없을 경우 사용하면 좋은 방법입니다. 단점은 속도가 많이 느립니다. ▲ USB와 스마트폰을..

Copyright © 대디의 IT공방 All Rights Reserved
Designed by JB FACTORY

티스토리툴바