[ SAPUI5 ] Flexible Column Layout App / Creating an Empty Flexible Column Layout

○ 루트 뷰 설정을 통해 화면의 기본 설정을 해둔다.

---

    - [ manifesr.json ]

...
},
"sap.ui5": {
	"rootView": {
    	"viewName": "sap.ui.demo.fiori2.view.App",
        "type": "XML",
        "async": true,
        "id": "fcl"
    },
    "dependencies": {
    	"minUI5Version": "1.60.0",
        "libs": {
        	"sap.ui.core": {},
            "sap.f": {}
        }
    },
    ...
}

      1) viewName : [ App.view.xml ]을 'rootView'로 설정한다.

      2) type : view의 타입은 'XML'을 사용할 것을 입력한다.

      3) async

        * 동기식으로 호출함을 'true'로 설정한다.

        * 비동기로 호출하기 위해서는 'false'를 입력한다.

      4) sap.f

        * Fiori 2.0 디자인 표준을 따르는 컨트롤 집합이다.

        * 모바일 장치와 같은 다양한 화면 크기에 최적화되어 있는 적응형 컨트롤이다.

---

    - [ App.view.xml ]

<mvc:View
    displayBlock="true"
    height="100%"
    xmlns="sap.f"
    xmlns:mvc:"sap.ui.core.mvc">
    		<FlexibleColumnLayout id="flexibleColumnLayout" backgroundDesign="Solid"></FlexibleColumnLayout>
</mvc:View>

      1) displayBlock : 요소 간 줄 바꿈이 되며, block 요소의 성격을 'true'로 설정함으로써 해당 view를 블럭 처리한다.

      2) height : 블록이 차지할 수 있는 높이를 100%로 설정해 전체 높이를 차지할 수 있도록 설정한다.

      3) [ manifest.json ]에서 'dependencies'의 'libs'에서의 'sap.f'를 호출한다.

---

    - 아직 해당 view에 대한 것을 아무것도 설정하지 않았기에 빈 공간만 화면에 출력된다.

---

Next Stage : Using Dynamic Page for the List View

Flexible Column Layout App / Using Dynamic Page for the List View