아이폰 5, iOS6, 구글 맵 등등 화제거리가 많았죠? 일반적으로 잘 모르는 것 중 하나가 구글은 standard Android device에만 구글 맵을 제공하지 customized 된 Android 에는 구글 맵을 제공하지 않고 있습니다. 그래서 결국은 iPhone 5, Kindle Fire, Nook  같은 디바이스에서는 built-in 구글 맵을 서비스 받을 수가 없는 것이죠.

애플의 경우 구글 맵을 버리고 자체 개발한 맵을 사용하게 됐죠? 그런데 아마존이나 Barnes & Noble 같은 경우는 구글의 지배를 받고 있습니다. 그러니까 구글 맵을 사용할 수 없는거죠.(customization 하지 않을 경우)

(Incidentally, in the case of Apple, I think Google made a strategic blunder, perhaps suffering from some foresight. How magical would it have been for a Google Maps app for iOS to be formally announced a week after the iPhone 5 launch? Everyone would have cheered.)

Corona in daily build 903에서 Native Map view를 사용 가능하도록 했는데요, 킨들 파이어와 NOOK 까지 포함해서 모든 안드로이드 디바이스에서 구글 맵을 제공할 수 있는 방법을 찾았습니다. 저희가 standard Android API를 사용한다면 Kindle 과 NOOK은 구글의 정책에 따라서 native map view나 구글 맵을 사용하지 못할 겁니다. 저희는 안드로이드 기기에서 좀 더 native map view를 제대로 사용할 수 있는 방법을 찾기로 작정 했었죠. 그래서 저의만의 implementation을 개발했습니다. 이렇게 함으로서 단지 plain-vanilla Android device 뿐만이 아니라 Kindle 과 NOOK에서도 그 기능을 사용할 수 있게 됐습니다.

그리고 좋은 소식 하나 더 있는데요.

몇주전에 새로운 Kindle Fire HDs 가 나왔습니다. 성능대비 굉장히 매력적인 가격이죠. 이 Kindle Fire HDs는 customized 된 Android 4.x를 사용합니다. 그래서 저희들은 최근에 Android 4.x 버전에 대한 많은 이슈들을 해결했습니다. 그리고 daily build 909부터 시뮬레이터에 두개의 새로운 Kindle Fire HD 스킨을 추가했습니다. (하나는 7 인치짜리고 다른 하나는 9인치 짜리입니다.)  이제 코로나로 좀 더 많은 디바이스를 위한 앱을 개발 하실 수 있습니다.

Barnes & Noble 도 두개의 새로운 NOOK HD 모델들을 오늘 발표했습니다. 두달 전 저희들은 이 device들에 대해 짧게 경험할 기회가 있었습니다. 이제 실제 제품을 볼 수 있게 되서 아주 기쁩니다.

저희들은 이 새 NOOK에서도 잘 작동하는 코로나 앱을 만들 수 있도록 해야 되겠다고 생각했습니다. 저희가 처음 이 기기들에 대해 들었을 때 Barns & Noble 팀에게 저희들이 그 기기에 맞는 기능을 넣기 위해 그 쪽에서 준비해야 할 사항들을 알려 줬었습니다. 이러한 내용들이 다 적용되고 기존의 앱들이 별 일 없이 이들 기기에서 잘 돌아가기를 바랍니다. 만약 제대로 작동 되지 않는 경우가 있다면 저희들 쪽에서 기존의 코로나 앱들이 새로운 NOOK에서도 잘 돌아가도록 작업을 할 겁니다. 그래서 개발자 여러분들이 기존의 앱을 굳이 re-build 할 필요가 없도록 할 계획입니다.

이 기기들은 11월에 출시 됩니다. 아마 이번 겨울에는 아주 많은 HD 태블릿들이 나올 것 같습니다.

다시 수요일의 FAQ 시간이 왔습니다. 이번주는 iOS builds, API documentation 과 안드로이드에 대해 자주 질문 되는 것들을 추려봤습니다.

1. I’m using build 922 and I’m getting a code signing error after an iOS build. What’s wrong?

build 922 부터 코로나는 iOS 6 SDK 에 대해 빌드 할 수 있도록 했습니다. 여기에는 Xcode 4.5 가 필요합니다. Xcode 가 4.5 이전 버전일 경우 이 에러메세지를 보시게 됩니다.

2. I see new APIs added to Corona but the API docs are not being updated.

web 상의 API documentation은 현재 릴리즈 된 버전 (2012.894) 에 대한 documentation 입니다. 이 API에 대한 documentation은 Daily Builds page의 zip 파일로 압축돼 있는 Daily Build 안에 추가되거나 수정 된 내용이 들어갑니다.

3. I’m trying to use File I/O on Android to read files and it’s not working. It does work in the Simulator and on iOS. Is this a bug?

