Software Development/Tizen

[TIZEN]6. 타이젠_간단한게임 만들기1_프로젝트생성, 화면방향설정

huiyu 2015. 12. 25. 12:45

이제 본격적인 앱을 개발해보도록 하겠습니다.
기억력게임이라는 간단한 게임을 같이 만들어보면서 타이젠 EFL의 기능을 하나씩 익혀보도록 하겠습니다.

1. 프로젝트 생성

 -  앱 개발을 시작하기 위해 우선 프로젝트를 생성합니다.
 - 프로젝트 이름과 패키지 이름을 입력하고 개발할 버전을 선택하고 Finish 선택
 - 생성된 코드는 설명. (http://huiyu.tistory.com/entry/TIZEN3-타이젠-Basic-UI-Application-코드-설명)

 

 

2. App 방향 설정

 -  처음 생성된 프로젝트는 기본적으로 세로모드입니다.
 -
Application의 방향은 GUI생성부분의 window생성부분에서 설정이 가능합니다.

- create_base_gui(appdata_s *ad) 부분의 아래 부분을 보시면, ad->win을 통해 window를 생성하고 있습니다.

1
2
3
/* Window */
ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE);
elm_win_autodel_set(ad->win, EINA_TRUE);
cs

 

 -생성된 아랫부분에 가로모드에 대한 옵션을 추가합니다.

1
2
3
4
5
/* Window */
ad->win = elm_win_util_standard_add(PACKAGE, PACKAGE);
elm_win_autodel_set(ad->win, EINA_TRUE);
//가로모드에 대한 옵션 추가
elm_win_rotation_set(ad->win, 270);
cs

 

 elm_win_rotation_set(ad->win, 0);//세로모드
 elm_win_rotation_set(ad->win, 270);//가로모드

 

- 또한 회전될경우 자동으로 UI가 변경되는 코드가 아래와 같이 추가되어 있습니다.
- 이 코드를 통해 회전되도 앱이 방향에 맞게 변하게 됩니다. 이번 앱의 경우 가로로 고정시킬 것이기 때문에 아래 옵션을 지웁니다.

1
2
3
4
5
if (elm_win_wm_rotation_supported_get(ad->win)) {
    int rots[4= { 090180270 };
    elm_win_wm_rotation_available_rotations_set(ad->win, (const int *)(&rots), 4);
}
 
cs

 

 

이후 앱을 실행시켜 보면, 아래와 같이 실행됩니다.

 

에뮬이 기본적으로 세로로 세팅되어 있어 세로로 나오게 되는데, 화면에서 마우스 우측버튼 > Rotate > Landscape를 선택하면 가로모드로 변경됩니다.

 

 

*저의 경우, 가로로 고정시켜서 앱을 개발하지만 세로모드 가로모드 각각 다르게 UI를 설정하고 싶은 경우에는 미리 설정된 콜백함수에서 UI를 설정해주면 됩니다.

아래와 같이 기본적으로 방향전환에 대한 코드가 생성되어있습니다.

ui_app_orient_changed()함수는 핸드폰 방향이 바뀔 떄마다 자동으로 호출되게 됩니다. 이부분에 가로모드에 대한 Layout을 설정하면 됩니다.

1
2
3
4
5
6
7
8
9
10
11
//main()방향 변경에 대한 함수의 콜백함수 등록
ui_app_add_event_handler(&handlers[APP_EVENT_DEVICE_ORIENTATION_CHANGED], APP_EVENT_DEVICE_ORIENTATION_CHANGED, ui_app_orient_changed, &ad);
 
 
//자동으로 생성된 방향전환 콜백
static void
ui_app_orient_changed(app_event_info_h event_info, void *user_data)
{
    /*APP_EVENT_DEVICE_ORIENTATION_CHANGED*/
    return;
}
cs

 

 


[참고사이트]

https://developer.tizen.org/ko/community/tip-tech/responsive-ui-tizen-native

728x90