티스토리 툴바

Daum
Tistory
로그인
  1. [APP] 크롬 투 폰(Chrome to Phone) : PC에서 보던 웹, 폰에서도 바로 보자! 2012/05/11
  2. [Android] Nexus S, 아이스크림 샌드위치(안드로이드 4.0) 업데이트 2012/05/07
  3. [Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB) 2012/05/06
  4. [XNA] 스프라이트를 이용한 애니메이션 구현 (2) 2012/04/26
  5. AForge.NET FRAMEWORK : 유전알고리즘을 C#으로 2012/03/09
  6. [Android] 이클립스 갈릴레오 버전 시, ADT 업데이트 에러 문제 (2) 2012/01/11
  7. [TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!! 2011/10/09
  8. [XNA] 이미지 로드하고 화면에 출력하기 2011/10/09
  9. [DB] DBMS, Database Management System (DB의 종류) 2011/10/04
  10. [Android] 위치 제공자 : 상황별 '최적 위치 제공자(Best Location Provider)' 선정 테스트 2011/10/02

[APP] 크롬 투 폰(Chrome to Phone) : PC에서 보던 웹, 폰에서도 바로 보자!

from Lunarian/Smart Phone/Device 2012/05/11 19:30


PC에서 보던 걸 폰에서 보고 싶어요


  여러분은 어떤 웹 브라우저를 쓰고 계신가요? 


  저는 금융업무 볼 때나 회사 업무 관련 홈페이지에 접근할 때 외에는 모조리 크롬(Chrome) 웹 브라우저를 사용하고 있습니다. 가볍기도 가볍고, 페이지 로딩 속도가 제일 빠른 것 같더라구요. 물론 다른 웹 브라우저들도 좋은 것들이 많습니다만, 어쨌든 인터넷 익스플로러보다는 훨~~~~~~~~씬 빠른 것이 확실합니다.

  아니면 저를 때리세요. (   ㅡ_ㅡ) =3


  아무튼, 요즘에는 웹 서핑을 하다가 뭔가 볼 거리가 하나라도 있으면, 카톡 그룹 대화방에 들어와있는 친구들에게 링크를 공유해주고 싶을 때가 많아요.  아니면, 한창 웹 페이지를 보고 있는데, 친구들이 불러서 급히 나가야 할때가 있죠.

  근데, 즐겨찾기에 저장하고 나중에 찾아볼려니 귀찮고, 또 막상 나중에 아쉬워서 마저 볼려면 또 검색해서 찾아봐야 하고... 불편하더군요.


  이럴 때 여러분들은 어떻게 하시나요?




웹 페이지의 '테이크 아웃' : 'Chrome to Phone'


  PC와  안드로이드 폰을 쓰시는 분들이라면, '크롬 투 폰(Chrome to Phone)'이라는 어플만 설치하시면 이 모든 것이 간편해집니다. 흐흐. 아, 아이폰 유저들도도 이와 유사한 '사이트 투 폰(Site to Phone)'이라는 어플리케이션을 크롬 웹 브라우저에 설치하시면 이와 유사한 기능을 사용하실 수 있습니다.


  그럼, 이제 크롬 투 폰을 설치해봅시다.


STEP 1. 크롬 웹 브라우저에 '크롬 투 폰' 웹 어플리케이션 설치


  크롬 웹 브라우저의 'Chrome Web Store'나 우측 상단의 [설정 및 관리 - 도구 - 웹 어플리케이션 바로가기]로 접근하여, 'chrome to phone'을 검색해서 설치합니다. 설치가 완료되면, 브라우저 우측 상단에 처음보는 핸드폰 그림이 하나 더 생깁니다. 그러면 웹 브라우저에서의 설치는 완료된 것입니다.






STEP 2. 안드로이드 폰에 '크롬 투 폰' 어플리케이션 설치


  그럼, 이제 스마트 폰에 Chrome to Phone을 설치(혹은 세팅)합니다. Chrome to Phone은 안드로이드 2.2 (프로즌 요거트) 버전 이상에서 기본 탑재되어 있습니다. 이 어플리케이션이 안드로이드 2.2 부터 지원하는 C2DM(Cloud to Direct Messaging)이라는 기능을 이용한 서비스이기 때문이죠.

  설치되어 있는 프로그램 목록을 확인해보시고, 혹시 없으면, 당황하지 마시고 그냥 구글 플레이(Google Play)들어가셔서 새로 다운받으시면 됩니다. ^__^


  어려운 것 하나 없습니다. 설치된 'Chrome to Phone' 어플 실행해서 'Menu버튼-Setting'으로 들어 갑니다.


 계정(Account) 확인하시고, 계정은 폰에 등록된 기본 계정이 자동으로 뜨기 때문에 그냥 바로 넘어가주시면 되고, 'Automatically launch links' 선택하시고 Next!


'Finish'를 눌러주면 설정완료!




STEP 3. PC에서 보던 웹 페이지 폰으로 보내기!


  이제 크롬 투 폰 기능을 사용할 준비가 다 되었습니다. 사용 한번 해볼까요?

  모델 로켓(Model Rocket)을 설계(디자인)할 수 있는 '스페이스 캐드(SpaceCAD)'라는 프로그램의 주문 페이지를 폰으로 보내봅니다. 이 페이지를 띄우고 상태에서 우측 상단의 '크롬 투 폰' 버튼을 한번 클릭!! 콕!


"휴대전화로 전송했습니다."





STEP4. 폰에서 해당 페이지 확인! 테이크 아웃 완료!!


  이제 폰을 그윽~하게 한번 바라봐 줍니다. '자동으로 링크를 띄우기(Automatically launch links)' 설정을 했기 때문에 방금 전송한 웹이 자동으로 스마트폰에 뜹니다~ 짠~




  이렇게 제 폰으로 전송했던 링크는 스마트 폰에서 크롬 투 폰 어플리케이션을 클릭했을 때, 나오는 첫 페이지의 History에서 다시 확인하실 수 있습니다.



  설치도 간단하고 꽤나 유용합니다.


  한번 써 보세요! ^_^

저작자 표시 비영리 변경 금지
Creative Commons License
Creative Commons License

'Lunarian > Smart Phone/Device' 카테고리의 다른 글

[APP] 크롬 투 폰(Chrome to Phone) : PC에서 보던 웹, 폰에서도 바로 보자!  (0) 2012/05/11
[Android] Nexus S, 아이스크림 샌드위치(안드로이드 4.0) 업데이트  (0) 2012/05/07
[Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB)  (0) 2012/05/06
[XNA] 스프라이트를 이용한 애니메이션 구현  (2) 2012/04/26
[XNA] 이미지 로드하고 화면에 출력하기  (0) 2011/10/09
Tag // Android, c2dm, Chrome to Phone, Chrome Web Store, Cloud to Direct Messaging, Model Rocket, PC에서 폰으로, Site to Phone, SpaceCAD, SPACECHILD, Web Application, 구글, 넥서스S, 로켓 디자인, 사이트 투 폰, 스페이스차일드, 안드로이드, 웹 링크 폰으로 전송, 웹 페이지 폰으로 보내기, 크롬 웹 스토어, 크롬 웹 어플리케이션, 크롬 투 폰
받은 트랙백이 없고, 댓글이 없습니다.

[Android] Nexus S, 아이스크림 샌드위치(안드로이드 4.0) 업데이트

from Lunarian/Smart Phone/Device 2012/05/07 00:23


본 포스팅은 구글 레퍼런스 폰 넥서스S(Nexus S)의 운영제체를

안드로이드 2.3에서 안드로이드 4.0으로 업데이트한 내용을 다루고 있습니다.




올 것이 왔구나!! 안드로이드 4.0!!



기다리고 기다리던 안드로이드 4.0 업데이트가 날라왔습니다.

레퍼런스 폰의 특징인 OTA(Over the Air)방식의 업데이트였습니다.

지난 주 금요일, 회사에서 업무를 보고 있었는데,

넥서스S에 평소에는 볼 기회가 거의 없는, 익숙하지 않은 알림(Notification)이 떠 있었습니다.


System update available!!


왔구나 왔어!!

고작 113.6 MB 짜리 업데이트에 사람이 이렇게 설레일 수 있다니!!




Model Number : Nexus S

Android Version : 2.3.4



이제 다시는 보지 못할 내 핸드폰의 OS버전을 다시 한번 확인해주시고~

혹시 모르니까, 이번 기회에 연락처와 중요한 사진들도 백업(back-up)을 한번 해준 뒤, 인스톨 시작!!


예전에도 넥서스S 시스템 업데이트(System Update)를 한번 한적이 있었는데,

그때도 저의 걱정과는 달리, 허무할 정도로 빨리, 그리고 깔끔하게 업데이트가 되었었습니다.

이번에도 그때와 마찬가지로 빨리, 그리고 깔끔하게 업데이트 되었습니다.

역시 '퓨어 구글(Pure Google)'!!



인스톨이 끝나고 처음으로 Nexus S가 4.0 운영체제로 부팅되기를 기다립니다.


SONY | NEX-5N | Normal program | Pattern | 1/60sec | F/4.0 | 0.00 EV | 18.0mm | ISO-2000 | Off Compulsory | 2012:05:05 03:36:09

SONY | NEX-5N | Normal program | Pattern | 1/80sec | F/4.0 | 0.00 EV | 21.0mm | ISO-800 | Off Compulsory | 2012:05:05 03:36:22

SONY | NEX-5N | Normal program | Pattern | 1/60sec | F/4.0 | 0.00 EV | 21.0mm | ISO-640 | Off Compulsory | 2012:05:05 03:36:24


부팅화면 자체가 안드로이드 2.3과는 달라졌습니다.

넥서스S의 부팅화면은 구글의 대표 4색이 4방향으로 뿜어져 나왔다가 다시 원점으로 들어가는 

불꽃놀이 같은 것이었는데요~

안드로이드 4.0의 부팅화면은 뭔가 더 화려하고 활동적인 느낌이네요.


SONY | NEX-5N | Normal program | Pattern | 1/80sec | F/4.5 | 0.00 EV | 44.0mm | ISO-2000 | Off Compulsory | 2012:05:05 03:38:11


신기한 것은 업데이트 후 제일 처음 실행되는 부팅시, 

제가 이전에 깔아놓은 121개 앱에 대해서 최적화 작업을 진행한다는 것이었습니다.

아마도, 기존의 앱을 그대로 사용해도 되는지, 문제는 없는지 체크하는 과정인 것 같습니다.

121개에 대한 확인이었지만, 이 역시 그리 시간이 많이 걸리지는 않았습니다.


업데이트 후 제일 처음 만나는 저 진한 하늘색 글씨체... 깔끔하고 귀여워졌다는 생각이 들었습니다.


SONY | NEX-5N | Normal program | Pattern | 1/60sec | F/4.0 | 0.00 EV | 22.0mm | ISO-1000 | Off Compulsory | 2012:05:05 03:41:13


'Finishing boot.' 이라는 메세지와 함께, 최초 부팅 준비를 끝내고...


SONY | NEX-5N | Normal program | Pattern | 1/60sec | F/4.0 | 0.00 EV | 31.0mm | ISO-800 | Off Compulsory | 2012:05:05 03:41:18


BAM!!!! 드디어 만나게 되었습니다. 안드로이드 4.0 : 아이스크림 샌드위치!!!





Introduing :  Ice Cream Sandwich (Android 4.0.4)






SONY | NEX-5N | Normal program | Pattern | 1/60sec | F/4.0 | 0.00 EV | 18.0mm | ISO-250 | Off Compulsory | 2012:05:05 04:08:26 

  한가지 재밌는 사실은...

  업데이트를 하기 전, 몇 가지 스크린샷을 남겨두기 위해서 이클립스의 안드로이드 개발화면(DDMS)을 켜고, 넥서스S와 PC를 5핀 USB잭으로 연결해 뒀었는데, 기존에 깔아뒀던 USB driver의 작동이 생각보다 훨씬 빨리 이루어지는지 부팅을 시작하자마자 디바이스가 이클립스에서 인식이 된다는 것이었습니다. 그렇지만 다른 명령을 수행할 수 있는 여력이 없는 상태라서 그런지, 스크린샷 명령어는 먹지 않습니다. 스크린 샷 버튼을 눌러도 아무런 화면이 캡춰되지 않았습니다.





안드로이드 2.3.4   vs. 안드로이드 4.0.4


제가 업데이트 전에 찍어줬던 안드로이드 2.3.4 화면입니다.

안드로이드 4.0 업데이트 이후로 어떻게 바뀌었는지 감상해보시죠~ 


안드로이드 OS가 바뀌면서, 메인 테마 컬러가 변했음을 알 수 있습니다.

안드로보이의 색깔인 진한 라임 그린색에서 테마컬러가 진한 하늘색으로 변했는데,

HONEYCOMB의 테마 컬러랑 동일한 것 같습니다.


그 외에도 아이콘 타이틀을 둘러싸고 있던 검정색 투명 풍선이 사라졌고,

아이콘 글자체도 좀더 작고 글자 간격이 좁게 바뀌었습니다.

스크린 샷으로 보면 글자가 작아져 잘 안보일 것 같은데, 실물을 보면 가독성은 오히려 좋아진 느낌입니다.  



업데이트를 진행하면서 임의로 삭제되거나 사라진 앱은 안보이네요.

업데이트 이전 세팅과 동일합니다.



안드로이드 주 검색창이 좀더 얇고 깔끔해졌고, 모든 메인 화면 상단에 자리하고 있습니다.

기존의 검색 위젯은 두껍고 안 예뻐서 삭제해버린 다음, 넥서스S에 달려있는 검색 버튼을 주로 사용하고 있었는데, 이번 것은 아예 배경화면과 동일한 레벨/레이어에 있는 것처럼 보여서 맘에 듭니다.

약간의 변화일 뿐인데도, 배경화면 위에 모든 아이콘들이 떠있는 느낌을 주네요.



제일 하단은 전화걸기, 주소록, 어플리케이션 리스트, 메세지, 인터넷 아이콘들이 자리하고 있고,

바탕화면에 세팅해 놓은 각 아이콘 줄의 높이는 조금씩 낮아진 것 같네요.







설치된 모든 앱을 볼 수 있는 메인 앱 화면입니다.

원래 화면은 스타워즈 영화의 제일 첫 장면, 'A Galaxy far, far away....'처럼, 위 아래로 화면을 스크롤링하며 리스트를 확인하는 형식이었는데, 이제는 한 화면에 딱 앱 20개씩을 보여줍니다.

이전 방식이 보는 재미는 있었지만 앱을 찾기가 어려웠는데, 이 부분은 확실히 개선된 것 같습니다.

다음 페이지를 볼 때의 애니메이션 효과도 포함해서 말이죠.



마지막으로 종료화면입니다. 기존 폰 종료화면보다 확실히 멋져졌군요.

종료 기능 이외에도 핸드폰의 벨소리 모드를 바꿀 수 있는 기능도 추가 되었습니다.





So Far, So Good


  안드로이드 4.0을 넥서스S에 업데이트하고 든 느낌은...

  애니메이션 효과가 상당히 많이 추가가 되어서, 만지는 재미가 늘었다는 것과 그 효과들이 상당히 부드러운 편이라는 것입니다. UI면에서 많은 노력을 한것으로 보이네요.


  특히, 알림(Notification)창에서 각각의 알림을 슬라이드 방식으로 하나씩 하나씩 삭제할 수 있는 제스쳐가 추가 되었고, 홈 버튼을 길게 누르면 뜨는 '최근 사용한 앱(Recent Applications)'화면에서도 동일한 슬라이딩 제스쳐로 아직 일시 정지되어 있는 앱들을 종료시킬 수 있었는데, 이것이 굉장히 인상적이었습니다.


  이번에는 업데이트 이후에 받은 느낌과 가시적인 차이점들에 대해서 다뤄 보았습니다.

  좀더 기능적으로 사용을 해봐야, 이전 OS와의 성능을 비교할 수 있을 것 같습니다만, 아직까지는 만족스럽습니다. 애플이 아이폰 3GS 단말기에 새로운 iOS를 적용해줬을 때, 아이폰 유저들이 그랬던 것 처럼, 갑자기 새폰을 사용하게 된 느낌이 드네요.

  즐거운 한 주가 될 것 같습니다. ^____^







저작자 표시 비영리 변경 금지
Creative Commons License
Creative Commons License

'Lunarian > Smart Phone/Device' 카테고리의 다른 글

[APP] 크롬 투 폰(Chrome to Phone) : PC에서 보던 웹, 폰에서도 바로 보자!  (0) 2012/05/11
[Android] Nexus S, 아이스크림 샌드위치(안드로이드 4.0) 업데이트  (0) 2012/05/07
[Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB)  (0) 2012/05/06
[XNA] 스프라이트를 이용한 애니메이션 구현  (2) 2012/04/26
[XNA] 이미지 로드하고 화면에 출력하기  (0) 2011/10/09
Tag // Icecream Sandwich, ICS, NEXUS S, OTA, 넥서스S, 넥서스S OS 업데이트, 레퍼런스 폰, 아이스크림샌드위치, 안드로이드, 안드로이드 4.0, 안드로이드 OS 업데이트, 진저브레드, 차이점
받은 트랙백이 없고, 댓글이 없습니다.

[Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB)

from Lunarian/Smart Phone/Device 2012/05/06 13:01


이번에는 XBOX360용 'Kinect Sensor'를 PC에 사용하기 위해 필요한 어댑터에 대해서 알아보겠습니다.



'키넥트 센서'를 PC에서 사용하고 싶어요!


  작년 가을, 키넥트 센서(Kinect Sensor)에 대해서 소개한 적이 있습니다.

  콘솔 게임기 XBOX360 용으로 발배된 키넥트 센서는 당시 다른 시판된 게임용 센서보다도 우수한 성능을 보여주었고, 컴퓨터 OS의 명실상부한 최강자, 마이크로소프트의 작품답게, PC에 활용하기 위한 어플리케이션인 'Kinect for Windows SDK beta' 또한 출시가 된 상태였습니다.


[Kinect] 최고의 모션인식 센서, Kinect Sensor (How I Met the XBOX360 & Kinect Sensor)


  올해 2월 1일에는 Windows용 'Kinect Sensor'인, 'Kinect for Windows'와 정식 개발툴인 'Kinect for Windows SDK v.1.1 '이 출시되어, Kinect 센서를 PC에서 이용하기가 한결 편해졌습니다.


Kinect for Windows 홈페이지




  그러나, 아무래도 개발을 위해서 별도로 'Kinect for Windows'를 구입한 사람보다는, 기존에 XBOX360용으로 '키넥트 센서'를 사서 이용하다가, Windows에 이용해보려고 하는 사람이 훨씬 많을 것으로 예상합니다. 


  실제로, 제 블로그를 찾아오는 주요 유입 검색어 중, 기존 센서를 PC에서 이용하기 위한 방법이나 USB연결을 하기 위한 젠더를 찾는 경우가 많습니다.



  그래서 이번에는 간단하게 기존의 XBOX360용 'Kinect Sensor'를 PC에 사용하기 위해서 필요한 USB 젠더(혹은 어댑터)에 대해서 알아보겠습니다.





그래서 뭐가 필요한데?


  아래가 PC에 'Kinect Sensor'를 사용하기 위해 필요한, USB포트가 있는 AC 어댑터(AC Adapter)입니다.

google | Nexus S | Aperture priority | Center-weighted average | 1/14sec | F/2.6 | 0/0EV | 3.4mm | ISO-100 | Flash did not fire | 2011:09:15 20:02:43


google | Nexus S | Aperture priority | Center-weighted average | 1/12sec | F/2.6 | 0/0EV | 3.4mm | ISO-200 | Flash did not fire | 2011:09:15 20:04:02


  XBOX360용 키넥트 센서를 XBOX360 본체와 연결하는 주황색 부분을 보면, USB처럼 생겼지만 일반적인 USB 타입이 아닌 것을 알 수 있습니다. 그래서 이 부분을 연결해서 일반적인 USB 포트에 맞는 형태로 전환해주는 젠더가 필요합니다. 위 사진에서 오른쪽 두개의 주황색 부분을 연결하고, 제일 왼쪽의 USB 포트를 PC에 연결해 주는 거죠.


  단, 여러분들이 사용하시는 대부분의 USB 제품들은 USB포트가 제공해주는 전력만으로도 구동이 가능한 경우가 많았지만, 키넥트 센서는 일반적인 USB 포트가 제공해줄 수 있는 전력보다 더 많은 전력을 안정적으로 공급받아야 합니다. 따라서, AC 어댑터가 필요합니다.


  최종적으로 연결해야 하는 부분과 순서는 다음과 같습니다.


SONY | NEX-5N | Normal program | Pattern | 1/60sec | F/4.0 | 0.00 EV | 32.0mm | ISO-1600 | Off Compulsory | 2012:05:02 06:09:20

참~ 쉽죠잉?

서로 서로 맞는 모양을 찾아서 꽂아주면 끝~





그래서 어댑터는 어디서 구하는데?


'PC 연결용 키넥트 센서 AC 어댑터'는 '마이크로소프트 스토어(Microsoft Store)'나 '아마존(Amazon)'에서 정품을 구입할 수 있습니다. 언제나, 늘~ 그랬듯이 아마존이 더 싸네요. 마이크로소프트 키넥트 홈페이지에서 제품을 구입할 수 있는 곳이라며 링크를 걸어놓은 두 곳인데, 왜 가격이 다른건지. 흐흐흐 


AC 포트가?? 다르다...!!?

그리고 오른쪽 상단의 United States에 주목합시다

'대한민국'으로 바꾸면, XBOX Accessories 카테고리는 싹~ 사라집니다




'Kinect Accessories'로 검색하는 것이 좋습니다.

다양한 제조사에서 만들고 있고, 가격도 천차만별이니 꼭 확인해보고 삽시다!



  미국 발매 제품을 바로 살 경우에는 AC 어댑터의 날이 다른데, 미국 발매 키넥트 센서의 정격전압이 다음과 같으므로, 흔히 말하는 '돼지코(젠더)'만 사서 이용하셔도 이용하시는데, 문제는 없을 것 같습니다.


[ Kinect Standalone Version(US) Power Supply ]

- Input 100-240V ~0.3A, 47-63Hz

- Output 12V 1.08A




  물론, 우리나라의 G마켓이나, 옥션, 11번가에서도 판매를 하고 있습니다만, 물건이 자꾸 생겼다가 없어졌다가를 반복하네요~ 그리고 가격도 셀러마다 천차만별인 경우가 있는 것 같습니다. 잘 살펴보고 사시길 빕니다.


  한가지 팁을 드리자면, 키넥트 USB 젠더, 키넥트 PC보다는, '키넥트 악세사리(Kinect Accessories)'나 '키넥트 AC 어댑터', '키넥트 Power Supply' 등으로 검색하시는 것이 좋습니다. 대부분의 관련 제품들이 USB 연결보다는, 별도로 사용하기 위한 전력 공급 기능에 초점을 맞춰서 제품명이나 판매명을 택하고 있네요.


참고로 2012년 5월 6일 현재, 우리나라 쇼핑몰에서 직접 판매하는 셀러는 없고, 해외배송 관련 상품만 검색이 되네요. 가끔씩 제품이 들어오기도 하니, 자주 살펴보시면 좋은 결과 있으실 겁니다 ^__^;;


[옥션] XBOX360 키넥트 어댑터 정품 / 키넥트 전원 어댑터 (45,000~60,000원)

         >> 저는 예전에 17,000원 정도에 샀던걸로 기억하는데요 =_=

              마이크로소프트 정품 가격을 보면 저 정도 하는게 뭐 더 비슷하긴 합니다만은..




그럼 행운을 빌어요~ ^___^)/





