이제 본격적인 앱을 개발해보도록 하겠습니다.
기억력게임이라는 간단한 게임을 같이 만들어보면서 타이젠 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] = { 0, 90, 180, 270 };
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
'Software Development > Tizen' 카테고리의 다른 글
[TIZEN]8. 타이젠_간단한게임 만들기2_레이아웃 구성 (0) | 2015.12.25 |
---|---|
[TIZEN]7. 타이젠 Layout 설명 (0) | 2015.12.25 |
[TIZEN]5. 타이젠 Gear(기어) App 개발(Native) (0) | 2015.12.25 |
[TIZEN]4. 타이젠 EFL이란? (0) | 2015.12.21 |
[TIZEN]3. 타이젠 Basic UI Application 코드 설명 (0) | 2015.12.19 |