Android APK 는 zip 파일 입니다. 리소스 디렉토리에 있는 파일들은 APK 파일 안에 들어가게 됩니다. 즉 zip 파일로 압축된다는 얘기죠. io.open() 같은 Lua I/O API는 zip 파일 안에 있는 파일들을 압축을 풀어서 오픈할 수가 없습니다. 그러니까 APK 안에 있는 파일을 오픈하지 못하는 겁니다.

그래서 저희들은 안드로이드와 관련해서 특별하게 동작할 수 있는 기능을 구현했습니다. system.pathForFile() 이라는 건데요. 특정 파일 타입에서 이 메소드는 자동으로 그 파일의 압축을 풀어서 outside 디렉토리에 copy를 합니다. 일종의 해킹이랄 수 있는데요. 좋은 방법은 아닙니다. 왜냐하면 storage 공간을 낭비하는 일이거든요. 어쨌든 이 방법으로 Lua I/O API들이 특정 파일 타입들에 access 할 수 있습니다.

system.pathForFile()은 다음과 같은 파일 형식을 제외한 파일 타입들을 자동 압축 해제 합니다. : 
 *.html
 *.htm
 *.3gp
 *.m4v
 *.mp4
 *.png
 *.jpg
 *.ttf

무슨 의미냐 하면요 위의 파일들은 Lua I/O API로 access 할 수 없다는 의미입니다. 다른 모든 파일들은 system.pathForFile()을 call 하면 자동적으로 압축을 풉니다. 이런 이유로 여러분은 여러분의 HTML file에 access 할 수 없는거죠. HTML 파일이 auto-extracted 되지 않는 이유는 HTML 파일에는 이미지들도 링크가 돼 있기 때문에 Corona 가 이 웹 페이지를 보이도록 하려면 이미지들 까지 auto-extract  해야 되기 때문입니다. 만약 그렇게 되면 이미지들은 아주 많은 저장공간을 차지하게 될 겁니다. 그래서 이 기능을 넣지 않는 겁니다.

위의 파일들에 access 하는 한 방법은 (e.g. png, jpg) file.png.txt 같이 rename 하는 겁니다. 그러면 특정 파일을 Documents나 Temporary 디렉토리에 copy 할 수 있을 겁니다. 그리고 나서 다시 원래대로 이름을 되돌리면 되겠죠. 용량이 큰 파일이라면 메모리 공간을 아주 많이 소비할 거라는 것을 명심해 두세요.

4. I’m displaying an image and trying to update it with a new image and it’s not updating. What’s wrong?

코로나는 파일 이름을 근거로 해서 이미지 데이터를 캐싱합니다. 똑 같은 이름으로 이미지를 로드하려고 한다면 그리고 이전 이미지가 현재 active 상황이라면 코로나는 이것을 같은 이미지로 생각할 겁니다. 그러면 이전 이미지를 사용하겠죠. 이런 상황은 서버에서 이미지를 가져오는데 실제 이미지는 바뀌었는데 이름은 바뀌지 않은 경우에 발생합니다. 해결 방법은 로딩하기 전에 새 이미지의 이름을 바꾸거나 새로운 이미지를 로딩하기 이전에 이전의 이미지를 지우는 겁니다. 이전 이미지 객체에 removeSelf를 call 하세요. 그러면 이미지 데이터와 파일 이름 사이의 관계까지도 remove 될 겁니다.

5. How to get a cleaner ADB Logcat debug display

이건 질문은 아니고 그냥 제가 코로나 포럼에서 찾아내서 알려드리는 팁입니다. (그 글을 올린 분 성함이 없어서 밝히지를 못합니다. 죄송합니다.) 그 팁은 Android OS 가 보내는 다른 busy 메세지들은 보이지 않고 그냥 print 메세지만 보이게 하는 방법입니다. Android SDK를 인스톨 하신분들은 코드를 디버깅할 때 ADB 프로그램을 사용 하실 겁니다.

안드로이드 SDK 에서 아래와 같이 adb를 실행하세요.

만약 제대로 작동하지 않으면 파라미터들을 없애고 다시 시도해 보세요.

여기까지고 오늘의 FAQ 들이었습니다. 감사합니다.

display.setDefault( "background", 200 )

또 다른 옵션은 배경 이미지를 로드 하는 방법입니다. 이 이미지는 letterbox area 까지 extend 될 겁니다. 여러분 앱이 iPhone 과 iPhone 5만을 타게팅 한다면 이 이미지는 320 X 568 이 될 겁니다. 이 이미지의 y 포지션을 offset 하셔야 이 이미지가 스크린의 맨 위에서부터 시작할 겁니다. y 포지션을 지정하실 때는 display.screenOriginY를 사용하셔야 합니다.