저작자 표시 비영리 변경 금지
Creative Commons License
Creative Commons License

'Lunarian > Smart Phone/Device' 카테고리의 다른 글

[APP] 크롬 투 폰(Chrome to Phone) : PC에서 보던 웹, 폰에서도 바로 보자!  (0) 2012/05/11
[Android] Nexus S, 아이스크림 샌드위치(안드로이드 4.0) 업데이트  (0) 2012/05/07
[Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB)  (0) 2012/05/06
[XNA] 스프라이트를 이용한 애니메이션 구현  (2) 2012/04/26
[XNA] 이미지 로드하고 화면에 출력하기  (0) 2011/10/09
Tag // AC Adapter, Kinect, kinect accessories, kinect for windows, kinect for XBOX360, kinect PC, kinect sensor, kinect usb, Power Supply, 키넥트, 키넥트 PC 연결하는 법, 키넥트 센서, 키넥트 센서 PC연결, 키넥트 악세사리, 키넥트 어댑터
받은 트랙백이 없고, 댓글이 없습니다.

[XNA] 스프라이트를 이용한 애니메이션 구현

from Lunarian/Smart Phone/Device 2012/04/26 23:16

이전 XNA 관련 글 보기


더보기




Sprite-based Animation


  단일 이미지의 단순 화면 출력을 해봤으니, 이번에는 여러 장의 이미지를 연속으로 보여줌으로써 연속된 동작처럼 보이게 하는 스프라이트 애니메이션(Sprite-based Animation)을 시도해보겠습니다.


  스프라이트(sprite)는 연속된 이미지의 변화로 캐릭터 등에 애니메이션 효과를 나타낼 때 사용합니다. 

  2D 아케이드 게임 속에 등장하는 캐릭터 동작의 대부분은 스프라이트 애니메이션입니다.


  XNA에는 감히! 스프라이트 처리를 위해 준비된 별도의 클래스가 없기 때문에 스프라이트 처리르 위한 클래스를 직접 만들어야 된다고 합니다.(What!!? -_- )


  당연히, 한번만 쓰고 끝낼 기능이 아니기 때문에 별도의 클래스를 제작해둬야겠네요.

  아무튼 시키는대로 해봅니다.



  이번 프로젝트는 크게 아래와 같이 3개의 클래스와 불러들일 이미지들로 구성됩니다.

  





