앱타일 아이콘 넣는 방법
앱타일 아이콘 넣는 방법
1. 개요
SAP Fiori Launchpad(FLP)에서 앱 타일(Tile)에 표시되는 아이콘을 변경하거나 추가하고 싶을 때는 프로젝트의 manifest.json 설정 파일을 수정합니다. SAP Icon Explorer에서 제공하는 표준 아이콘 이름을 활용하여 원하는 이미지를 타일에 바인딩할 수 있습니다.
2. manifest.json 설정 위치 및 방법
manifest.json 파일 내 sap.app 속성 하위의 crossNavigation->inbounds 영역에서 수정을 진행합니다.
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
"sap.app": {
...
"crossNavigation": {
"inbounds": {
"z**co0030-display": {
"semanticObject": "z**co0030",
"action": "display",
"title": "{{z**co0030-display.flpTitle}}",
"subtitle": "{{z**co0030-display.flpSubtitle}}",
"icon": "sap-icon://factory", //[이곳을 수정]
"signature": {
"parameters": {},
"additionalParameters": "allowed"
}
}
}
}
}
3. SAP Icon Explorer 연계 적용
- SAP Icon Explorer 사이트에 접속하여 원하는 키워드(예:
product,factory등)로 아이콘을 검색 - 검색된 아이콘 리스트 중 마음에 드는 아이콘을 클릭
- 세부 정보 창에 나오는 Icon Name(예:
factory,add-product등)을 그대로 복사 manifest.json파일의"icon"값 뒤쪽에 접두사(sap-icon://)와 함께 붙여넣습니다.- 예시 (
factory선택 시):"icon": "sap-icon://factory" - 예시 (
add-product선택 시):"icon": "sap-icon://add-product"
- 예시 (
4. 주의사항 및 체크리스트
- 대소문자 구분: 아이콘 이름은 소문자와 하이픈으로 구성된 표준 명칭을 정확하게 입력
- 캐시 리프레시:
manifest.json을 수정하고 서버에 배포한 후 Fiori Launchpad 화면에서 아이콘이 즉시 바뀌지 않는다면, 브라우저 캐시를 모두 비우거나 하드 새로고침(Ctrl + F5 / Cmd + Shift + R)을 수행
이 기사는 저작권자의 CC BY 4.0 라이센스를 따릅니다.