display.newImage( "background568.png", 0, display.screenOriginY )

(저는 스크린에 가득차게 보이도록 이미지 둘레에 yellow/green border를 추가했습니다.)

config.lua file 에서 zoomEven scaling mode를 사용해 보세요. 이 zoomEven은 여러분 앱의 크기를 가로 세로 똑 같은 비율로 화면에 꽉 찰 때까지 늘릴겁니다. iPhone 5의 portrait 모드에서는 여러분 앱이 아래위로 늘어나는 만큼 좌우도 늘어나기 때문에 일부가 화면 밖으로 사라질 겁니다. (아래 screen shot을 보세요.)

위 예제는 dynamic scaling 이 320 X 480 이고 target을 iPhone, iPhone4, iPhone 5 디바이스로 했을 경우를 가정해서 얘기한 겁니다. 만약 안드로이드도 지원할 필요가 있다면 안드로이드 디바이스의 크기도 같이 고려해서 이러한 것들을 정해야 할 겁니다. (최신 CoronaSDK builds는 여러분의 content 가 제대로 표시되도록 도와주는 새로운 시뮬레이터 스크린 사이즈를 제공하고 있습니다.)

4. Why does my GameCenter crash when running on iOS 6?

만약 여러분 앱이 Apple’s GameCenter를 사용한다면 그리고 그 앱이 오직 landscape mode로만 작동이 된다면 그 상황에서 발생하는 bug 가 있습니다. 뭐냐하면 여러분 앱은 landscape 인데 GameCenter의 Sign-on Screen 은 portrait mode로 표시하려고 하기 때문에 충돌이 일어납니다. 이 상황은 여러분 앱을 iOS 6 용으로 빌드하고 그 앱을 iOS 6 device에서 작동할 때 발생합니다.

한 유저가 그 해결책을 Corona의 Forums에 올리셨는데요. content를 landscape로 세팅하고 앱은 landscape와 Portrait 모두를 지원한다고 세팅 해 놓는게 그 해결방법 입니다. 이렇게 하면 GameCenter sign-on 화면은 portrait으로 뜨고 여러분 앱은 landscape 모두에서 작동하도록 할 겁니다. 폰이 rotate 될 때 status bar 도 자동으로 rotate 될 텐데요. 대부분의 게임에서 status bar를 표시하지 않으니까 이 부분은 그리 크게 신경쓰지 않으셔도 될 것 같습니다.

아래 처럼 build.settings 파일에 코딩을 해 넣으시면 됩니다.

orientation =
{
	default = "landscapeRight",
	content = "landscapeRight",
	supported = { "landscapeLeft", "landscapeRight", "portrait" },
},

Note: 이 이슈가 iOS 6에서 빌드하고 iOS6 device에서 앱을 구동시킬때 발생하는 유일한 이슈 입니다. 만약 여러분의 기존 앱이 iOS 5.1용으로 만들었다면 이 부분은 신경 안 쓰셔도 됩니다.

5. Why don’t I see any of my print messages in the Xcode Console?

iOS 6에서 애플은 Lua print message가 보여지지 않거나 internal Corona runtime 에러가 표시되도록 바꾸었습니다. iOS 6 에서는 Xcode Console과 맥 콘솔 앱에 여러분의 iOS 6나 iOS 6 시뮬레이터로부터 더이상 메세지를 받지 않습니다.

iOS 6의 변화로 인해서 저희도 맥 시뮬레이터에 에러와 메세지를 표시하는 방법을 바꾸어야 했습니다. 메세지 앞에 date/time 을 추가하는 메세지를 표시하기 위해 지금은 NSLog를 사용합니다. 이 방법이나 혹은 다른 방법으로 iOS 6 print issue를 해결해야만 합니다. 또한 맥 시뮬레이터 콘솔에 어떻게 정보를 출력할 것인지도 영향을 받을것입니다.  또한 우리의 콘솔과 에러메세지를 이용하는 3rd party 코로나 프로그램도 영향을 받을 겁니다. 이 변화의 잇점으로는 이제 맥 콘솔 앱이 코로나 시뮬레이터와 iOS 시뮬레이터 모두로부터 Corona runtime data를 받는다는 것입니다. (조만간 print 도 가능할 겁니다.) 코로나 시뮬레이터와 빌드 메세지를 보기 위해 터미널 윈도우를 ipen 해야 하는 수고를 안해도 되게 됐죠.

That’s it for today’s questions. I hope you enjoyed it and even learned a few things.

iOS 6, by default

iOS 6 가 beta 버전이었을 때 특별히 iOS 6에 맞춰서 코로나를 빌드하는 법에 대해 말씀 드렸었습니다.

