앱의 MainFrame을 구성합니다.
MainFrame
넥사크로플랫폼 앱의 기본 화면을 구성하는 요소입니다. 하위 구성 요소로 ChildFrame을 가지고 있으며 프로젝트와 함께 기본 생성됩니다.
프레임 구조는 ChildFrame하나만 추가된 기본 구조를 그냥 사용합니다.
ChildFrame
ChildFrame은 MainFrame 하위에 올 수 있는 프레임으로 Form 정보를 Url 형태로 가지고 있어 해당 Form을 화면에 표시합니다. 기본적으로 Form이 로딩될 수 있는 기본 단위의 프레임을 의미합니다.
메인화면을 ChildFrame의 "formurl" 속성에 링크하여 넥사크로플랫폼 실행 시 화면을 표시합니다.
메인화면
화면구성
소스참고 EduHub\mobile\Mobile_main.xfdl
1 Div(divBody) 메인 메뉴화면이 출력됩니다. 2 Div(divMain) 메인 메뉴에서 선택된 세부화면이 출력됩니다. 3 Div(divMenu) 관리자 로그인 시 관리자 메뉴화면이 출력됩니다.
앱 로딩시 첫 화면은 1 divBody에 메인 메뉴화면이 출력됩니다.
메인메뉴에서 메뉴를 클릭하면 선택된 화면 url정보를 받아서 2 divMain에 화면이 보여집니다.
2 divMain에 있는 < 뒤로 가기 이미지를 클릭하면 2 divMain을 감추고 1 divBody을 출력합니다.
메인화면( Body )
화면구성
소스참고 EduHub\mobile\Mobile_main_content.xfdl
1 Div 메인 메뉴화면의 컴포넌트를 Div에 구성합니다. 2 Button 주요 메뉴들을 버튼으로 구성하여 클릭 시 해당화면으로 이동합니다. 3 Button 여러 개의 버튼을 애니메이션 효과로 돌아가면서 볼 수 있도록 애니메이션으로 재배치합니다.
주요 기능 구현 설명
부모창에 있는 함수 호출하기
메뉴를 클릭하면 부모창에 있는 함수를 호출하여 해당 화면을 보여줍니다.
this.divBody_btnQuest_onclick = function(obj:nexacro.Button,e:nexacro.ClickEventInfo) { if(this.parent.parent.fn_loginCheck() == false) { nexacro.getApplication().GV_TARGET_TITLE = "자가진단"; nexacro.getApplication().GV_TARGET_URL = "mobile::Mobile_frmQuestionnaire.xfdl"; this.parent.parent.fn_Login(); } else { this.parent.parent.fn_openMenu("1010",""); } };
모바일에서 디바이스 버튼 눌렀을 때 처리
안드로이드기반의 모바일인 경우 디바이스 버튼의 뒤로가기를 클릭했을 때 뒤로가기 기능을 처리합니다.
this.sPageFlag = "M"; //메인:M , sub: S, 서브안 detail: D //안드로이드 뒤로가기 this.Mobile_main_ondevicebuttonup = function(obj:nexacro.Form,e:nexacro.DeviceButtonEventInfo) { //다른화면들이 뜨는 경우 var bFlag = this.divMain.visible; if(bFlag){ this.sPageFlag = "S"; this.fn_goMain(); }else{ this.sPageFlag = "M"; } // MENU(1) CANCEL(2) if (e.button == 2) { if(this.sPageFlag == "M") //메인인 경우 종료팝업 { var sMsgId = "edu.msg.program.exit"; var arrArg = ""; var sPopId = sMsgId; this.gfn_alert(sMsgId, arrArg, sPopId, "fnMsgCallback"); } } };
Form의 ondevicebuttonup 이벤트는 모바일에서 디바이스 버튼을 눌렀을 때 발생하는 이벤트입니다. 모바일에서 디바이스 버튼을 눌렀을 때 열려져 있는 화면이 메인인경우는 팝업을 종료하고 메인화면의 메뉴가 선택되어 호출된 화면인 경우 메인화면으로 이동합니다.
전화걸기
this.fn_PhoneCall = function() { system.execBrowser("tel:02-2140-7224"); }
system은 운영체제, 하드웨어, 입력장치등의 정보를 제공하는 오브젝트를 이고 execBrowser는 웹브라우저를 실행하는 메소드입니다. 전화URL를 웹브라우저에 연결하여 전화걸기 기능을 수행합니다.
웹에서 a 태그를 이용하여 전화걸기 구현방법
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>모바일웹에서 전화걸기 링크 만들기</title>
</head>
<body>
<a href='tel:010-8670-0247'>전화하기</a>
</body>
</html>