----- IT -----111 Appspresso(앱스프레소) - File read/write (파일 읽고 쓰기) 파일 제어 기능 예제에 대하여 알아보겠습니다. 시작합니다. index.html입니다. 파일 시스템 데모 링크를 따라가니, 두개의 항목을 갖는 리스트가 나옵니다. 첫번째 항목인 read/write 링크를 열어보겠습니다. 저장하고자 하는 파일 이름을 입력받고, 저장할 텍스트 내용을 입력받습니다. 버튼이 세개가 있네요. 각각 파일을 저장하는 함수를 호출하고, 파일을 읽어오는 함수를 호출하고, 폴더 내용을 볼수있는 함수를 호출하도록 되어 있습니다. js/filesyste-readwrite.js 파일에 정의되어 있는 세가지 함수를 보겠습니다. 파일을 저장하는 함수입니다. deviceapis.filesystem.resolve() 함수를 사용하여 파일 핸들을 반환합니다. 성공적으로 반환되면 콜백함수를 호출하게 되고,.. 2011. 8. 28. Appspresso(앱스프레소) - Email (이메일 전송) 이번에는 Email전송 기능에 대한 예제를 보겠습니다. 처음인 index.html에서 시작합니다. Email링크를 따라 가보겠습니다. 메일을 보내기 위한 입력 화면이 있고, 전송버튼이 보입니다. 전송버튼 클릭시 호출되는 sendMail() 함수를 찾아보겠습니다. js/extapi-sendmail.js 를 열어보니, 호출되는 함수가 있군요. 콜백 함수와 메일을 보내기 위한 정보를 담는 객체를 생성하고, ax.ext.net.sendMail함수를 호출하게 됩니다. 실제 아이폰에서는 메일 송신 창이 뜨게 되고, SMS와 마찬가지로 한번더 확인하고 전송버튼을 눌러야 메일이 전송되게 됩니다. 화면은 아래와 같습니다. 2011. 8. 27. Appspresso(앱스프레소) - SMS (메세지 전송) SMS 메세지 전송하는 기능에 대한 예제를 살펴보겠습니다. index.html부터 시작합니다. 메세지 리스트항목의 링크를 따라갑니다. 세가지 항목이 있네요. 현재 버젼에서는 SMS와 Email 전송 기능만 가능합니다. SMS부터 보기위해 링크를 따라갑니다. 수신자 전화번호와 보낼 메세지를 입력하기 위한 input태그와 textarea태그가 있네요. 전송 버튼을 클릭하면 호출 하는 함수를 찾아보겠습니다. js/message-sms.js파일을 열어보니, 호출되는 함수가 보입니다. deviceapis의 메세징을 이용해서 SMS타입의 새로운 메세지를 가져옵니다. 가져온 메세지 객체에 보낼 메세지 정보를 셋팅하고 sendMessage를 호출하여 전송하는군요. 실제 아이폰에서 실행시키면 바로전송되지 않고 기본 메세.. 2011. 8. 26. Appspresso(앱스프레소) - Video capture (비디오 캡쳐) 이번에는 동영상 찰영 기능에 대한 예제를 살펴보겠습니다. index.html에서 카메라 링크를 따라갑니다. 비디오 캡쳐 기능인 세번째 항목의 링크 페이지를 열어보겠습니다. 세가지 버튼이 보이고, 각각 호출되는 함수들이 있군요. 함수가 정의되어 있을 js들을 찾아보겠습니다. index.js에서 위 세가지 버튼이 있는 page에 이벤트를 등록하네요. 그리고, 페이지가 보여질때 호출되는 함수와 페이지가 사라질때 호출되는 함수가 보입니다. 페이지가 보여질때 호출되는 데모함수를 보면, 카메라 라이브뷰에서 본 함수와 타겟 이름만 다르고 나머진 동일하네요. 이제, 페이지가 뜨면서 비디오 영상을 캡처 할 준비가 되었을 것입니다. 세가지 버튼중 start버튼을 클릭하면 아래 함수가 호출되면서 영상을 캡처합니다. stop.. 2011. 8. 19. Appspresso(앱스프레소) - Camera Capture (카메라 캡쳐) 카메라 기능을 이용해서 사진찍기와 기존 사진 불러오기 예제입니다. 자 시작해 볼까요. index.html입니다. camera.html을 따라가 보겠습니다. 두번째 항목의 링크 페이지를 열어봅니다. 초기 이미지를 셋팅하고 두개의 버튼이 있네요. 이미지를 캡쳐하는 함수와 이미지를 선택하는 함수가 정의되어 있는 js를 찾아 열어보겠습니다. js/extapi-capture-image.js를 열어보니 위 두개의 함수가 정의되어 있습니다. imageCapture함수를 보면, 이미지를 캡쳐하는 api를 호출하고 filesystem api를 사용해 캡쳐한 파일을 찾아 이미지의 경로를 설정합니다. 사용하는 api이름이 앞에서 보았던 deviceapis.cameramanager가 아니라, 앱스프레소에서 확장된 기능을 제공.. 2011. 8. 18. Appspresso(앱스프레소) - Camera liveview (카메라 미리보기) 이번 예제는 카메라 기능입니다. 아마도 전화 기능 다음으로 많이 사용하게 되는 기능인것 같습니다.^^ 시작할까요. index.html입니다. 카메라 매뉴 페이지를 보니 세가지 항목으로 구성되어 있군요. 첫번째 라이브 뷰 페이지를 보겠습니다. div태그만 있고 별거 없네요. 그럼 관련된 js 파일을 찾아보겠습니다. index.js에 라이브 뷰 페이지가 보여질때 호출하는 함수와 페이지가 사라질때 호출되는 함수가 정의되어 있습니다. 위 함수들이 정의되어 있는 js/camera-capture-video.js을 열어 함수를 살펴봅니다. 기존에 카메라 정보가 없다면, getCameras를 호출하고, 지원가능한 카메라 정보가 이미 있다면 startPreview함수를 호출하는군요. getCameras함수는 device.. 2011. 8. 17. Appspresso(앱스프레소) - Orientation (방향계) 센서 기능중에서 마지막인 방향계에 대하여 살펴보겠습니다. 역시 이번에도 index.html부터 봐야겠죠. 마지막 센서 예제인 방향계의 링크 페이지로 가보겠습니다. 캔버스 태그가 보이고, 로그 같아 보이는 p태그가 있습니다. 방향계와 관련 있는 js/sensor-orientation.js을 열어보겠습니다. 앱스프레소의 deviceapis를 이용해서 방향계에 접근합니다. 함수 이름에서 보여지듯이 watch를 clear하는 함수이군요. demo함수입니다. 캔버스를 2d로 셋팅하고, 방향계의 변화를 감지할 수 있는 api를 호출하고 있습니다. successCallback함수인 orientationChange함수를 따라가 보겠습니다. 방향계 센서로 부터 정보를 정상적으로 가져오면 alpha, beta, gamma.. 2011. 8. 16. Appspresso(앱스프레소) - Geolocation (위치정보) 센서 예제중에서 위치정보에 대한 기능을 살펴보겠습니다. 이번에도 index.html에서 부터 시작합니다. sensor.html을 열어 두번째 링크 페이지로 따라 갑니다. 위치정보 페이지에서는 헤더와 id가 map인 div태그만이 있군요. 위치 정보와 관련 있는 js를 찾아보겠습니다. 먼저, 구글 맵 api를 사용할 수 있도록 참조 스크립트가 셋팅되어 있습니다. js/sensor-geolocation.js을 찾아 열어봅니다. 위치정보를 가져오기 위한 기능은 html5의 표준에 따라서 navigator객체에서 현재 위치를 가져오도록 되어 있군요. 구글 맵 api를 사용하여 위치, 맵, 마커를 생성하고 맵에 표시합니다. 실제 아이폰에서 실행시킨 화면입니다. 현재 위치 정보를 사용할 것인지 물어보는 창이 나오는.. 2011. 8. 15. Appspresso(앱스프레소) - Accelerometer (가속도계) 모바일 기기에서 제공하는 센서를 이용하는 예제를 보겠습니다. 예제에 나와있는 센서는 가속도계, 위치정보, 방향계 세가지 이며, 이중에서 가속도계를 먼저 살펴보려 합니다. 시작페이지인 index.html부터 보겠습니다. sensor.html을 열어보면 아래와 같이 세가지 센서에 대한 예제 링크가 있습니다. 우리의 목적은 가속도계이니 sensor-accelerometer.html를 열어봅니다. canvas 태그로 구성되어 있군요. 이 html과 연관된 js파일을 찾아 보겠습니다. js/sensor-accelerometer.js가 있네요. 열어보니 3개 함수가 정의되어 있고, 좀 복잡해 보입니다. 데모라는 이름이 붙은 함수부터 보니, 캔버스를 셋팅하고, 가속도계 api를 호출하면서 콜백함수들을 인수로 주는군요.. 2011. 8. 14. Appspresso(앱스프레소) - Pim (연락처) 중요한 연락처 정보를 제어하는 예제입니다. 아~ 아이폰 처음 사고 동기화하면서 연락처 엄청나게 날렸었던 아픈 기억이.ㅋㅋ 이번에도 index.html에서 부터 따라가 보겠습니다. pim.html 로 가보면, 아래와 같이 세개의 항목으로 구성되어 있습니다. Calendar와 Task 기능은 아직 제공되지 않네요. 우리의 목적인 연락처 링크 페이지를 따라가 보겠습니다. 하나의 리스트 항목만 덩그러니 있군요. 이벤트도 없는듯 하니 해당 페이지와 연결된 js파일을 찾아보겠습니다. js/pim-contract.js가 보이니 열어봅니다. 상당히 긴 getContacts()함수가 정의되어 있군요. 내용은 리스트를 초기화하고 연락처 api를 호출해서 결과값을 배열로 받아옵니다. 10개의 연락처를 가져와 이름과 전화번호.. 2011. 8. 13. 이전 1 2 3 4 5 6 7 8 ··· 12 다음