daily build 919 부터 모든 디바이스 빌드들은 자동적으로 iOS 6 에 맞게 빌드 됩니다. 더 이상 target iOS SDK를 select 할 필요가 없습니다. 그 선택기능은 단지 iOS 가 beta 일 경우에만 제공하는 한시적인 기능이었습니다.

iOS 6 용으로 빌드하기 위해서는 여러분의 Xcode를 4.5 GM으로 업그레이드 해야 합니다. (4.5 GM seed 와 혼동하지 마세요.) 오늘부터 애플에서 4.5 GM 을 다운받아서 설치하실 수 있습니다.

Fate of iOS 4.3

당분간은 여러분이 빌드하는 앱들이 iOS 4.3 까지 지원이 되겠지만 곧 iOS 5.1 버전까지로 제한이 될 겁니다. 그 이유로는 두 가지가 있습니다.

우선 이전에 제가 설명드린 적이 있는데요. 애플은 iOS의 오래된 버전에 대한 support는 하지 않습니다. 그러니까 굳이 애플이 지원하지 않는 버전까지 우리들이 고민할 필요는 없습니다.

두번째로는 iOS 4.3 을 사용하는 디바이스들은 iOS 5.1 로 업그레이드 할 수 있습니다.

CoronaBuilder

만약 여러분들 중 자동적으로 최신 build가 적용되는 CoronaBuilder를 사용하시는 분들은 다음 daily build 에 몇가지 조정을 하셔야 합니다.

첫번째로 물론 Xcode 4.5GM 으로 우선 업그레이드 하셔야 합니다.

다음으로는 ‘sdkPath’ param 을 수정하셔야 합니다. 새로운 SDK location으로 point 하도록 말이죠. 이전 버전의 Xcode에는 ‘/Developer’에 인스톨 돼 있었을 겁니다. 새로운 버전의 Xcode 는 일반적으로 ‘/Applications/Xcode.app/Contents/Developer’에 위치해 있을 겁니다.

마지막으로 CoronaBuilder 최신버전을 가지고 있으시다면 아마 iOS 6 Beta seeds 에 맞게 빌드해 보셨을 겁니다. 그런 경우 daily build 919를 시작할 때  ‘platformVersion’ key를 먼저 지우셔야 합니다.

Enterprise, armv7s

Corona Enterprise devs도 마찬가지로 우선 Xcode 4.5 GM 으로 업그레이드 된 상황이라야 되구요. 그 다음에 daily build 919를 사용하시면 됩니다.

기존에 존재하는 Xcode project를 빌드하려고 하시면 아마 linker 에러를 보시게 될 겁니다.

그 이유는 Xcode는 애플의 새로운 A6 Soc를 사용하는 iPhone 5를 지원해야 하기 때문입니다.

이 chip 은 modern ARM cores에 의해 사용되는 old 'armv7'을 지우ㅝㄴ합니다. 또한 armv7s를 지원하고 VFPv4와 a.k.a vector floating point를 지원합니다.

현재 Corona는 armv7s를 지원하고 있지 않습니다. 조만간 지원할 예정입니다. 그동안 여러분의 Xcode project에 약간의 adjustment를 해 주셔야 합니다. 아니면 여러분의 프로젝트를 CoronaSampleApp Xcode project 를 사용해서 처음부터 다시 빌드하셔도 됩니다.

Xcode 4.5 에서 여러분의 Xcode project를 open 하면 아래와 같은 화면을 보실 겁니다.

armv7과 armv7s 두개가 현재 standard 인것이 보일 겁니다.

여러분이 하셔야 할 일 중 가장 핵심적인 일은 디바이스를 위한 build는 오직 armv7 이라는 겁니다. (armv7s 는 없애 주세요.) 그 작업을 하고 난 후 보이는 화면은 아래와 같을 겁니다.

이 셋업의 의미는 여러분이 Xcode에게 디폴트로 계속 standard instruction set를 사용하고 싶다고 얘기하신 겁니다. 하지만 iOS에는 armv7용으로만 build 하라고 하는 behavior를 override 한 것을 추가 한 것이구요. delete키를 누르면 쉽게 제거할 수 있고 또 추가도 쉽습니다.

여러분의 Xcode project 에 직접 adjustment 한다면 왼쪽 pane에서 Tartget 대신 Project를 선택하시는 것을 잊지 마세요.

지난 8월 2일 코로나 Enterprise 버전이 발표 됐었습니다.

그동안 제목만 보고 그냥 지나쳤는데 이 Enterprise 버전이 어떤건지 한번 살펴 보겠습니다.

Corona Guidelines: iPhone 5 and iOS6 (Preliminary)

Posted on September 14, 2012. Written by Walter

