App Builder에서 앱을 빌드하기 위한 기본 단위는 "App"입니다. 새로운 앱을 빌드하기 위해서는 "App"을 생성해야 하며 생성된 "App"을 수정하거나 삭제할 수 있습니다. "App" 설정에 따라 Android, iOS, macOS 앱을 빌드하고 배포할 수 있습니다.
메뉴[BuildApp > App List] 항목에서 [New] 버튼을 클릭하면 새로운 "App"을 생성할 수 있는 창이 나타납니다.
앱 기본 설정값 입력하기
정보를 입력하고 [Save] 또는 [Build] 버튼을 클릭하기 전에는 "App"이 생성되지 않습니다.
항목 | 설명 | |
|---|---|---|
1 | Basic Property | 빌드할 앱 기본 정보와 빌드 시 필요한 설정을 지정합니다. |
2 | Nexacro Library | 넥사크로 라이브러리를 지정합니다. |
3 | Target OS | 앱을 배포할 대상 운영체제를 선택하고 빌드 시 필요한 설정을 지정합니다. |
Basic Property
항목 | 설명 | |
|---|---|---|
1 | Project Name | 앱 프로젝트 이름을 입력합니다. |
2 | Package Name | Package 이름을 입력합니다. |
3 | App Title | 빌드할 앱 이름을 입력합니다. |
4 | Project URL | 넥사크로 앱이 배포된 URL을 입력합니다. URL 입력 시 마지막 슬래시 표기는 생략합니다. |
Package Name은 빌드한 앱을 구별하는 식별자입니다. 일반적으로 도메인 주소를 반대로 기재한 형태로 Package Name을 지정합니다.
예) com.nexacro
Package Name을 하나의 단어로만 입력하는 경우에는 빌드 시 오류가 발생할 수 있습니다.
Target OS에 iOS가 포함된 경우에는 Provisioning Profile 발급 요청시 입력한 Package 명과 같은 값으로 Package Name을 입력하여야 합니다.
Nexacro Library
항목 | 설명 | |
|---|---|---|
Nexacro Library | 넥사크로 라이브러리를 선택합니다. 앱 개발 시 사용한 넥사크로와 같은 버전의 라이브러리를 선택해야 합니다. |
[+] 버튼을 클릭하고 새로운 라이브러리를 추가할 수 있습니다.
항목 | 설명 | |
|---|---|---|
1 | Name | 라이브러리 이름을 입력합니다. |
2 | Version | 라이브러리 버전을 입력합니다. |
3 | Owner | 소유자 정보를 표시합니다. |
4 | Nexacro Framework File | 배포되는 nexacrolib.zip 파일을 업로드합니다. 업로드한 항목은 마우스로 클릭 시 파일을 내려받을 수 있습니다. |
5 | Version | 업로드한 Nexacro Framework File 버전입니다. Nexacro Framework File에 포함된 JSON 파일에서 버전 정보를 확인하고 표시합니다. |
6 | Library File | 라이브러리 파일을 업로드합니다. 예) Android : nexacroN_Android_2021xxxx_1.zip iOS : nexacroN_iOS_2021xxxx_1.zip macOS : nexacroN_macOS_2021xxxx_1.zip 업로드한 항목은 마우스로 클릭 시 파일을 내려받을 수 있습니다.
|
7 | Description | 라이브러리에 대한 설명을 입력합니다. |
Target OS
앱을 빌드할 대상 운영체제를 선택합니다. 선택한 운영체제에 대한 세부 설정을 지정할 수 있습니다. 넥사크로 스튜디오가 아니라 관리 콘솔에서 직접 리소스를 업로드하는 경우에는 선택한 운영체제에 맞는 start_(os_name).json 파일을 등록하면 [Nexacro application resource] 항목에 필요한 리소스 목록을 출력하고 리소스 파일을 업로드할 수 있습니다.
[detail] 버튼을 클릭하면 json 파일 내용을 표 형태로 보여줍니다.
[Upload Histroy] 버튼을 클릭하면 리소스 파일 등을 업로드한 이력을 확인할 수 있습니다.
macOS에서 Siging Info 정보를 "none" 항목으로 선택한 경우 Signing Info를 포함하지 않고 앱 빌드를 처리합니다. 빌드는 정상적으로 동작하지만 앱 설치 후 실행 시 보안 관련 설정을 변경해주어야 합니다.
Signing 정보를 선택하거나 새로 등록할 수 있습니다. Sing Name 항목 옆에 [+] 버튼을 클릭하면 Target OS에 따라 정보를 입력할 수 있습니다.
추가 옵션 설정하기
기본 설정값만 입력하면 앱 빌드 작업까지 진행할 수 있습니다. 각 항목별로 추가적인 옵션을 설정하려면 항목 오른쪽 아래에 있는 [Option +] 버튼을 클릭하고 옵션 항목을 펼친 후에 설정할 수 있습니다.
Basic Property Options
항목 | 설명 | |
|---|---|---|
1 | Version | 빌드할 앱 버전을 입력합니다. |
2 | Build Mode | 빌드 모드를 선택합니다. "debug" 모드 선택 시 ADB(Android Debug Bridge)를 통한 디버깅 작업을 수행할 수 있습니다. |
3 | Detail Error Message | 앱 로딩 중 발생하는 오류 메시지를 사용자에게 노출할지 설정 |
4 | Deploy | 디플로이 서버와 서버 경로를 선택하거나 추가합니다. Auto Deploy: 항목 선택 시 빌드 후 바로 디플로이 서버에 배포할 수 있습니다. [Deploy] 버튼 클릭 시 지정한 서버에 리소스를 배포합니다. [History] 버튼 클릭 시 디플로이 이력을 확인할 수 있습니다. [+] 버튼 클릭 시 새로운 디플로이 서버 정보를 추가할 수 있습니다. |
5 | Owner | "App" 소유자를 지정합니다. (로그인 계정으로 자동 입력됩니다). |
6 | Access | "App" 사용 권한을 지정합니다. 사용 권한에 따라 [App List]에 표시되는 목록이 달라집니다. - share: 지정된 사용자만 사용할 수 있습니다. - public: 모든 사용자가 사용할 수 있습니다. - private: Owner만 사용할 수 있습니다. |
Target OS > Android Options
항목 | 설명 | |
|---|---|---|
1 | Import / Export | 생성된 "App" 정보를 안드로이드 스튜디오에서 편집할 수 있는 프로젝트 형태로 내보내거나 안드로이드 스튜디오에서 편집한 내용을 가져올 수 있습니다. |
2 | Icon Image File | 앱 아이콘 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. 여러 이미지 파일을 압축한 후 하나의 압축파일(zip 파일)로 등록하거나 개별 파일을 등록할 수 있습니다. |
3 | Splash Image File | 앱 실행 시 표시되는 Splash 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. 여러 이미지 파일을 압축한 후 하나의 압축파일(zip 파일)로 등록하거나 개별 파일을 등록할 수 있습니다. |
4 | Splash Scale Type | Splash 이미지 크기를 설정합니다. 아래 4가지 옵션 중 하나를 선택할 수 있습니다. - Adjust the aspect ratio. stretch to fit the screen size : 화면 비율 조정. 화면 크기에 맞게 stretch 처리 - Maintain the aspect ratio. expand without blank area : 화면 비율 유지. 빈 영역 없이 확장 처리 - Maintain the aspect ratio. expand to fit : 화면 비율 유지. 크기에 맞게 확장 - Original size : 원본 이미지 크기 |
5 | Splash Background color | Splash 영역 배경 색상을 지정합니다. |
6 | Rotation | 앱에서 화면을 세로(Portrait) 또는 가로(Landscape) 로 고정시키거나 고정을 풀고 센서를 활성화(Sensor) 하는 옵션을 선택합니다. |
7 | Signing Detail | 선택한 Signing 상세 정보를 보여줍니다. |
8 | User Library | User Library를 추가할 수 있습니다. |
9 | Device API | 디바이스 API 권한을 추가할 수 있습니다. |
Icon 이미지와 Splash 이미지 항목 옆에 [detail] 버튼을 클릭하면 설정한 이미지 목록을 확인할 수 있습니다.
압축파일로 등록하는 경우에는 압축파일 내 폴더와 파일명을 아래와 같이 작성해야 합니다.
ic_launcher.png: 아이콘 이미지 파일
splashimage_phone_landscape.png: 가로 방향 Splash 이미지 파일
splashimage_phone_portrait.png: 세로 방향 Splash 이미지 파일
폴더명과 파일명이 틀릴 경우 정상 빌드가 되지 않거나 앱 실행 중 정상적으로 동작하지 않을 수 있습니다.
Directory | file name | Image Size(px) |
|---|---|---|
drawable-hdpi | ic_launcher.png | 72x72 |
splashimage_phone_landscape.png | 화면에 맞게 | |
splashimage_phone_portrait.png | ||
drawable-ldpi | ic_launcher.png | 36x36 |
splashimage_phone_landscape.png | ||
splashimage_phone_portrait.png | ||
drawable-mdpi | ic_launcher.png | 48x48 |
splashimage_phone_landscape.png | ||
splashimage_phone_portrait.png | ||
drawable-xhdpi | ic_launcher.png | 96x96 |
splashimage_phone_landscape.png | ||
splashimage_phone_portrait.png | ||
drawable-xxhdpi | ic_launcher.png | 144x144 |
splashimage_phone_landscape.png | ||
splashimage_phone_portrait.png | ||
drawable-xxxhdpi | ic_launcher.png | 192x192 |
splashimage_phone_landscape.png | ||
splashimage_phone_portrait.png |
Device API 권한 추가
넥사크로 디바이스 API 권한을 선택합니다. [+] 버튼을 클릭하면 전체 디바이스 API 목록이 표시되며 필요한 권한을 선택한 후 [OK] 버튼을 클릭합니다.
Map, X-PUSH를 사용하는 경우에는 추가로 키값을 입력해주어야 합니다. X-PUSH 권한 지정 시에는 Firebase Android 구성 파일(google-services.json)을 첨부해주어야 합니다.
Target OS > iOS Options
항목 | 설명 | |
|---|---|---|
1 | Import / Export | 생성된 "App" 정보를 XCode에서 편집할 수 있는 프로젝트 형태로 내보내거나 XCode에서 편집한 내용을 가져올 수 있습니다. |
2 | Icon Image File | 앱 아이콘 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. 여러 이미지 파일을 압축한 후 하나의 압축파일(zip 파일)로 등록하거나 개별 파일을 등록할 수 있습니다. |
3 | Splash Image File | 앱 실행 시 표시되는 Splash 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. 여러 이미지 파일을 압축한 후 하나의 압축파일(zip 파일)로 등록하거나 개별 파일을 등록할 수 있습니다. |
4 | Splash Scale Type | Splash 이미지 크기를 설정합니다. 아래 4가지 옵션 중 하나를 선택할 수 있습니다. - Adjust the aspect ratio. stretch to fit the screen size : 화면 비율 조정. 화면 크기에 맞게 stretch 처리 - Maintain the aspect ratio. expand without blank area : 화면 비율 유지. 빈 영역 없이 확장 처리 - Maintain the aspect ratio. expand to fit : 화면 비율 유지. 크기에 맞게 확장 - Original size : 원본 이미지 크기 |
5 | Splash Background color | Splash 영역 배경 색상을 지정합니다. |
6 | Rotation | 앱에서 화면을 세로(Portrait) 또는 가로(Landscape) 로 고정시키거나 고정을 풀고 센서를 활성화(Sensor) 하는 옵션을 선택합니다. |
7 | Signing Detail | 선택한 Signing 상세 정보를 보여줍니다. |
8 | User Library | User Library를 추가할 수 있습니다. |
Icon 이미지와 Splash 이미지 항목 옆에 [detail] 버튼을 클릭하면 설정한 이미지 목록을 확인할 수 있습니다.
아이콘, Splash 파일명은 아래와 같이 작성해야 합니다.
file name | Image Size(px) | 설명 |
|---|---|---|
Icon.png | 57x57 | Home screen on iPhone/iPod touch (iOS 6.1 and earlier) |
Icon@2x.png | 114x114 | Home screen on iPhone/iPod Touch with retina display (iOS 6.1 and earlier) |
[크기].png | 57X57 (57.png) 76X76 (76.png)120x120 (120.png) 152X152 (152.png) 167X167 (167.png) | |
splashimage_pad_landscape.png | 1024x768 | Pad 가로 방향 Splash 이미지 파일 |
splashimage_pad_portrait.png | 768x1024 | Pad 세로 방향 Splash 이미지 파일 |
splashimage_phone_landscape.png | 960x640 | Phone 가로 방향 Splash 이미지 파일 |
splashimage_phone_portrait.png | 640x960 | Phone 세로 방향 Splash 이미지 파일 |
splashimgae_phone5_landscape.png | 1136x640 | Phone 가로 방향 Splash 이미지 파일 |
splashimgae_phone5_portrait.png | 640x1136 | Phone 세로 방향 Splash 이미지 파일 |
Target OS > macOS Options
항목 | 설명 | |
|---|---|---|
1 | Import / Export | 생성된 "App" 정보를 XCode에서 편집할 수 있는 프로젝트 형태로 내보내거나 XCode에서 편집한 내용을 가져올 수 있습니다. |
2 | Icon Image File | 앱 아이콘 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. 파일 확장자는 .icns 입니다. |
3 | Splash Image File | 앱 실행 시 표시되는 Splash 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. |
4 | Dmg Image File | 앱 설치 시 표시되는 이미지 파일을 등록합니다. 별도로 파일을 지정하지 않으면 넥사크로 기본 이미지가 적용됩니다. |
5 | Signing Detail | 선택한 Signing 상세 정보를 보여줍니다. |
Icon, Splash, Dmg 이미지 항목 옆에 [detail] 버튼을 클릭하면 설정한 이미지 목록을 확인할 수 있습니다.
Dmg Image File에 등록한 이미지 파일의 DPI가 72X72가 아닌 경우 Mac OS 10.7 이상에서 배경이 왜곡되어 보여질 수 있습니다.
Target OS > Icon Generate를 사용해 이미지 파일 생성하기
이미지 파일 설정 화면 옆에 [Icon Generate] 버튼을 클릭하면 Icon Generator 화면이 실행됩니다. 생성할 이미지 Type을 선택하고 이미지 파일을 업로드한 후 [Generate] 버튼을 클릭하면 선택한 Target OS에 따라 압축파일을 생성합니다. 생성한 파일은 내려받아 업로드해서 이미지를 설정할 수 있습니다.
업로드하는 Image 파일은 png 확장자만 지원합니다.
Target OS > 프로젝트 파일 내보내고 가져오기
App Builder에서 지원하지 못하는 기능을 필요로 하는 경우 생성된 "App" 정보를 프로젝트 형태로 내보내 각 운영체제를 지원하는 개발도구에서 필요한 기능을 추가하거나 편집할 수 있습니다. [Project Modification] 기능을 사용하면 현재 "App" 정보를 압축 파일 형태로 내보내거나 외부 개발도구에서 수정한 프로젝트를 가져올 수 있습니다.
항목 | 설명 | |
|---|---|---|
1 | Export | 현재 "App" 프로젝트를 압축파일로 내보냅니다. |
2 | Import | 현재 "App" 프로젝트에 사용자가 수정한 프로젝트를 가져옵니다. |
3 | Revert | App Builder에 저장된 데이터로 원복합니다. |
[Import] 버튼 클릭 시에는 두 가지 옵션 중 하나를 선택할 수 있습니다. 버튼 클릭 시 아래 그림처럼 옵션을 선택할 수 있는 창이 표시되며 [YES], [NO] 버튼 선택에 따라 수정한 프로젝트를 가져오는 방식을 결정합니다.
항목 | 설명 | |
|---|---|---|
1 | YES | 사용자가 수정한 후 Import 한 프로젝트의 설정을 유지합니다. - 프로젝트의 각 플랫폼 별 설정화면의 상태를 비활성화 합니다. - 공통 설정 항목은 수정 가능하나 해당 플랫폼은 적용하지 않습니다. |
2 | NO | 사용자가 수정한 후 Import 한 프로젝트의 설정을 유지 하지 않습니다. - 프로젝트의 각 플랫폼 별 설정 화면의 상태를 활성화 합니다. - Import 된 프로젝트에 AppBuilder 콘솔화면에 명시된 설정을 덮어쓰고 빌드합니다. |
Target OS > User Library
Android, iOS 운영체제에서 사용할 수 있는 User Library를 선택하거나 새로 등록할 수 있습니다. Options 화면에서 User Library 항목 옆에 있는 [+| 버튼을 클릭하면 목록을 선택할 수 있는 창이 표시되고 원하는 라이브러리 항목을 체크한 후 [Add] 버튼을 클릭합니다.
새로 라이브러리를 추가해야 한다면 [New] 버튼을 클릭해서 새로운 항목을 등록할 수 있습니다.
앱 빌드하기
새로 "App"을 생성한 경우에는 [Build]라는 버튼이 표시됩니다. 버튼을 클릭하면 선택한 운영체제에 해당하는 앱 빌드를 시작합니다.
빌드 결과를 표시하며 빌드를 성공한 경우에는 생성된 앱을 내려받을 수 있는 링크를 생성합니다. [Rebuild All] 버튼을 클릭해 전체 앱을 다시 빌드하거나 운영체제마다 따로 빌드할 수 있는 기능도 지원합니다.
항목 | 설명 | |
|---|---|---|
1 | 다운로드 | 생성된 앱 설치 파일을 내려받습니다. |
2 | QRCode | 생성된 앱 설치 파일을 내려받을 수 있는 URL, QRCode를 표시합니다. |
3 | rebuild | 선택된 운영체제 앱을 다시 빌드합니다. |
4 | build Log | 앱 빌드 시 생성된 로그를 확인할 수 있습니다. |
5 | Last Build Time | 마지막으로 앱을 빌드한 시간을 표시합니다. |
설치 파일명은 아래와 같이 생성됩니다. "App Title", "Build mode" 정보는 [App Info] 항목에서 설정합니다.
Android: [App Title]-[Build mode].apk, [App Title]-[Build mode].aab
iOS, macOS: [App Title].ipa
예) sample-debug.apk, sample.ipa
모바일 디바이스에는 "App Title" 정보에 지정한 이름으로 설치됩니다.
QRCode 기능을 제공하는 앱을 사용하는 경우 QRCode를 인식한 후 URL을 Chrome 브라우저에서 처리하는 과정에서 "downloadFile.do" 또는 "downloadFile.htm"으로 주소창에 표시되고 파일을 내려받지 못하는 경우가 있습니다. 이런 경우에는 아래와 같이 조치합니다.
- Chrome 브라우저 캐시 삭제
- Chrome 브라우저를 최신 버전으로 업데이트
아래와 같은 경우는 QR코드를 지원하지 않습니다.
macOS
iOS Provisioning profile type이 "app-store"인 경우
Android App Bundle(.aab) 파일