Program.cs  

프로그램 구동시 제일 먼저 불려와서 게임을 Run을 시킵니다.


Game1.cs

게임 화면의 크기, 배경색을 비롯한 게임 전반적인 환경 설정 및 초기 이니셜라이즈(Initialize() 함수)를 시킵니다. 실제적인 게임 진행에 필요한 것들을 정의하고, 이번 포스팅에서 사용하고자 하는 이미지를 로드(LoadContent())하고, 그리기 명령(Draw())을 포함하고 있습니다.


Sprite.cs

앞서 말했듯이, XNA 자체에서는 스프라이트 효과를 주는 함수가 지원되지 않기 때문에, sprite()함수를 별도로 만들고, Game1.cs에서 Upload된 컨텐츠(이미지)를 연속해서 불러서 그리는 Draw() 함수를 정의 해 둡니다.





Sprite.cs 코딩


  Sprite.cs 함수에 들어가 있는 핵심 내용은, 이미지 정보(이미지 텍스처의 개수, 테스처의 가로, 세로 크기)를 불러와서, i 번째 이미지를 출력하는 것입니다.


[ Sprite.cs 코드 보기 ]


더보기




  i.ToString("D4")는 숫자 i를 00XX 형식의 문자열로 바꿔주는 역할을 합니다.

  이런 변환이 필요한 이유는 Game1.cs에서 이미지를 불러올 때, 파일명이 비행0001, 비행0002, ...., 비행0015 이렇게 되어 있기 때문입니다. 읽어들이는 이미지 파일의 파일명 형식에 맞춰준 거죠.

  그리고 'Vector2 pt'는 이미지 출력 위치 좌표를 말합니다.