iPhone 5 (아이폰 5) 는 아마 가장 빨리 많은 양이 팔리는 기기가 될 것 같습니다. 이제 iPhone 5 와 iOS 6 를 대비해서 여러분이 만드는 코로나 앱을 어떻게 준비해야 되는지 알아 봅시다. 가장 큰 부분은 여러분의 코로나 앱을 16:9 의 화면 비율에 맞게 만드셔야 한다는 겁니다. 저희들은 이것을 tall app 이라고 부릅니다. (아이폰 4나 아이폰 4의 전통적인 앱의 화면 비율이 더 짧은 것과 비교해서 그렇게 부릅니다.)

Preparation

첫번째로 해야 될 것은 XCode 4.5 SDK GM seed를 인스톨 해야 됩니다. 애플은 지난 수요일 이것을 공개 했었습니다. 이전 버전의 XCode가 있다면 이 새 버전을 다운 받으세요. 이것이 있어야 IOS App Store에 iOS 6 앱을 submit 할 수 있도록 해 줍니다. 또한 이 Xcode를 깔아야 “iPhone (Retina 4-inch)”, a.k.a. iPhone 5 에 맞는 XCode 시뮬레이터에서 여러분의 앱을 미리 보실 수 있습니다.

Updates to Corona

저희들은 iOS6와 iPhone 5 를 타겟으로 해서 앱을 만들 수 있도록 하는 몇가지 주요한 업데이트를 했습니다. 유료 구매자분들은 이 업데이트 버전을 다운받으실 수 있는데요. daily build 912 버전을 다운 받으시면 됩니다.

daily build 911 부터 디바이스 빌드시 ‘XCode 4.5 GM seed’를 사용할 수 있도록 했습니다. 아래 화면에서와 같이 Build dialog 박스에서 iOS SDK 를 5.1이 아니라 “6.0 GM seed”를 선택하는 것을 잊지 마세요.

다음주초에 애플은 final GM을 릴리즈 할 계획입니다. 그 때 iOS 5 용을 없앨 겁니다. 그 이후의 빌드들은 모두 iOS 6를 타겟으로 하게 될 겁니다.

또한 코로나 시뮬레이터에 iPhone 5 스킨을 추가했습니다. 맥이나 Win 유저 모두 이 스킨을 사용하실 수 있습니다. 여러분이 이 tall app을 만드신다면 이 스킨을 사용하셔야 합니다. 만약에 traditional app을 만드신다면 iPhone 4 스킨을 사용하셔야 되구요.

(Entreprise customers : 엔터프라이즈 데일리 빌드는 다음주 애플이 iOS 6 GM 최종버전을 발표한 이후 업데이트 할 예정입니다.)

iPhone 5, Duck Typing, and the Black Bars

여러분 중 애플의 keynote를 보신분이 계시다면 현재 만든 앱들은 iPhone 5에서 letterboxed 되서 보여질 거라는 걸 보셨을 겁니다. i.e. the “black bars”.

이게 정확히 어떻게 보야진다는 걸까요?

저희들이 살펴본 바에 따르면 iPhone 앱이 iPad 에서 작동될때와는 다른현상이 나타납니다. iOS5에 맞게 작업된 현재의 iOS 앱들은 iPhone 에서는 traditional app으로 취급 될 겁니다.

무슨 의미냐 하면 iPhone 5는 그 화면 비율을 320X480 포인트 (640X960 pixels)로 생각할 겁니다. 그러면 어떻게 나타나냐 하면요. status bar 가 black bar 밑에 나타나게 됩니다. 그리고 black bar 지역에서는 rendering이나 touch 등이 먹히지 않을 겁니다.

It’s similar to duck typing:if it walks like a duck, talks like a duck, and acts like a duck, well then by golly it is a duck! This is the sleight of hand, Apple is playing on apps to make it easy on developers. If you want your app to think it’s on the same ol’ traditional iOS device, then just go merrily along.

Supporting “tall” apps

아래에 주의하셔야 할 몇가지 사항을 정리했습니다.

• 반드시 iOS 6.0 GM 로 빌드하셔야 합니다. 애플은 iPhone 5를 iOS5가 아니라 iOS6로 테스트 했습니다.  만약 여러분이 iOS 5로 tall mode를 만드는데 성공을 한다면 아주 운이 좋은 케이스이긴 하지만 애플은 그것을 지원하지 않을 겁니다.  코로나에서 iOS 6를 타겟으로 빌드를 하시면 그 이전 버전의 iOS에도 자동적으로 지원이 되는 앱이 만들어 질 겁니다.
  
  
• XCode simulator 는 tall mode로 play를 시작하면 조금 까다로와 집니다. tall splash image를 없애도 그런 현상이 일어날 겁니다 예를 들어 여러분이 traditional mode로 run 하기를 원해도 그대로 tall mode로 보여질 겁니다. 만약에 tall 모드와 traditional 모드를 바꿔서 보고 싶으시다면 그 앱을 uninstall 하셔야 합니다. 혹은 “Reset Content and Settings…” menu 를 사용해서 시뮬레이터를 reset 하셔야 됩니다. 그리고 clean builds를 할 필요가 있을 겁니다. 예를 들어 여러분의 Mac에 있는 .app bundle의 이전 빌드를 delete 해야 합니다.
  
  
• dispatch 되지 않은 iPhone 5 의 bottom 부분에서 일어나는 began과 ended touch 관련 이슈들을 해결했습니다.
  
  

