글

라벨이 View인 게시물 표시

8. SAP UI5 View & Controller Structuring

이미지
  SAP UI5 View & Controller Structuring (구조화)  이 단계에서는 작업 단위의 뷰와 컨트롤러를 모듈화하고 효율적으로 관리할 수 있도록 화면을 재구성한다.  (In this step, the screen is reconstructed so that the View and Controller of the work unit can be modularized and managed efficiently.) 실행 결과 (Results of this step)   이전 단계의 결과와 동일한 UI와 동작을 보여준다. 단, View와 Controller의 구조화를 적용한다.  (It shows the same UI and operation as the result of the previous step. However, the structure of View and Controller is applied.)   실행 순서 (Order of execution of this step): 업무 영역의 화면(View)를 분리하여 신규 생성 및 기존 App.view.xml의 내용을 신규 View로 이동한다. (Separate the screen (View) in the business area to move the contents of the new creation and existing App.view.xml to the new View.) 신규 생성한 View와 한 쌍이 되는 Controller 신규 생성 및 App.controller.js의 내용을 신규 Controller로 이동한다. (Move the contents of the new Controller and App.controller.js, paired with the newly created View, to the new Controller.) App.view.xml에 신규 생성한 View를 Import 한다. (Import a ne...

2. SAP UI5 XML Views Create

이미지
SAP UI5 XML View 란? 이전 단계인 UI5 Bootstraping 단계를 통해서 UI5 Framework를 연동하였다. 이번 단계에서는 UI5 Framework의 MVC 패턴 중 V(View)에 해당하는 UI를 XML 파일을 통해 연동한다. (UI5 Framework was linked through the previous step, UI5 Bootstrapping. In this step, the UI corresponding to the V (View) of the MVC pattern of the UI5 Framework is linked through the XML file.) 실행 결과(Results of this step) 실행 순서(Order of execution of this step): 신규 XML View(App.view.xml) 파일 생성한다. (Create a new XML View (App.view.xml) file) index.html의 <body> tag에 속성 및 ID 부여한다. (Attribute and ID to <body> tag in index.html) index.js에서 index.html에 신규 생성하는 XML View를 <body> tag에 추가하는 로직 작성한다. (Write the logic of adding XML View, which is newly created in index.js to index.html, to the <body> tag.) 1. 신규 XML View(App.view.xml) 파일 생성    (Create a new XML View (App.view.xml) file) webapp/view/App.view.xml 파일 신규 생성한다. (Create a new webapp/view/App.view.xml file.) XML 양식의 View 파일은 "이름.view.xml" 형식으로 약속되어 있다. (View fi...