Nexacro

[Nexacro] 프로젝트 생성 및 기능 설명

로니콜먼 2020. 8. 30. 23:29

File > New > Project 클릭

프로젝트명과 파일저장 위치 설정

사용할 Frame을 설정한다. Desktop or Tablet 지정하고 Next

다음은 어플리케이션 Frame 유형을 선택한다.

하나의 브라우저에서 프레임을 어떻게 분할해서 사용할지를 선택하는 창

Details Setting 탭에서 프레임에 대한 상세설정도 할 수 있다.

Finish를 선택하면 프로젝트 생성 완료

이제부터 Hello를 띄워볼 예정이다.

넥사크로 플랫폼에서는 실행되는 화면을 폼이라고 부르며

폼은 xfdl 확장자로 생성되는 XML파일이다.

 

File > New > Form 선택해서 폼을 생성하거나

메뉴상단에 New 아이콘을 클릭해서 폼을 생성한다.

이름, 위치, 크기에 대한 설정을 해준다

- Name : 폼의 이름

- Location : 저장 위치

- Layout : 크기 설정

 

생성되는 컴포넌트의 크기와 좌표는 기본단위를 설정한다.

(크기는 퍼센트 또는 픽셀 단위로 설정 가능)

 

기본값을 유지하고 Finish 버튼을 눌러 화면 생성을 완료한다.

 

상단의 컴포넌트 툴바에서 컴포넌트를 선택하고

화면의 원하는 위치에 드로잉하여 컴포넌트를 생성한다.

 

Properties창의 네번째 버튼 클릭하여 이벤트 설정할 수 있다.

이벤트 탭 밑에는 발생 가능한 이벤트 목록이 보인다.

 

이벤트의 설정법은 두가지가 있다.

1. 기본 함수명으로 설정하는 방법

onclick 이벤트의 오른쪽 빈 영역을 더블클릭하면

"컴포넌트아이디_이벤트명" 형식으로 자바스크립트 함수를 생성한다.

2. 사용자 함수명으로 설정하는 방법

빈 영역에 원하는 함수명을 입력한 후 엔터를 적용한다.

생성한 함수에 스크립트를 작성한다.

넥사크로 플랫폼은 작성된 소스 코드를 자바스크립트 코드로 변환

즉, Generate 하는 과정이 필요하다.

 

Generate는 화면을 생성, 수정 후 저장하는 시점에 자동으로 처리한다.

Generate Path는 메뉴의 툴 옵션에 프로젝트의 Generate에서 확인할 수 있다.

Tools > Options > Project > Generate

( * Generate Path 경로를 이클립스 프로젝트의 webapp 경로로 설정해주면 이클립스 프로젝트와 연동됨 )

해당 Generate Path를 복사해서 폴더에 붙여넣기 한다.

여기서 Base 폴더로 이동한다.

생성된 Hello 파일 확인 가능

생성한 Hello 화면의 Generate된 파일의 결과를 Quickview를 실행하여 확인해보자

 

<Quickview 실행 방법>

상단 툴바의 QuickView 아이콘을 클릭하거나

Ctrl + F6을 누르면 된다.

저장할 파일을 선택하고 Yes 클릭

QuickView의 옵션을 선택할 수 있는 창이 나온다

- Nexacro Emulator는 데스크탑 외의 모바일 등 

다른 스크린에서 실행되는 결과를 확인할 때 사용한다.

[ Nexacro Emulator (x86) ]

 

- Nexacro Browser넥사크로 브라우저 32비트, 64비트에서 실행되는

화면을 확인할 때 사용

[ Nexacro Runtime Enviroment (x86), Nexacro Runtime Enviroment (x64) ]

 

- Web Browser는 로컬 PC에 설치 되어있는 웹브라우저를 통해 결과를 확인한다.

결과를 확인하고 싶은 웹브라우저 선택 후, 실행

[ Internet Explorer, Microsoft Edge, Chrome ]

 

<Project Explorer 탭 기능>

Project Explorer > Environment

 - Environment : 실행 환경 정보를 가지고 있는 설정 파일로 더블클릭 또는 마우스 우클릭 Edit메뉴를 통하여 편집

어플리케이션에서 사용하는 ScreenInfo, Variables, Cookies 등을 설정하며

여러개의 어플리케이션으로 구성 시 각각의 애플리케이션에서 공유하여 사용할 수 있습니다.

 

Enviroment의 기능들은 다음과 같다

  • ScrennInfo : 어플리케이션에서 다양한 디바이스에서 동일하게 실행 할 경우 스크린 정보를 추가해서 사용
  • Variables : 어플리케이션과 화면에서 공통으로 사용할 변수를 지정
  • Cookies : 브라우저에 쿠키로 처리될 변수들을 선언

<Variables, Cookies 스크립트 사용 방식>

쿠키 스크립트 사용방식과 Variable 사용 방식은 동일하다.

// Variable 값 반환
var sValue = nexacro.getEnvironmentVariable("Env_Var1");

// Variable 추가
nexacro.setEnvironmentVariable("Env_Var1", "nexcro platform");

// Variable 제거
nexacro.removeEnvironmentVariable("Env_Var1");

Project Expolrer > Script

- Script : Environment에서 공통으로 정의하는 스크립트 또는

여러개의 애플리케이션에서 같이 사용할 스크립트를 작성한다.

<스크립트의 작성>
this.Env_Script = function()
{
	return "Env Script Call";
}

<스크립트로 접근>
//Environment Object를 이용하여 접근
var objEnv = nexacro.getEnvironment()
objEnv.Env_Script();

Project Explorer > TypeDefinition > Objects

- Object : Module 정보와 Module에 정의되어 있는 오브젝트를 관리한다.

Module의 하위에는 json파일에 정의되어 있는 Object의 목록이 나타나며

오른쪽 창에 이미 등록 되어있는 Object는 체크박스로 표현이 된다.

 

Project Explorer > TypeDefinition > Services

- Services : 화면, 스크립트, 서버 경로 등을 설정하여 사용하며 

지정하는 Type에 따라 서비스에 표시 되는 파일 타입이 제한된다.

Base 서비스가 기본으로 생성되며, 프로젝트 생성 시 프레임 구조를 선택한 경우

FrameBase라는 서비스에 프레임이 들어갈 Form까지 자동으로 생성된다.

 

Project Explorer > TypeDefinition > ProtocolAdaptors

- ProtocolAdaptors : 기본 HTTP 프로토콜을 사용해 요청과 응답 처리

Project Explorer > Application Information > Application Variables

- Application Variables : 애플리케이션과 화면에서 공통으로 사용하며

여러개의 애플리케이션으로 구성한 경우 애플리케이션별 공유가 불가능하다.

  • [ Datasets ] : 2차원 테이블 형태로 데이터를 관리하는 오브젝트이며 애플리케이션에서 전역적으로 사용하는 2차원 테이블 데이터를 관리한다. 접근 방법은 다음과 같다.
//Application Object를 이용하여 접근
var objApp = nexacro.getApplication();
objApp.Dataset().getRowCount();
--------------------------------------
var objApp = nexacro.getApplication();
objApp.gv_name;

Project Explorer > Application Information > Applications > Application_Desktop

- Scripts : Applications의 Script를 호출하여 테스트할 경우 Launch Project로 실행하여야 한다.

단일 화면을 실행하는 Quick View로 테스트 할 경우 동작되지 않는다