Coexistence of tall and traditional apps

애플은 애플입니다. 애플은 여러분의 iOS 앱이 iPhone 5에서만이 아니라 모든 iOS 디바이스들을 지원하기를 원할겁니다. 그렇게 하기 위해 여러분에게는 두가지 choice 가 있습니다.

1. Easy:  오직 traditional 스크린만 지원하는 겁니다.이게 가장 손 쉬운 방법이죠. 지금까지 해 왔던 방법이니까요. 그냥 해 왔던 대로 하시면 됩니다.
   
2. Harder: tall과 traditional 스크린 모두를 지원하는 겁니다. 약간 트릭을 사용하셔야 합니다. iPhone 5와 기존의 아이폰 스크린 모두에서 작동하는 앱을 만들려면 거기에 맞는 각각의 UI를 만드셔야 하죠.  기존의 아이폰에서 작동할 때에 표시될 UI를 따로 만드셔야 할 겁니다.
   

Scenario #1 은 쉽습니다, 거기에 따로 설명을 덧붙일 필요는 없을 겁니다.  Scenario #2 은 조금 더 작업을 해야 하죠. 왜냐하면 extra screen 공간에 맞는 디자인을 더 해야 하니까요.

Scenario #2를 따르려면 코로나의 기능을 제대로 알아야 그 기능을 활용해서 좀 더 쉽고 정확하게 작업을 하실 수 있을 겁니다. 저희는 여러분의 앱이 taller screen에서 작동하는지 여부에 대해 감지할 수 있는 새로운 API들을 추가했습니다.

가장 쉽게 체크하는 방법은 아래와 같이 하는 겁니다.

local isTall = ( "iPhone" == system.getInfo( "model" ) ) 
and ( display.pixelHeight > 960 )

이렇게 스크린이 tall 인지 traditional인지 알아낸 다음 거기에 맞게 display 하도록 코딩을 하시면 됩니다. 운이 좋으시다면 이미 여러분이 만든 앱이 긴 화면의 안드로이드 기기에서 제대로 보이도록 만든 이미지가 있을 테고 그러면 그 이미지를 그냥 활용하시면 됩니다. 그렇지 않으면 여러분의 앱을 tall 모드에 맞게 업그레이드하는데 들이는 노력이 필요한지 아닌지를 먼저 생각하실 필요가 있습니다.

* * *

저희 개발자중 한명이 이쪽 바닥을 이렇게 표현을 하더군요. “It’s never a dull moment.”

Amen to that!

FAQ Wednesday: native.newTextField and native.newTextBox Events

Posted on September 12, 2012. Written by Tom Newman

It’s Wednesday and time for another FAQ session. Here are five frequently asked questions (FAQ).

1. Why is the “submitted” event phase missing for native.newTextField on devices but it’s working on the Mac Simulator?

“submitted” phase는 유저가 키보드의 “return” or “done” key 를 눌렀을 때 보내 집니다. 이것은 유저가 텍스트 입력 작업을 끝마치고 해당 정보를 “submitted” 했다는 것을 가리키는 것이죠. 유저가 다른 필드를 클릭해서 포커스가 바뀔 경우는 보내지지 않을 겁니다. build 904 버전 이전에는 맥 시뮬레이터는 항상 “submitted” and “ended” phases 가 같이 보내졌습니다. (submitted key 가 클릭되지 않았을 때도요). build 904 부터 맥 시뮬레이터는 iOS와 Android가 작동되는 것과 비슷하게 작동하게 됐습니다.

2. I’m confused about the “ended” and “submitted” phases for native.newTextFields.

TextField events가 작동하는 과정을 요약해 보겠습니다. 유저가 textfield를 클릭(터치)하면 “began” phase가 보내지고 키보드가 보여집니다. 타이핑이 일어나면 “editing” phase가 발생하죠. return/done button 이 클릭되면 ended” phase 가 보내진 다음에 “submitted” phase가 보내집니다. 만약 유저가 다른 Textfield나 다른 TextBox를 터치했다면 “submitted” phase는 보내지지 않고 “ended” phase만 보내지겠죠.

