넥사크로17(Nexacro 17) 독학 공부하기. 4- 컴포넌트(Button) 생성하기

2023.07.05 - [Study/Tip] - 넥사크로17(Nexacro 17) 독학 공부하기. 3- Form 생성하기

넥사크로17(Nexacro 17) 독학 공부하기. 3- Form 생성하기

이제 화면을 구성할 Form을 생성했으니 화면에 출력해줄 Component를 생성해주는 시간이다.

먼저 버튼을 생성해보자.

 

이곳에서 각종 요소들을 추가해줄수 있다.

 

만약 저 아이콘들의 리스트가 보이지않는다면, 오른쪽에 빈 공간에 마우스 우클릭을 해보자. 그럼 메뉴가 활성화 되는데

메뉴에서 컴포넌트 체크를 하면 리스트가 생길것이다.

 

컴포넌트를 체크해주면 컴포넌트 바가 생성되고, 컴포넌트와 같이 사용하기 좋은게 바로 Align(정렬)이다.

지금 화면을 보면 컴포넌트바 위에 정렬바가 생성된것을 볼수 있다.

 

반응형

 

컴포넌트바에서 Button을 클릭하여 form에서 클릭해보면 Default 사이즈로 버튼이 생성된다.

동일한 방법으로 Button을 클릭후에 form에서 드래그로 버튼을 생성하면 드래그 한 만큼의 사이즈 조절된 버튼이 생성된다.

 

 

이렇게 버튼을 생성할수있다.

 

다음은 생성된 버튼의 Text를 변경하려고 한다. 먼저 Button00이라는 버튼Text를 Hello라고 변경해보자.

방법은 총 3가지라고 소개해주셨는데 그중에서 가장 많이 쓰일거같은 2가지만 소개하겠다.

 

첫번째는 변경할 버튼을 마우스로 클릭한번 한후, F2를 누르는것이다. F2는 여러 툴에서도 사용되는 RENAME 단축키이다.

 

두번째는 변경할 버튼을 선택하고 우측에 Properties에 보면 text라는 탭이 있다. 거기에서도 변경이 가능하다.

 

Properties text 속성에 combo를 눌러서 Text 줄바꿈을 하고싶다면 컨트롤+엔터를 통해 줄바꿈해서 텍스트를 입력후 Enter를 눌러 저장할수 있다.

 

이는 F2를 눌러서 변경할때에도 동일하다.

 

다음은 생성한 버튼에 이벤트를 걸어보자. 이벤트를 거는 방법도 여러가지인데 먼저 버튼을 빠르게 더블클릭해보자(비권장), 그럼 해당 버튼의 스크립트 화면이 나올것이다.

 

기본적으로 더블클릭으로 생성되는 이벤트는 onclick 이벤트로 생성된다. 하지만 왜 비권장이라고 이야기 했냐면

더블클릭을 빠르게 하면 이벤트 설정, 느리게 하면 text 변경이여서 속도에 따라서 다른 작업이 진행될수 있기때문에 가급적이면 다른 방법을 쓰는것이 좋다고 생각한다.

 

다른방법은 이벤트를 걸 버튼을 선택한후 우측 Properties에서 번개표시가 있는 이벤트 항목을 누르면 이벤트 관련된 컴포넌트들의 리스트가 보일것이다. 거기에서 onclick 부분에서 직접 사용자 지정의 이벤트 명을 생성할수 있다.

 

이렇게 생성한 click 이벤트로 메세지를 띄워보자. alert을 이용할건데 script창에 alert을 추가할때 넥사크로에서는 

this.alert으로 선언해줘야 한다고 한다.

 

따라서 onclick 이벤트의 이름이 Button00_onclick인 경우 스크립트 창에서는

 

this.Button00_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo)
{
	//alert('ㅎ이요');
	this.alert("hello 안녕하세요");
};

 

이런식으로 선언해줘야한다. 자 이제 제대로 이벤트가 설정이 됐는지 테스트를 해봐야한다.

 

상단에 메뉴모음 바에 보면 돋보기에 번개표시가 있는 Quick View 버튼이 보일것이다. 이걸 눌러보면 창이 하나 뜰텐데

 

 

이걸 눌러보면

 

 

이런 퀵뷰창이 하나 뜬다. 여기서 browser를 nexacro Runtime Enviroment를 선택후 Run을 누르면 브라우저가 실행되고 만든 버튼들이 보일것이다.

 

해당 브라우저는 투비소프트에서 제작한 브라우저라고 한다.

 

실행의 결과물이다. 위의 버튼에 onclick 이벤트를 부여했고. 부여한 이벤트가 잘 실행되는것을 확인할수가 있다.