Home > 멀티 버전 > 스타일2
타일(tile) 형식 스타일 설정 예제입니다.
설명

dx5.create 함수를 사용하여 컴포넌트 생성 시점의 파라미터(style)를 'tile'로 설정한 예제입니다.

타일 형식은 헤더를 갖지 않으며, 항목의 높이는 고정입니다.

가상 파일을 등록할 때, 이미지의 경우 thumb 속성에 웹 경로를 설정하면, 섬네일을 볼 수 있으며, 로컬 이미지 파일은 기본적으로 섬네일 처리가 됩니다.(JPEG, PNG같은 일부 파일만)

이미지 파일이 많은 경우 섬네일 처리를 위해 파일 정보를 모두 로딩하기 때문에 성능이 저하될 수 있습니다.

 

컴포넌트 스타일은 setUIStyle 함수를 사용합니다.

// 파라미터로 스타일 속성이 정의된 json 객체를 넘겨야 합니다.	
dx.setUIStyle({ ... });

// 예시
dx.setUIStyle({
  statusBarVisible: true, // or false
  borderVisible: true, // or false
  ...
});

DEXTUploadX5 멀티 버전은 HTML5 기반으로 동작합니다.

그러나 컴포넌트 화면을 그리는 기술은 HTML이 아닌 SVG 기술을 사용하고 있습니다.

SVG는 브라우저마다 렌더링 되는 결과물이 조금씩 다를 수 있으며, 벡터 그래픽을 기반으로 하기 때문에, pixel 단위로 GUI 레이아웃을 처리하기가 쉽지 않습니다.

그러므로 선 굵기와 같은 부분의 미려한 차이는 제품 수준에서 보완되기 어려움이 있습니다.

예제

 

 

기본 레이아웃 스타일 지정

 

상태바 설정

 

배경 설정

배경은 이미지를 설정할 수 있습니다.

경로를 복사하여 설정해보세요.
주의) 배경 이미지는 항목에 가려 보이지 않을 수 있습니다. 테스트를 하려면 일부 항목을 삭제하세요.

 

글자 설정

 

열기, 다운로드 버튼 설정