iOS에서는 number 를 넣을 TextField를 생성했을 경우 return key 가 없는 키보드가 나올 겁니다. 그러니까 유저가 일을 마쳤을 때 누를 버튼을 제공해 줘야 합니다. 키보드를 감추려면 native.setKeyboardFocus를 nil 로 하셔야 됩니다. 이렇게 키보드를 숨길 때 TextField 객체에 대한 “ended” phase 가 생성됩니다.

Note: 위의 상황은 build 904 버전 이후의 맥 시뮬레이터에서만 작동됩니다.

3. What happened to the “submitted” event phase on native.newTextBox?

newTextBox에는 submitted event phase가 없습니다. 이유는 return 키를 누르면 입력한 값이 submit 되는 것이 아니라 다음 줄로 가기 때문이죠. 이전 질문에서 언급됐듯이 유저가 작업이 끝났을 때 누를 수 있는 버튼을 생성하셔야 합니다.

4. When using native.newTextField, how do I hide the keyboard?

native.newTextField or native.newTextBox에서 키보드를 숨기려면 native.setKeyboardFocus 를 nil 로 하시면 됩니다. 역으로 native.setKeyboardFocus를 이용해서 포커스를 줄 수도 있습니다.

5. How can I edit text in the native.newTextBox?

디폴트로 native.newTextBox 는 editable이 아닙니다. object.isEditable = true를 하셔서 edit mode를 enable로 바꾸실 수 있습니다.

That’s it for today’s questions. I hope you enjoyed it and even learned a few things.

웹앱 프로젝트를 하느라고 오랫동안 코로나 개발에서 손 뗐었는데요.

너무 오래 안하다 보니까 그립네요.

써핑하다가 코로나 팁을 공유한 파일이 있어서 정리해 봅니다.

가장 기초적인 기능인 선 그리기 입니다.

일단 코드부터 볼까요?

맨 첫번째 줄은 아이폰에서 status bar를 없애는 코드입니다.

그리고 무엇인가를 그리려면 좌표가 필요하니까 x,y 좌표를 담을 변수를 만들었구요.

그 다음에 line 이라는 배열을 만들었습니다.

여기서 선 그리기는 시작점과 끝점을 찍어서 그 두 점을 연결하는 직선을 만드는게 아니라

손가락이 움직이는대로 따라서 선이 그어지도록 하는거거든요.

그러면 손가락을 따라 계속 선을 그어서 그 촘촘하게 그려진 선들이 결국에는 하나의 선처럼 보이게 하는 겁니다.

그래서 lines[] 라는 배열 만들었습니다.

그리고  p 는 변수에 차례대로 선들을 담기 위한 숫자로 쓰일 변수이구요.

이렇게 변수 선언 한 다음에는 drawALine 이라는 함수가 있는데요.

이 함수 건너뛰고 이벤트 리스너 부터 보겠습니다.

touch 에 반응하도록 했고 drawALine을 call 합니다.

그리고 어떤 객체에 이벤트 리스너를 단 것이 아니라 Runtime에 달았으니까 앱이 시작하면서 끝날 때까지 계속 활성화 되 있게 됩니다.

이제 핵심 부분인 함수를 볼까요?

우선 매개변수로 이벤트를 받습니다.

touch 이벤트에는 began, moved, ended 같은 phase들이 있습니다.

여기서는 began과 moved 라는 phase를 이용합니다.

우선 began 일 때는 그 이벤트가 일어난 지점 즉 손가락으로 터치한 지점의 x,y 좌표를 위에 선언했던 변수에 담습니다.

그리고 손가락이 조금이라도 움직일 때 발생하는 moved 일 때 drawLine을 사용해서 선을 긋죠.

began에서 저장했던 x,y 좌표에서 현재 움직인 지점의 x,y 까지 선을 긋습니다.

이 첫번째 line은 lines[] 배열 첫번째에 담기겠죠.

아마 코로나는 배열이 1부터 시작할 겁니다. PHP나 JAVA는 0부터 시작을 하죠.

그 다음은 이 그려진 선을 꾸미는 부분 입니다.

첫 부분은 width 를 사용해서 선의 두께를 정하구요. 그 다음은 투명도(alpha)를 정합니다.

그리고 setColor로 색을 정하구요.

이렇게 처음에 그려진 선을 다 꾸몄으면 다음 선을 준비하기 위한 작업을 합니다.

뭐냐하면 bx,by 값을 현재의 x,y 값으로 바꾸는거죠.

그러면 현재의 위치가 다음 moved 가 발생했을 때 시작점이 되는겁니다.

(이걸 하지 않으면 처음 touch 했던 부분부터 계속 선이 그어질 겁니다. 한번 해 보세요.)

그 다음에는 첫번째 선이 지정된 배열의 다음에 두번째선을 넣기 위해서 p에 1을 더합니다.