[ i.ToString("D4") 예시 ]

더보기







Game1.cs 코딩

  Game1 클래스에서는 Sprite를 하나 선언하고,

### csharp
Sprite sp = new Sprite();


  Sprite 클래스의 Load() 함수를 이용해서 16장의 비행00XX 이미지들을 로드합니다.

###csharp
sp.Load(Content, "비행", 15); // 16장의 이미지를 로드한다. (비행0000~비행0015)


  그리고 Sprite 클래스의 Draw() 함수를 이용해서 이미지들을 불러와서 출력하는 시간간격과 이미지의 출력 위치, 색깔 등을 정의합니다.

###csharp
sp.Draw(spriteBatch, (int)(gameTime.TotalGameTime.TotalMilliseconds / 50) % sp.Count(), new Vector2(330, 200), Color.White);

  위 코딩에서 TotalMilliseconds / (숫자) 이 부분의 숫자를 바꾸면 이미지를 그리는 시간 간격을 조절할 수 있으므로, 애니메이션 속도를 조절할 수 있습니다. Vector2( , )는 이미지를 출력할 위지(position)을 나타냅니다. 그리고 Color.(White)에서 색깔 부분을 바꾸면 이미지에 지정한 색을 입히게 됩니다.

왼쪽 부터, Color.White / Color.Aqua / Color.Pink




[ Game1.cs 코드 보기 ]

더보기





F5 : Start Debugging

  '안돌아가는 훌륭한 프로그램보다, 돌아가는 조악한 프로그램이 낫다.'라는 말이 있죠.
  아무렇게 코딩해도 좋다는 말은 아니지만, 그래도 역시 디버깅을 했을 때, 에러가 나는 것 보다 돌아가는 걸 보는 게 훨씬 기분 좋습니다. ^__^


  우선, 16장의 이미지를 그대로 다 사용한 경우입니다.
  비행기가 좌우로 반복해서 롤링(Rolling)을 하는데, 이상하게 다시 중심으로 올때, 끊기는 것 같습니다.
  소스로 사용하신 이미지들을 한장씩 보시면, 이미지 첫장과 이미지 마지막장이 거의 동일한 비행기 이미지를 나타내는데, 이때문에 애니메이션이 약간 부자연스러워 보입니다.



이미지 16장을 모두 사용한 경우의 결과



  아래는 제일 마지막 이미지(비행0015)를 삭제하고, 코딩도 15장만 불러들이도록 수정한 결과 화면입니다.

  완전히 만족할 수는 없지만, 그래도 조금 더 낫네요~ ^____^ 

  자연스럽게 연결되는 애니메이션 소스가 중요하다는 것과, 반복문을 돌릴 때, 첫 이미지와 마지막 이미지가 동일하면, 동일한 화면을 두번 그리게 되니까 조심해야 된다는 교훈을 얻었네요~




마지막 이미지를 제외한 15장의 이미지를 사용한 경우의 결과



  시간이 많이 없어 실습이 더디지만, 재밌네요 ^__^

  

  다음은 스프라이트 애니메이션을 구현하는 코드를 다른 이미지 소스에도 계속 사용할 수 있도록,

  스프라이트 매니저 클래스를 만들어 보겠습니다!! 




SPACECHILD_XNA_Proto1.zip




Reference // 톡톡튀는 XNA를 이용한 단계별 슈팅게임 만들기

톡톡튀는 XNA를 이용한 단계별 슈팅게임 만들기
국내도서>컴퓨터/인터넷
저자 : 최창수,서정만
출판 : 도서출판정일 2011.08.25
상세보기


저작자 표시 비영리 변경 금지
Creative Commons License
Creative Commons License

'Lunarian > Smart Phone/Device' 카테고리의 다른 글

[Android] Nexus S, 아이스크림 샌드위치(안드로이드 4.0) 업데이트  (0) 2012/05/07
[Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB)  (0) 2012/05/06
[XNA] 스프라이트를 이용한 애니메이션 구현  (2) 2012/04/26
[XNA] 이미지 로드하고 화면에 출력하기  (0) 2011/10/09
[Android] 위치 제공자 : 상황별 '최적 위치 제공자(Best Location Provider)' 선정 테스트  (0) 2011/10/02
Tag // 2D 게임 애니메이션, animiation, Sprite, XNA, xna sprite class, 게임개발, 게임만들기, 게임제작, 슈팅게임, 스프라이트, 스프라이트 애니메이션, 태그를 입력해 주세요.
받은 트랙백이 없고, 댓글 2개가 달렸습니다.

AForge.NET FRAMEWORK : 유전알고리즘을 C#으로

from Lunarian/IT, Programming 2012/03/09 21:00


AForge.NET Framework

유전 알고리즘(Genetic Algorithm)을 C#으로 구현해보려고 하는데, 3년전이나 지금이나 C#으로 된 유전 알고리즘 코드는 C++ 코드에 비해서 많지 않은 것 같습니다. C#을 지원하는 플랫폼들은 더 많아졌는데 말이죠. 예전에 MATLAB으로 짠 코드를 C#으로 바꿔보려고 했던 기억도 있고 해서, 이번에 다시 검색을 해봤더니, AForge.NET Framework 라는 것이 있네요.



http://www.aforgenet.com/framework/ 



AForge.NET is an open source C# framework designed for developers and researchers in the fields of Computer Vision and Artificial Intelligence - image processing, neural networks, genetic algorithms, fuzzy logic, machine learning, robotics, etc.



  홈페이지 메인의 설명에 따르면, 'AForge.NET은 컴퓨터 비전과 인공지능 분야의 개발자들과 연구자들을 위해 구상된 오픈 소스 C# 프레임워크'라는 군요. 이미지 프로세싱, 뉴럴 네트워크, 유전 알고리즘, 퍼지 로직, 머쉰 러닝, 로보틱스... 어디서 많이 들어본, 그리고 제가 좋아하는 단어들만 다 들어있는 것 같습니다.ㅎㅎ


  본 Framework가 어떻게 응용이 되었나, 쓸만한가 싶어서 검색해보니, AForge.NET Framework를 이용해서 C# 프로그래밍을 하신 분들이 많이 계셨습니다. 아쉽게도 대부분은 영상과 증강현실 쪽으로 많이 적용하셨고, 유전 알고리즘 쪽으로 이용하신 분들은 많지 않은 것 같습니다만... ㅜ_ㅜ


            [ AForge.NET Framework 적용 사례 ]
