5월, 2025의 게시물 표시

9. SAP UI5 Custom CSS 적용(Apply)

이미지
SAP UI5 Custom CSS 적용 (Apply) 이 단계에서는 SAP UI5에서 제공하는 Margin 관련 CSS 적용 방법과 사용자가 직접 구성한 Custom CSS를 적용하는 방법을 알아본다. (In this step, we will find out how to apply the Margin-related CSS provided by SAP UI5 and how to apply the custom CSS configured by the user.) 실행 결과 (Results of this step)   UI5의 Text Component를 사용하여 UI5 표준 Margin 및 글씨체와 Bold를 적용한다.   (Apply UI5 standard Margin and font & Bold using the Text Component in UI5.) 실행 순서 (Order of execution of this step): UI5 Standard Margin CSS 적용하기 (Apply UI5 standard Margin.) Custom CSS 적용하기 (Apply the Custom CSS.) 1. UI5 Standard Margin CSS 적용하기    (Apply UI5 standard Margin.) webapp/view/sample/Pageviewsample.view.xml에 Text 컴포넌트 추가 및 CSS 내용 추가한다. (Add text components and CSS content to "webapp/view/samples/pageviewsample.view.xml".) 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 < mvc:View      controllerName = "ui5_tutorial.controller.sample.PageViewSample"        x...

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...

7. SAP UI5 Multilingual Application (다국어 적용)

이미지
  SAP UI5 Multilingual Application (다국어 적용)  이번 단계에서는 ResourceModel을 활용하여 Application에 다국어를 적용하는 방법에 대해서 살펴본다.  (In this step, we will look at how to apply multilingualism to applications using ResourceModel.) 실행결과(Results of this step)   브라우저의 언어가 한국어인 경우를 가정하여 i18n 파일을 활용하여 한국어가 적용된 application을 만든다.   (Assuming that the browser's language is Korean, use the i18n file to create an application to which Korean is applied.)      실행 순서(Order of execution of this step): i18n_ko.properties 파일 생성하여 한국어 등록한다. (Create the "i18n_ko.properties" file and register in Korean.) manifest.json 파일에 한국어 정보를 추가한다. (Add Korean information to the "manifest.json" file.) 1. i18n_ko.properties 파일 생성하여 한국어 등록한다.    (Create the "i18n_ko.properties" file and register in Korean.) webapp/i18n/i18n_ko.properties 파일을 신규 생성한 후 한국어 번역 정보를 추가한다. (Add Korean translation information after creating a new "webapp/i18n/i18n_ko.properties" file.) 한국어 외에 다른 언어를 추가할 때에는 로케일 접미사...