그 밑에는 제가 그냥 p 를 콘솔에 print 한 겁니다.

이렇게 하면 선긋기는 간단하게 끝납니다.

아래는 quinc 라는 친구가 공개한 선에 여러 효과를 줄수 있는 코드들입니다.

우선 width 부터 볼까요?

        lines[p].width=math.random(1, 30) -- Makes for an interesting "backbone" effect
        lines[p].width=12 -- Just a boring old set width
        lines[p].width=-3 -- I've heard of a line with a width of -3!
        lines[p].width=math.abs(event.y/20) -- 3D-ish horizon look

width 부분에 위 예제들을 하나하나 넣어가면서 실행해 보세요.

첫번째는 width가 1에서 30까지 랜덤하게 설정되는 겁니다. quinc 는 이것을 척추 모양을 내는 효과라고 했네요.

12는 일반적인 효과고 -3도 있네요. 이건 어떨까요?

그리고 y 좌표를 20으로 나눠서 그 절대값을 width 로 하는 것도 있네요.

이것도 효과가 어떨지 궁금한데요.

이렇게 수학 공식을 사용하다 보면 아주 좋은 효과들이 나옵니다.

프로그래밍을 하면 할 수록 수학을 배우고 싶은 마음이 마구 생겨납니다.

누가 수학은 배워봤자 사회에서 써 먹을 일이 없다고 그러는지...

이글 보시는 학생분들 계시면 그런 얘기 믿지 마세요.

수학 진짜 필요합니다.

다음은 투명도 효과를 볼까요?

    lines[p].alpha=1 -- Another boring one
    lines[p].alpha=0.5 -- Half strength line
    lines[p].alpha=math.abs((event.y-(1000-event.y))/1000) -- Darker area near the center
    lines[p].alpha=math.abs(event.y/1000) -- Foggy day
    lines[p].alpha=math.abs(event.x/1000) -- Foggy day...to the side?
    lines[p].alpha=(math.random(100, 1000))/1000 -- Random

여러 효과들이 있는데요. 처음에 알파를 1로 설정한 것은 그냥 투명도 없이 진하게 표시하는 겁니다.

0.5는 반쯤 투명하게 하는 거구요. 다음엔 수학공식을 사용해서 여러 효과를 주었네요.

세번째는 호면 중앙으로 올 수록 진해 지는 건가 봅니다.

그 다음은 아래 윗부분으로 갈 수록 연해지는 효과고 그 다음은 좌우로 갈수록 연해지는 효과 입니다.

그 다음은 그냥 랜덤하게 투명도를 주는거네요.

해 봤는데 별 효과는 없습니다. 그냥 무책임한 랜덤일 뿐이네요.

다음은 색 지정부분 입니다.

        --Flat color
        --lines[p]:setColor(255,255,255) -- White
        --lines[p]:setColor(255,255,0) -- Yellow
        --lines[p]:setColor(255,0,0) -- Red
        --lines[p]:setColor(0,255,0) -- Green
        --lines[p]:setColor(0,0,255) -- Blue
        --lines[p]:setColor(255,0,255) -- Purple
       
        --Interesting color effects
        --lines[p]:setColor(math.random(255)) -- Grayscale
        --lines[p]:setColor(math.random(255), math.random(255), math.random(255)) -- Rainbow
        --lines[p]:setColor(event.x/5, event.x-20/5, event.x+20/5) -- Really odd effect...
        --lines[p]:setColor(event.x-event.y, 0, event.x-event.y) -- Pretty cool, works best with slow movement

첫 부분은 그냥 단색으로 흰색,노랑,빨강,초록,파랑,보라 이렇게 선 색이 주어집니다.

그 다음엔 수학 공식을 사용한 효과로 처음엔 흑백화면처럼 라인 색이 나오면서 진해지고 옅어지고의 변화만 있습니다.

그 다음은 랜덤하게 색을 표시하는 거구요. 그 다음엔 진짜 이상한 효과라고 하네요. 한번 해 보세요.

그 다음엔 천천히 움직이면 아주 좋은 효과가 나온다고 합니다.

그 다음에는 아래 for 문도 하나 예제로 주었습니다.

        for i=1, p do
                lines[i].xScale=lines[i].xScale-0.12; lines[i].yScale=lines[i].yScale-0.12
        end

분석해 보니까 선을 그을 때마다 lines[] 배열에 담겨있는 선들의 크기를 조금씩 크게 만드는 거네요.

이것도 괜찮은 효과 입니다.

이 width, alpha, setColor 효과들을 다양하게 조합해 보면 재밌을 거예요.

위 이미지가 그 중 하나입니다.

아래 quinc 가 올린 파일 원본 소개 합니다.

main.lua