----- IT -----111 Appspresso(앱스프레소) - DeviceInteraction(모바일기기 동작) 모바일 단말기의 비프음, 진동, 라이트등을 제어하는 방법의 예제입니다. 현재 아이폰은 진동기능만 제공되고 있고, 안드로이드에서는 진동과 비프음기능이 가능하군요. 그럼, 예제소소를 보겠습니다. 첫 화면 페이지인 index.html에서 두번째 예제가 링크되어 있는 device-interactin.html 파일을 따라가 봅니다. 4가지 리스트로 구성되어 있는데 라이트와 배경화면 기능은 아직 제공되지 않고 있습니다. 아이폰에서는 진동만 되니 vibrator 링크 페이지를 열어보겠습니다. 진둥 기능의 시작과 정지 버튼으로 구성되어 있고, 함수를 호출하고 있으니, 함수가 정의되어 있는 js 파일을 현재 페이지의 id를 참고해 찾아갑니다. js/device-interaction-vibrate.js가 보이네요. 이 파.. 2011. 8. 12. Appspresso(앱스프레소) - DeviceStatus (모바일기기 정보 확인) 다양한 사용환경이나 모바일 상태에 따라 다른 정보를 서비스해야 할때가 있습니다. 그러기 위해서는 현재 구동되고 있는 디바이스 정보가 필요할 텐데, 데모의 첫번째 예제가 기기 정보를 확인하는 방법에 대한 내용이네요. 먼저, 가장 첫 화면인 index.html를 보면, 아래와 같이 여러 css와 js로 구성 되어 있는것이 보입니다. 이중에서 기기정보 확인하는 것과 관련있어 보이는것이 devicestatus.js이겠네요.^^ 그리고, body 시작 부분에, 로딩되면서 oninit()함수를 호출 하게 되어 있습니다. 이 함수가 어디에 정의되어 있을까하고 보던중에 index.js가 눈에 띄네요. 따라가 보니 역시 oninit()함수가 보입니다. 이벤트 리스너가 있고, 아래로 보니 device 페이지가 보여질때 g.. 2011. 8. 10. jQuery Mobile Beta 2 released jQuery Mobile 베타2 버젼이 발표되었습니다. 다음달경에 베타3가 발표될 예정이라고 안내하고 있네요. 업그레이드된 주요 내용을 간단히 살펴봤습니다. 1. 지원 플레폼 추가 기존 지원가능한 플레폼에서 안드로이드2.3, 허니폰 타블렛, HP 팝 webos 3.0, 노키아 S60 지원이 추가되었네요. 2. 위젯의 decoupled 여러 위젯이 디커플링 빌드가 가능합니다. 그중에 특히 page 속성인 header, content, footer가 필요하지 않는 경우에 삭제가 가능해졌습니다. 3. 모든 위젯을 한번에 향상시킬 수 있는 "create"이벤트 신규 추가 페이지가 로딩될때 JQM은 마크업 위젯들을 찾아 향상된 버젼으로 변화시킵니다. 그런데, 이런 향상기능을 개별 위젯에 적용할 수 없어서 refr.. 2011. 8. 4. Appspresso(앱스프레소) 예제로 시작하기 - 설치 국내 기업에서 만들고 있는 하이브리드 앱을 지원하는 플렛폼입니다. 현재 베타 버젼이지만, html과 css로 만든 웹 페이지를 안드로이드와 아이폰의 앱처럼 만들어 주어 개발하기 편리한 장점을 제공하고 있습니다. 개인적으로는 폰갭보다 개발하기 쉽게 느껴지는데요^^ 그러나, 아직은 초기이고 베타 버젼이라 폰갭보다 지원하는 API가 적고 버그도 좀 있는듯 합니다. 앞으로 기대가 많이 되는데 개발하시는 분들 화이팅입니다. 지금부터 앱스프레소 사이트에서 제공하는 데모를 사용해서 하나씩 사용법을 알아보려 합니다. 기본적인 이클립스 설치와 SDK설치등은 해당 사이트에 잘 나와있으니 생략합니다. http://www.appspresso.com/appdev/doc/doc.html 우선, 앱스프레소 사이트에 있는 데모 소스.. 2011. 8. 1. Mac pro Lion 업그레이드 Mac OS Lion 업그레이드를 완료 했습니다. Macbook pro에서 Lion(MacOS 10.7) 업그레이드를 하기 위해서는 2008년 하반기 이후 출시된 모델에서 가능합니다. intel Core2 duo, Core i3, Core i5, Core i7등에서만 지원한다고 합니다. 저는 한 일년전에 산 맥북인데 벌써 턱걸이 사양이 되었네요.^^ 여튼, 라이언으로 업그레이드를 하기 위해서 최신 버젼의 Snow Leopard v10.6.8로 업그레이드를 했습니다. 그리고, 앱스토어에 접속해서 앱을 설치하듯이 라이온 앱을 구입했습니다. $29.99이네요. 그래도, OS인데 약 3만원정도 되면 완전 저렴하다는 생각이 듭니다. 설치도 OS를 앱 설치하듯이 설치가 된다니 놀랍기도 하고요. 설치하기 전에 Tim.. 2011. 7. 31. jQuery Mobile - API media, active state 알파 버전에서 있었던 Media Query Helper Classes는 beta 버전으로 오면서 사용이 중지 되었다고 합니다. CSS3를 사용해서 할 것을 추천한다고 되어있네요. 이 내용은 orientation과 breakpoint와 $.mobile.media()를 사용한 미디어 쿼리로 구성되어 있는데, 추천되어진 것처럼 CSS3로 충분히 구현 가능하니, 자세한 내용은 기술하지 않을 생각입니다. 관심 있으신 분은 아래 링크에서 보시면 될 것 같습니다. http://jquerymobile.com/demos/1.0b1/docs/api/mediahelpers.html Global “Active” state jQuery Mobile 프레임워크는 어떤 요소가 선택되었을 때 “active”라고 불려지는 테마를 사용.. 2011. 7. 18. jQuery Mobile - API Methods (API 함수) jQuery Mobile은 사용자 어플리케이션에서 사용할 수 있도록 $.mobile.object의 여러 methods와 properties를 제공합니다. 상세한 인수와 옵션은 JQM 홈페이지에서 참고하세요. http://jquerymobile.com/demos/1.0b1/docs/api/methods.html $.mobile.changePage(method) 페이지 전환시 프로그램적으로 변경합니다. 이 매소드는 폼을 전송하거나 링크를 클릭할 때 발생하는 페이지 로딩이나 페이지 전환시 내부적으로 사용됩니다. // 페이지 이동시 전환효과는 slideup이 되며, about/us.html 페이지로 이동됩니다. $.mobile.changePage( "about/us.html", { transition: "sli.. 2011. 7. 15. jQuery Mobile - API Event (이벤트 Api) jQuery Mobile 은 여러가지의 사용자 이벤트를 제공합니다. 이런 이벤트에는 다양한 터치와, 마우스, 윈도우 이벤트들이 있는데 모바일 환경 및 데스크탑 환경에서도 사용할 수 있도록 바인딩 할 수 있습니다. Live()와 bind()를 사용해 jQuery 이벤트를 다루듯이 이러한 이벤트들을 바인드 할 수 있습니다. Touch events Tap 원 터치시 touch 이벤트가 발생합니다. Taphold 터치 후 약 1초간 유지할 경우 이벤트가 발생합니다. Swipe 1초 동안 30px이상 수평으로 드래그 할 경우 이벤트가 발생합니다. Swipeleft 왼쪽 방향으로 swipe이 발생하는 경우 swiperight 오른쪽 방향으로 swipe이 발생하는 경우 Orientation change event 모.. 2011. 7. 13. jQuery Mobile - API Configuring Defaults(기본 설정 변경) JQM은 다른 jquery와 jquery ui를 사용하는 프로젝트와 다르게, 많은 마크업들의 UI를 로드되기 전에 자동적으로 변형합니다. (document.ready 이벤트가 호출되기 전). 이런 변형은 jQuery Mobile의 디폴트 설정을 기반으로 적용됩니다. 이러한 설정을 쉽게 셋팅할 수 있는 방법에 대해 알아봅니다. The mobileinit event jQuery Mobile이 실행될 때, document 객체의 mobileinit 이벤트를 호출하게 됩니다. 이 mobileinit 이벤트를 바인드 함으로서 JQuery Mobile의 디폴트 설정들을 오버라이드 할 수 있습니다. $(document).bind("mobileinit", function(){ //이곳에 변경하고 싶은 설정을 셋팅합니다.. 2011. 7. 8. jQuery Mobile - Theming Lists(리스트에 테마적용하기) 기본 스타일의 리스트의 디폴트 테마는 구분자는 b 테마로, 리스트 항목은 c 테마 입니다. Divider Inbox 12 Outbox 0 Sent 328 리스트의 테마를 셋팅하기 위해서는 리스트에 data-theme 속성을 사용합니다. Divider Inbox 12 Outbox 0 Sent 328 리스트의 특정 항목에 테마를 적용하기 위해서는 항목 태그에 data-theme 속성을 사용하면 됩니다. Divider Inbox 12 Outbox 0 Sent 328 Trash 34 Theming dividers 리스트 구분자에만 테마를 변경하고자 할 경우에는 data-divider-theme 속성을 사용합니다. Divider Inbox 12 Outbox 0 Sent 328 리스트의 카운트 수에 테마를 변경하고.. 2011. 7. 7. 이전 1 ··· 3 4 5 6 7 8 9 ··· 12 다음