[C#] Aforge.NET 이용하여 동영상 재생(1) (블루네군 블로그)
[C#] Aforge.NET 이용하여 동영상 재생(2) (블루네군 블로그)
증강현실 - Marker Detection 구현 (<Whatisthat>, 김대욱님 블로그)





다운로드 및 설치 

유용하게 잘 쓰고 있는 것을 알았으니, 어떤 것인지 나도 한번 써보자~
다운로드 및 소스 확인 고고!!





홈페이지에서 DOWNLOAD를 클릭하여 AForge.NET Framework를 다운 받자


  포스팅 현재, AForge.NET Framework 버전은 2.2.4이며, 다운로드 및 설치는 4가지 다운로드 링크 중, 상위 두 가지링크를 통해 진행하실 수 있습니다. 설치는 'Next'신공으로 손쉽게 ^_^*






클릭 들어 간다~ 쭉~쭉~쭉쭉~ 쭉~쭉~쭉쭉~ ㅋㅋㅋ





설치 폴더 내용 확인 

  설치가 무난하게 잘 이뤄졌다면, C드라이브 내부의 'Program Files' 안에 [ AForge.NET ]폴더가 생성되었음을 확인할 수 있을 것입니다. 아래 그림처럼, C:\Program Files\AForge.NET\Framework\Sources 폴더 내부를 살펴보시면, Framework 중에 유전 알고리즘을 다루고 있는 'Genetic'폴더가 있습니다.








  Genetic 폴더를 열어보니, 제법 익숙하고 반가운 단어들이 많이 보이네요~
  Chromosome, Fitness Function, Properties, Selection Algorithm....

  Genetic 솔루션을 실행시켜보겠습니다.




  References에 'AForge'와 'AForge.Math'가 있다는 것을 주목합시다.
  이 파일들은 C:\Program FilesForge.NET\Framework\Release\ 에 있고, 소스 또한 C:\Program Files\AForge.NET\Framework\Sources\Math\ 에 있으니, 내용을 확인해봅시다.

  이로써, AForge.NET Framework의 'Genetic' 부분(유전 알고리즘)을 사용하거나, 소스코드를 들여다 볼 수 있는 준비가 다 되었습니다!!

 
AForge.Genetic.dll : C#코드의 이해와 활용 

  이 프레임워크를 활용하기 위해서는, Framework 설치 이후에, 새 프로젝트 창을 열고, 참조(References)에 AForge.Genetic.dll 을 추가한 다음, 마음껏 함수를 써주시면 되겠습니다.

  다만, 안에 어떤 함수가 있는지를 잘 알고, 또 그 함수가 내부에서 어떻게 처리를 하는지 알아야 자기 입맛에 맞게 쓸 수 있을 것 같습니다. 저도 결국은 제가 짠 코드를 C#으로 변환하는 것이 목적이기 때문에, 본 코드를 그대로 사용하기 보다는, 조금씩 수정해서 사용해야 할 것 같습니다.
  참고로, Visual Studio Team Edition/Professional Edition 사용하고 계신분들은 프로젝트 폴더 위에서 우클릭하셔서 [ View Class Diagram ] 기능을 이용하시면, 좀더 빨리 프로그램 구조를 이해하실 수 있습니다. (클래스 다이어그램이 완벽하게 나오진 않습니다 ㅎㅎ)

  그래도, 대충 훓어보니, 메소드명만 봐도 많은 공을 기울인 작품이라는 생각이 들어요~ 주석도 충실합니다. 유전 알고리즘을 C#으로 구현하고 싶으신 분들께 유익한 코드가 될 것 같습니다. : )
 
 
저작자 표시 비영리 변경 금지
Creative Commons License
Creative Commons License

'Lunarian > IT, Programming' 카테고리의 다른 글

AForge.NET FRAMEWORK : 유전알고리즘을 C#으로  (0) 2012/03/09
[Android] 이클립스 갈릴레오 버전 시, ADT 업데이트 에러 문제  (2) 2012/01/11
[TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!!  (0) 2011/10/09
[DB] DBMS, Database Management System (DB의 종류)  (0) 2011/10/04
꿈 불꽃, Dream Spark를 이용해서 무료로 MS정품 쓰자!  (0) 2011/01/21
Tag // AForge.Genetic.dll, AForge.NET, c#, Computer Vision, Framework, Genetic, 유전알고리즘, 인공지능, 컴퓨터 비전
받은 트랙백이 없고, 댓글이 없습니다.

[Android] 이클립스 갈릴레오 버전 시, ADT 업데이트 에러 문제

from Lunarian/IT, Programming 2012/01/11 21:00


까탈스러운 개발환경, 안드로이드

  Windows 용 안드로이드 개발환경을 구축해보신 분들은 아시겠지만, 대부분의 사람들이 익숙한 one-click installation과는 달리, 다양한 프로그램들의 조합으로 개발환경이 구성되기 때문에 처음 접하시는 분들은 개발환경 설정과정을 많이 낯설어 하십니다.

  Windows OS 상에서의 안드로이드 개발환경은 대략 아래와 같은 순서로 이루어집니다.
(안드로이드 개발환경 설정에 관해서는 이미 많은 포스팅이 있기 때문에 생략하도록 하겠습니다.)

1. Eclipse 다운로드 및 압축해제
2. JDK(Java Development Kit) 다운로드 및 설치
3. 환경변수(시스템) PATH 설정
4. Android SDK 다운로드 및 압축해제
5. Eclipse 상에서 ADT (Android Development Tools) Plug-In 인스톨


  Windows Phone 7의 개발환경이 딱 두번의 인스톨로 끝난다는 것에 비하면 굉장히 까탈스러운 개발환경인 것입니다.



이클립스 버전과 충돌하는 안드로이드 개발툴, ADT

  그런데, 문제는 이렇게 정성스럽게(?) 완료해 둔 개발환경이 그렇게 오래가지 않는다는데 있습니다.
  시간이 흘러, 이클립스 업데이트와 ADT업데이트를  업데이트를 반복하다 보면 다양한 에러 메세지를 보이면서 업데이트나 개발환경이 정상적으로 유지 되지 않는, 소위 안드로이드 개발환경이 "깨지는" 현상이 발생합니다.

  저 같은 경우는, 헬리오스(Helios) 버전의 몇가지 문제 때문에 갈릴레오(Galileo)를 계속 쓰고 있었는데, 이번에 대규모 업데이트를 좀 했더니, 다음과 같은 에러 메세지가 뜨면서 더 이상 진행이 되지 않았습니다.

사무실 PC는 물론이고, 제 개인 PC, 노트북까지 모조리 동일한 증상이 뜨더군요~


Eclipse 갈릴레오(Galileo)버전일 때, ADT 업데이트 시, 에러화면



  상당시간 본 에러를 처리하기 위해서 업데이트 순서나 버전을 바꿔가며 정상화를 시도해보았지만, 모두 허사였습니다. '어떻게 해야할까....?'




  정답은 역시나 구글링에 있었습니다.

  'stackoverflow'에 < Galileo and Android Plugin Error >라는 제목으로 저와 완전히 동일한 현상에 대한 질문이 올라와 있었습니다.
  정답은 정말로 허무하게도 최소한 헬리오스 이상의 이클립스가 있어야 인스톨이 진행이 된다는 것!
  (You need to have at least Eclipse Helios to proceed with the ADT installation.)

 


단 한줄로 설명된 명료한 해결법!
이클립스 버전을 업데이트 하면 된다고 한다.
(출처 : http://stackoverflow.com/questions/8551188/gallieo-and-android-plugin-error)





좀더 쾌적한 개발환경이 제공되기를 기대하면서

  사실, 이클립스 그 자체는 안드로이드 개발을 지원하지 않습니다. 이클립스에 각종 'Plug-In'을 설치하고 세팅을 거쳐야만 안드로이드를 개발할 수 있는 환경이 됩니다. 따라서, 이클립스와 안드로이드 개발 툴(ADT, Android Development Tools)는 독립적으로 개발이 되고 릴리즈 됩니다.
  따라서, 새롭게 릴리즈 되는 안드로이드 개발 툴(ADT)이 모든 이클립스 버전에 호환이 되지 않을 수도 있습니다. 오히려 오픈진영의 특성을 감안할 때, 안드로이드 버전업의 빠른 속도를 오히려 잘 지원하고 있는 편일 수도 있습니다.

  그렇지만, 일반 사용자 입장에서는 한번 세팅한 개발환경은 단순한 업데이트 진행만으로도 유지가 되어줬으면 하는 바람이 있습니다. 적어도 새로운 업데이트나 인스톨을 수행할 때, 버전체크는 하지 않더라도 주요 공지사항을 알림으로라도 알려준다면, 사용자들이 자신에게 해당되지 않는 업데이트를 수행한 이후, 개발환경 복구가 안되서 완전히 새로 개발환경을 구축하는 시간낭비를 줄여주지 않을까 합니다.
  혹자는 안드로이드 개발 홈페이지를 참고하면 된다고 하실 수도 있지만, 그런 것들이 하나의 사용자에 대한 배려 아닐까 싶습니다. 더군다나 이클립스 메인메뉴 상의 <Install New Software>이나 <Android SDK Manager>를 통한 인스톨은 용량에 비해 엄청나게 느린 체감속도를 보여주고 있으니까요~ (새로 환경설정하자면, 업데이트와 ADT 인스톨에만 하루 일과가 날아가기도 합니다.)

  현재에도 안드로이드 생태계는 이미 성공적으로 구축되어 있지만, 앞으로 이런 개발자/사용자 편의 부분에 신경을 더 써준다면 좀 더 쾌적한 개발환경이 되지 않을까합니다.

저작자 표시 비영리 동일 조건 변경 허락
Creative Commons License
Creative Commons License

'Lunarian > IT, Programming' 카테고리의 다른 글

AForge.NET FRAMEWORK : 유전알고리즘을 C#으로  (0) 2012/03/09
[Android] 이클립스 갈릴레오 버전 시, ADT 업데이트 에러 문제  (2) 2012/01/11
[TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!!  (0) 2011/10/09
[DB] DBMS, Database Management System (DB의 종류)  (0) 2011/10/04
꿈 불꽃, Dream Spark를 이용해서 무료로 MS정품 쓰자!  (0) 2011/01/21
Tag // adt, Android Development Tools, error, plug-in error, 안드로이드, 안드로이드 개발 툴, 안드로이드 개발환경, 업데이트, 에러, 이클립스, 충돌
받은 트랙백이 없고, 댓글 2개가 달렸습니다.

[TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!!

from Lunarian/IT, Programming 2011/10/09 23:05

 

Google Syntax Highlighter

  웹서핑을 하시면서 프로그램 코드의 각 구문들이 가독성 좋게 색깔로 표현되어 있는 것을 보신 적 있으실 겁니다.
 이것이 바로 < Google Syntax Highlighter >인데, 코드를 자주 포스팅에 삽입하시는 분들께는 거의 필수입니다.
 저도 적용하는 법을 몰라서 많이 헤매었는데, 생각보다도 훨씬 간단하게 티스토리 블로그에 적용할 수 있는 방법이 있어 포스팅 합니다.

  사실, Syntax Highlighter를 티스토리에 적용하는 방법은 이미 많이 포스팅이 되어있는데요,
  검색을 해보면 대부분의 포스팅이 아래와 같은 순서를 소개하고 있습니다.

[ 기존 설치 & 적용법 ]
1. Syntax Highlighter 최신 버전을 다운
2. 티스토리에 업로드
3. 스킨에 반영

 

 그러나!! HTML/CSS 편집에서 코드 딱! 한줄만 추가하시면,
 이런 번거로운 절차 없이 바로 Google Syntax Highlighter를 적용해서 사용하실 수 있습니다.


초간단! 티스토리 Syntax Highlighter 적용법!!
1.  우선, 티스토리 블로그 관리 화면에서, [ 스킨 >> HTML/CSS 편집 ]으로 갑니다.
2.  [ skin.html ] 에서 </head> 바로 앞 부분에 아래의 코드를 삽입합니다.(저장하고 끝~ -_-)

###js
<script type="text/javascript" src="http://tsyntax.googlecode.com/hg/release/tsyntax.js"></script> 



정말 간단하죠? ㅇ_ㅇ)a

이제부터 본문글 작성하면서 인용구(Ctrl+Q)를 선택하고, 그 안에 해당 언어의 종류를 적습니다.
그리고 보여주고 싶은 코드를 Ctrl+C / Ctrl+V 하고 저장~!
그러면 아래와 같이 구문강조가 된 모습으로 블로그에 저장이 됩니다.

 


이 방법은 띵구리야님의 초보얌 블로그에 정말 깔끔하게 정리되어 있습니다.
저도 제 블로그에 적용시킬 때, 띵구리야님 블로그에서 배웠습니다. ^_^
아래 링크를 참조하세요

< 초보얌 > 블로그 by 띵구리야 님 
 http://choboyam.tistory.com/1

 
 
 

어떻게 이렇게 간단하게 되지?! 

  티스토리에서 이렇게 간단하게 한줄만 코드를 추가해서 쉽게 Syntax Highlighter를 쓸 수 있는 이유는 아래 그림처럼, 미리 단순화 작업을 해뒀기 때문입니다.

http://code.google.com/p/tsyntax/

 

  

티스토리 Syntax Highlighter의 고질적인 문제  

  문제는 티스토리의 게으름(?)으로, 많은 분들이 Syntax Highlighter를 적용시켜서 사용하실 때, 불편을 겪고 있다는 사실입니다. 대표적인 문제로는 코딩을 할 때 엔터 한번이 엔터 두번으로 인식이 된다던지, 코드를 긁어서 붙여넣었을 때 제대로 적용이 안된다는 점들이 있습니다.
 
  저도 역시, 코드를 붙여넣을 때 마다 이런 일이 발생하여 애를 먹었으나, 다행히 이제는 약간의 노하우가 생겼습니다. 

티스토리 Syntax Highlighter 문제해결 꼼수
1. 붙여넣고 싶은 코드를 메모장에 붙여 넣는다.
2. 찾아바꾸기 기능(Ctrl+H)을 이용해, </div>는 </br>로, <div>는 삭제시킨다.



  그러나, 이런 꼼수도 적용시킨 스킨에 따라 안되는 경우도 있습니다. ㅠㅠ
  조금 불편하기는 하지만, 주로 쓰는 C#과 Java 외에도  SQL, Python, PHP 등 지원하는 언어가 많기 때문에 애용하고 있습니다.
  많은 분들이 노력하고 계시므로, 곧 고수님들이 해결법을 내어 놓으실 거라 기대해봅니다. ^_^
 

Creative Commons License
Creative Commons License

'Lunarian > IT, Programming' 카테고리의 다른 글

AForge.NET FRAMEWORK : 유전알고리즘을 C#으로  (0) 2012/03/09
[Android] 이클립스 갈릴레오 버전 시, ADT 업데이트 에러 문제  (2) 2012/01/11
[TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!!  (0) 2011/10/09
[DB] DBMS, Database Management System (DB의 종류)  (0) 2011/10/04
꿈 불꽃, Dream Spark를 이용해서 무료로 MS정품 쓰자!  (0) 2011/01/21
Tag // Code Highlighter, Google, highlighter, syntax, Syntax Highlighter, syntax highlighter 설치, syntax highlighter 적용, Tstory, tsyntax, 간단 설치, 간편 적용, 구글 구문강조, 초간단, 티스토리
트랙백은 하나, 댓글이 없습니다.

[XNA] 이미지 로드하고 화면에 출력하기

from Lunarian/Smart Phone/Device 2011/10/09 19:06




이전 XNA 관련 글 보기

더보기



 XNA의 기본 동작방식을 알아봤으니, 이제는 게임제작의 제일 기본이 되는 화면 출력을 해볼 차례입니다. 
 미리 정해놓은 그림을 화면에 로딩해서 띄워보는 거죠. 가장 기본인 만큼 어렵지는 않습니다.
 

STEP 1. 새로운 XNA 프로젝트 생성하기

STEP 2. 화면에 출력할 그림 Content 프로젝트에 추가하기

STEP 3. 화면 해상도 변경해 보기 (800 x 600)

STEP 4. 변수 선언하고 이미지로드 하기

STEP 5. Starting Debugging(F5)

 


 

STEP 1. 새로운 XNA 프로젝트 생성하기

* 혹시, XNA 프로젝트를 생성하실 줄 모른다거나,
기본 화면에 대해서 이해가 필요하신 분은 이전 포스팅을 참고하세요!

 

 

STEP 2. 화면에 출력할 그림 Content 프로젝트에 추가하기

그림과 같은 resource를 추가하는 방법은 간단합니다.
Visual Studio의 프로젝트 탐색창에서 오른쪽 클릭으로 간단히 추가할 수 있죠.
우선, '로딩.png' 파일을 저장했습니다.


[ Content 프로젝트 Name에 오른쪽 클릭 >> Add >> Existing Item ]


 

XNA 지원 Texture

XNA의 Texture는 기본적으로 < *.png, *tga, *.jpg >를 지원합니다.

다른 것들은 익숙한데, tga는 생소하네요.
검색을 해보니, *tga 포맷은 트루비전 사의 타가보드를 위하여 개발된 그래픽 파일 포맷으로 비디오 게임분야에서 텍스처 및 스크린샷 저장 기능 등을 이용할 때 흔히 사용하는 파일포맷이라고 합니다.

 

* tga 파일 포맷 : TGA(‘TARGA’의 줄임말 / Truevision Advanced Raster Graphics Adapter)

http://ko.wikipedia.org/wiki/TGA

 

 


STEP 3. 화면 해상도 변경해 보기 (800 x 600)

XNA 4.0에서의 기본 해상도는 800 X 480 이라고 합니다.
해상도를 800 x 600 으로 변경해봅니다.
여기서 해당 화면을 전체화면으로 보려면 IsFullScreen 속성을 true로 설정합니다.


 

STEP 4. 변수 선언하고 이미지로드 하기

그림파일은 LoadContent() 함수로 읽어 들이고, Texture2D라는 클래스를 이용하여 이미지를 저장합니다.

Texture2D는 XNA에서 불러들인 2차원 이미지를 저장하는 클래스입니다.

그리고 이미지 출력은 SpriteBatch 클래스의 Draw() 함수로!!
   

 

  

STEP 5. Starting Debugging(F5)

 이제 신나는 디버깅만 남았습니다.


결과화면


  로딩이라는 영문글자가 정확하게 정중앙에 오지 않아서 조금 거슬리기는 하지만, 제법 뭔가 로딩하고 있는 느낌의 글자(사실은 이미지)가 출력되었습니다.
  중요한건, 이 예제 그림의 해상도가 딱 800 x 600이기 때문에, 실행창의 크기를 임의로 변경하게 된다면, 글자 주변의 검은색이 창을 가득 채우지 못하는 상황이 발생합니다.
  단, 전체화면으로 실행했을 때는 예외입니다.


  그러면, 좀더 크기가 작은 그림 파일(XNA logo.jpg)을 출력해보겠습니다.
  기존 코딩에 그림파일만 바꿔서 출력 했다면, 그림은 실행창의 최상단 왼쪽에 붙어서 출력될 것입니다.
  그림파일의 최상단 왼쪽의 기준점을 (0, 0)으로 설정해둬서 그런 것인데요~ 아래 스크린 샷 처럼 화면의 정중앙에 오도록 만들어봅시다! (약간의 시행착오가 필요하겠죠? ^_^ )


  



### csharp
        protected override void Draw(GameTime gameTime)
        {
            GraphicsDevice.Clear(Color.CornflowerBlue);
 
            spriteBatch.Begin(SpriteSortMode.Deferred, BlendState.AlphaBlend);
            spriteBatch.Draw(tex, new Vector2(0, 0), Color.White);
             // 이미지의 좌측 상단 좌표 기준, 이미지의 위치
             // 이 부분을 수정해서 위와 같이 만들어보자!
            spriteBatch.End();
 
            base.Draw(gameTime);
        }




소스코드 
 
### csharp
### Game1.cs
using System;
using System.Collections.Generic;
using System.Linq;
using Microsoft.Xna.Framework;
using Microsoft.Xna.Framework.Audio;
using Microsoft.Xna.Framework.Content;
using Microsoft.Xna.Framework.GamerServices;
using Microsoft.Xna.Framework.Graphics;
using Microsoft.Xna.Framework.Input;
using Microsoft.Xna.Framework.Media;


namespace Proto0
{
    /// <summary>
    /// This is the main type for your game
    /// </summary>
    public class Game1 : Microsoft.Xna.Framework.Game
    {
        GraphicsDeviceManager graphics;
        SpriteBatch spriteBatch;
        Texture2D tex;
        // 변수 선언


        public Game1()
        {
            graphics = new GraphicsDeviceManager(this);
            Content.RootDirectory = "Content";
            graphics.PreferredBackBufferHeight = 600;
            graphics.PreferredBackBufferWidth = 800;
            //this.graphics.IsFullScreen = true;
            // 전체화면 활성화
        }


        /// <summary>
        /// Allows the game to perform any initialization it needs to before starting to run.
        /// This is where it can query for any required services and load any non-graphic
        /// related content.  Calling base.Initialize will enumerate through any components
        /// and initialize them as well.
        /// </summary>
        protected override void Initialize()
        {
            // TODO: Add your initialization logic here


            base.Initialize();
        }


        /// <summary>
        /// LoadContent will be called once per game and is the place to load
        /// all of your content.
        /// </summary>
        protected override void LoadContent()
        {
            // Create a new SpriteBatch, which can be used to draw textures.
            spriteBatch = new SpriteBatch(GraphicsDevice);


            tex = Content.Load<Texture2D>("로딩");
            // TODO: use this.Content to load your game content here
        }


        /// <summary>
        /// UnloadContent will be called once per game and is the place to unload
        /// all content.
        /// </summary>
        protected override void UnloadContent()
        {
            // TODO: Unload any non ContentManager content here
        }


        /// <summary>
        /// Allows the game to run logic such as updating the world,
        /// checking for collisions, gathering input, and playing audio.
        /// </summary>
        /// <param name="gameTime">Provides a snapshot of timing values.</param>
        protected override void Update(GameTime gameTime)
        {
            // Allows the game to exit
            if (GamePad.GetState(PlayerIndex.One).Buttons.Back == ButtonState.Pressed)
                this.Exit();


            // TODO: Add your update logic here


            base.Update(gameTime);
        }


        /// <summary>
        /// This is called when the game should draw itself.
        /// </summary>
        /// <param name="gameTime">Provides a snapshot of timing values.</param>
        protected override void Draw(GameTime gameTime)
        {
            GraphicsDevice.Clear(Color.CornflowerBlue);


            spriteBatch.Begin(SpriteSortMode.Deferred, BlendState.AlphaBlend);
            spriteBatch.Draw(tex, new Vector2(0, 0), Color.White);
            // 이미지의 좌측 상단 좌표 기준, 이미지의 위치
            spriteBatch.End();
            // TODO: Add your drawing code here


            base.Draw(gameTime);
        }
    }
} 


 

SPACECHILD_XNA_Proto0.zip



/* Reference */
톡톡튀는 XNA를 이용한 단계별 슈팅게임 만들기
 
톡톡튀는 XNA를 이용한 단계별 슈팅게임 만들기
국내도서>컴퓨터/인터넷
저자 : 최창수,서정만
출판 : 도서출판정일 2011.08.25
상세보기




Creative Commons License
Creative Commons License

'Lunarian > Smart Phone/Device' 카테고리의 다른 글

[Kinect] PC연결을 위한 'Kinect for XBOX360' USB어댑터(AC Adapter/Power Supply/USB)  (0) 2012/05/06
[XNA] 스프라이트를 이용한 애니메이션 구현  (2) 2012/04/26
[XNA] 이미지 로드하고 화면에 출력하기  (0) 2011/10/09
[Android] 위치 제공자 : 상황별 '최적 위치 제공자(Best Location Provider)' 선정 테스트  (0) 2011/10/02
[XNA] XNA 기본 함수 6가지와 동작원리  (4) 2011/10/01
Tag // Texture2D, XNA, XNA 개발, XNA 해상도, XNA 화면, 게임만들기, 그림 출력, 이미지 로드, 이미지 출력, 해상도 변경
받은 트랙백이 없고, 댓글이 없습니다.

[DB] DBMS, Database Management System (DB의 종류)

from Lunarian/IT, Programming 2011/10/04 23:57


널, 잘 모르겠어... DB..

DB는 무엇일까요?
DBMS는 무엇일까요?
오라클 DB는 무엇이고, MS-SQL은 무엇이고, MySQL은 무엇일까요?

이것은 모두 다 저에게 하는 질문입니다.


그동안 '디비, 디비, 디비'...
말은 많이 들었지만, 데이터베이스를 따로 공부한적이 없었기 때문에
도무지 명확하게 개념이 잡히지 않았습니다.

무엇보다도 프로그램을 하면서 DB가 필요한 상황이 올때마다 혼란스러웠던 것은 바로 이것이었습니다.

'DB이름도 종류도 뭔가 많은 거 같긴한데...'
'뭔가 다른건가?'
'다르니까 다른 이름을 쓰고 있겠지?'
'그냥 운영체제를 골라쓰듯 선택의 문제일까? 아니면, 각각의 특징을 알고 상황에 따라 맞춰써야 하는 것일까?'


그냥 나무부터 배워도 되는데, 숲을 먼저 보지 못하면 좀 답답하고
항상 숲을 먼저 가르쳐줄 스승을 찾는 성격 탓에
또 작은 업무를 진행하기 전에 큰 숲을 보여줄 자료들을 찾아볼 수 밖에 없었습니다.

그러다 발견한 주옥같은 글!!
이 글을 읽고 많은 부분에 대해 개념을 정립할 수 있었습니다.


DBMS(Database Management System)
안젤리나죠리퐁 님의 <나는 할 수 있다 >블로그




DB는 데이터들의 묶음!
눈에 보이지 않아!

저를 비롯해서 많은 분들을 헷갈리게 하는 이유는
DB, Database가 원래의 의미인 데이터들의 집합, 데이터들의 묶음으로써의 의미 뿐만 아니라,
이런 데이터를 다루는 툴이나 시스템 전체를 일컫는 경우가 많기 때문입니다.
 
개념적인 정의인 'Database'는 눈에 보이지 않습니다.
이러한 데이터들의 묶음을 정의하고, 추출하고, 보여주고, 관리할 수 있게 해주는 툴이 있는데
이런 툴들을 < DBMS, Database Management System >라고 합니다.
말 그대로 데이터베이스 관리 시스템(프로그램)이죠.

이 데이터베이스 관리 시스템에 해당하는 것이 바로 ORACLE, MS-SQL, MySQL 등이고,
이것이 일반적으로 사람들이 DB의 종류라고 생각하는 것이 되겠습니다.

Database (DB)  =  Database Management System (DBMS)

이제는 '데이터베이스(DB)'와 '데이터베이스를 관리하는 프로그램(DBMS)'을 동일 수준에서 보고, 많은 분들께서 혼재해서 사용하고 있는 것 같습니다. 저도 이번 공부 전에는 마찬가지였구요. 아마도 데이터베이스나 데이터가 눈으로 볼 수 없는 것이기 때문에 관리하는 프로그램을 거의 DB와 동일시 하는 것 같습니다.
 

 
DBMS 언어의 종류


DBMS는 앞서 언급했듯이, 엄밀히 말해서 언어입니다.
DB에 접근하고 관리하는 언어죠.

수 많은 DBMS중에서 대표적으로 많이 사용하는 것으로는
ORACLE, MS-SQL, MySQL 등이 있고, SQLite도 최근 모바일 데이터베이스로 각광받고 있습니다.
ORACLE은 기업체에서 많이 이용하고 있고 전 세계적으로도 가장 많은 수요자 층을 확보하고 있습니다.
MS-SQL 또한, 많이 사용되고 있으나, MS Windows OS 계열에서만 사용가능하다는 단점이 있습니다.

각각의 특징은 아래 글을 참조하세요.

웹 서비스에 사용될 수 있는 DB의 종류와 특징
네이버 오픈백과



더 넓은 세상을 위해 Database가 필요해....
 



게시물이 도움이 되셨다면~ 추천을 꾹~ 눌러주세요!
댓글도 물론 환영합니다!!
저작자 표시 비영리 변경 금지
Creative Commons License
Creative Commons License

'Lunarian > IT, Programming' 카테고리의 다른 글

[Android] 이클립스 갈릴레오 버전 시, ADT 업데이트 에러 문제  (2) 2012/01/11
[TSYNTAX] 초간편! 티스토리 Syntax Highlighter 적용하기!!  (0) 2011/10/09
[DB] DBMS, Database Management System (DB의 종류)  (0) 2011/10/04
꿈 불꽃, Dream Spark를 이용해서 무료로 MS정품 쓰자!  (0) 2011/01/21
오프라인에서 블로그 글쓰기 : MS Windows Live Writer 2011  (0) 2011/01/03
Tag // db, dbms, MS-SQL, MySQL, Oracle, SQL, SQLite, 데이터베이스, 데이터베이스 관리, 데이터베이스 관리 프로그램
받은 트랙백이 없고, 댓글이 없습니다.

[Android] 위치 제공자 : 상황별 '최적 위치 제공자(Best Location Provider)' 선정 테스트

from Lunarian/Smart Phone/Device 2011/10/02 04:14


"나는 네가 어디에 있는지를 알고 있다"



안드로이드에서 말하는 '위치 제공자'란?


  스마트폰 어플 중 많은 어플들이 위치 기반 서비스(LBS, Location Based Service)를 포함하고 있습니다.

  어떤 단말기를 쓰던지, 어떤 운영체제를 쓰던지간에 위치 기반 서비스를 이용하기 위해서는 위치 정보가 필요하고, 또 이러한 위치 정보는 위치에 대한 정보를 제공하는 ‘누군가’가 필요합니다. 이때, 이 '누군가'가 바로 위치 제공자(Location Provider)입니다.

  위치 제공자는 'GPS 모듈'처럼 같이 단말기에 부착된 하드웨어 일 수도 있고, 무선 네트워크나 전화 기지국과 같이 불특정 다수가 이용할 수 있는 기간시설이나 구조물일 수도 있습니다. 위치를 제공해줄 수 있는 기술이 더 는다면 이 위치 제공자도 늘어나게 되겠죠~
 

  어찌 되었든, ‘안드로이드 OS를 탑재한 단말기’에는 기본적으로 하나 이상의 위치 제공자가 존재합니다.

  따라서, 우리가 안드로이드 단말기에서 '구글 맵(Google Map)'과 같은 위치 기반 서비스를 이용할 때, 우리 눈에 보이지는 않지만 단말기 내부에서는, 그 상황에서의 위치를 제공해주는 위치 제공자가 어떤 것들이 있는지를 확인하고, 미리 설정해둔 기준들을 토대로 최적의 위치 제공자를 선택해서 위치 정보를 공급받는 과정을 거칩니다.

  < 안드로이드 프로그래밍 정복>에서 언급한 바와 같이, 최적의 위치 제공자를 판별하는데 이용되는 기준에는 여러가지가 있는데, 안드로이드 OS에서 그 각각의 기준들에 대해 얼마나 가중치를 주고 있는지는 아직 잘 모르겠습니다.

  위치 제공자 목록은 위치 관리자(Location Manager)에 의해서 관리됩니다.






내 폰의 '위치 제공자' 확인하기
  

  그럼 이제.......

-  내 폰에 위치를 제공해줄 수 있는 위치 제공자는 어떤 것들이 있는지,
-  그 중에 최적의 제공자는 무엇인지,
-  지금 쓸 수는 있는건지 

한번 확인해 봅시다. ^_^

  아래는 안드로이드 단말기(Nexus S, Android 2.3.4)의 위치 제공자와 최적 위치 제공자, 그리고 각 위치 제공자의 사용 가능성에 대해서 조사하고 출력하도록한 소스코드와 결과입니다. 소스코드는 < 안드로이드 프로그래밍 정복 : 위치 제공자 >의 내용을 참고하였고 원문 코드와 비교해보면 알겠지만, 이용가능 여부 판별에서 'passive'에 대한 코드를 추가했습니다.

  실내와 실외, GPS on/off 여부에 따라 4가지 Case로 나누어 테스트하였습니다.
  

소스코드

package exam.andexam;


import java.util.List;


import android.app.Activity;

import android.content.Context;

import android.location.Criteria;

import android.location.LocationManager;

import android.os.Bundle;

import android.widget.TextView;


public class C24_GetProvider extends Activity {

public void onCreate(Bundle savedInstanceState) {

super.onCreate(savedInstanceState);

setContentView(R.layout.c24_getprovider);


// 위치 관리자 구함

LocationManager LocMan = (LocationManager) getSystemService(Context.LOCATION_SERVICE);


// 제공자 목록 구해서 출력

List<String> arProvider = LocMan.getProviders(false);

String result = "";

for (int i = 0; i < arProvider.size(); i++) {

result += ("Provider " + i + " : " + arProvider.get(i) + "\n");

}


// 최적의 제공자 조사

Criteria crit = new Criteria();

crit.setAccuracy(Criteria.NO_REQUIREMENT);

crit.setPowerRequirement(Criteria.NO_REQUIREMENT);

crit.setAltitudeRequired(false);

crit.setCostAllowed(false);

String best = LocMan.getBestProvider(crit, true);

result += ("\nbest provider : " + best + "\n\n");


// GPS와 네트워크 제공자 사용 가능성 조사

result += LocationManager.GPS_PROVIDER + " : "

+ LocMan.isProviderEnabled(LocationManager.GPS_PROVIDER) + "\n";

result += LocationManager.NETWORK_PROVIDER + " : "

+ LocMan.isProviderEnabled(LocationManager.NETWORK_PROVIDER)

+ "\n";

result += LocationManager.PASSIVE_PROVIDER + " : "

+ LocMan.isProviderEnabled(LocationManager.PASSIVE_PROVIDER)

+ "\n";


// 결과 출력

TextView EditResult = (TextView) findViewById(R.id.result);

EditResult.setText(result);

}

}



Android 위치 제공자 목록
  - network : 통신망, 3G
  - passive : passive provider. 
                  다른 앱에서 사용한 위치 정보를 수동적으로 가져올 수 있다는 의미
                  (http://android-developers.blogspot.com/2011/06/deep-dive-into-location.html)
  - GPS : GPS





Case1 : 실내, GPS On 



Best Provider : NETWORK




Case2 : 실내, GPS Off
 

 
Best Provider : NETWORK

  
 

Case3 : 실외, GPS On



Best Provider : NETWORK




Case4 : 실외, GPS Off


Best Provider : NETWORK
 

  테스트를 진행하면 알게된 한가지 중요한 사실은,  [ 위치 제공자 사용 가능 여부 ] 판별에서 GPS는 GPS 신호 송수신 여부와 관계없이 장치의 On/Off 여부에 따라 true/false가 변경된다는 것입니다. 즉, GPS 위치 제공자를 사용할 수 있다는 신호가 들어와도 그것이 GPS 신호의 성공적인 수신을 보장해주지 못한다는 이야기이므로, 코딩할 때 유의해야 할 것 같습니다.




테스트 결과와 의문점 


상황별 Best Location Provider Test 결과





  테스트 결과는 다소 기이하게 나왔습니다.
  모든 상황에서 'NETWORK'가 최적의 위치 제공자로 판별된 것입니다.

  아무리 많은 통신기지국이 주변에 있고 그것들을 이용해 위치 계측 정밀도를 높인다하더라도 GPS 신호만큼 정밀할까요? 아마도 아닐 것입니다.


  그렇다면!? 아마도 최적 위치 제공자를 판별하는 기준으로 선언해 놓은 4가지 항목들이 적절치 않았을 수도 있겠죠. 소스 코딩 중에 최적 위치 제공자를 판별하는 기준 선언 부분을 연구해서 적절히 고쳐줄 수 있다면, 결과값은 우리가 일반적으로 예상하는 대로 달라질 수 있을 것 같습니다.

  다음에는 기준을 추가하거나 기준 설정을 수정해보고 결과를 비교해보도록 하겠습니다.



본 포스팅이 도움이 되셨다면, 추천/댓글을 달아주세요!! (^ㅁ^)/


저작자 표시 비영리 동일 조건 변경 허락
Creative Commons License
Creative Commons License

'Lunarian > Smart Phone/Device' 카테고리의 다른 글

[XNA] 스프라이트를 이용한 애니메이션 구현  (2) 2012/04/26
[XNA] 이미지 로드하고 화면에 출력하기  (0) 2011/10/09
[Android] 위치 제공자 : 상황별 '최적 위치 제공자(Best Location Provider)' 선정 테스트  (0) 2011/10/02
[XNA] XNA 기본 함수 6가지와 동작원리  (4) 2011/10/01
[Kinect] 최고의 모션인식 센서, Kinect Sensor (How I Met the XBOX360 & Kinect Sensor)  (4) 2011/09/16
Tag // Best Location Provider, case별, Location Provider, passive provider, 상황별, 안드로이드, 위치기반서비스, 위치제공자, 위치제공자 확인하기, 최적 위치 제공자
받은 트랙백이 없고, 댓글이 없습니다.
<< previous 1 2 3 4 5 next >>