fuse-v = 0.34.0
os = Windows 10 64bit
needStep = fix variable access problem
description :
https://www.fusetools.com/examples/tab-bar-navigation
above the example. icon doesn’t show.
icon path couldn’t get without spacing
<!-- 백그라운드 색 지정 -->
<App Background="#333">
<!-- 자바스크립트 직접 작성 -->
<JavaScript>
// 페이지 객체에 Json 형태의 배열을 생성
var pages = [
{"name":"page1", "highlight":"#34495e", "icon":"Assets/icon-hexagon.png"},
{"name":"page2", "highlight":"#3498db", "icon":"Assets/icon-star.png"},
{"name":"page3", "highlight":"#aa3377", "icon":"Assets/icon-square.png"},
{"name":"page4", "highlight":"#88cc22", "icon":"Assets/icon-triangle.png"}
];
// UX에서 사용할 수 있도록. 내부 객체명을 외부 객체명에 대응시켜 exports 객체에 담음.
module.exports = {
pages: pages,
pageCount: pages.length
};
</JavaScript>
<!-- MyPage 라는 Page 클래스 선언 -->
<Page ux:Class="MyPage">
<StackPanel>
<Text Color="#88cc22">{icon}</Text> <- just `{icon}` string show.
<Text Color="#88cc22"> {icon}</Text> <- good icon key's value show.
</StackPanel>
<!-- 플롯리소스의 키과 값을 정의 -->
<ResourceFloat4 Key="Highlight" Value="{highlight}" />
<!-- 파일 이미지 소스의 ux:Key 와 파일위치를 정의 -->
<FileImageSource ux:Key="Icon" File="{icon}" />
all resource is in the Assets folder. I never touched example resource files.