개요
Cell 이 Tree 형식일 때 사용되는 CellTreeLineControl 입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
- Cell 이 Tree 형식일 때 하위 트리와 연결되는 선을 표시하는 컨트롤 오브젝트 입니다.
Status
Name | Type | Description |
|---|---|---|
disabled | status | 컴포넌트가 비활성화된 상태 |
enabled | status | 컴포넌트가 활성화된 상태 |
속성
-nexa-border
CellTreeLineControl 의 테두리를 설정하는 속성입니다.
지원 환경
Desktop NRE | Desktop WRE | |||||
|---|---|---|---|---|---|---|
☑ Windows | ☑ macOS | ☑ Edge | ☑ Chrome | ☑ Safari | ☑ Firefox | ☑ Opera |
Mobile NRE | Mobile WRE | |||||
☑ Android | ☑ iOS/iPadOS | ☑ Android | ☑ iOS/iPadOS | |||
속성 타입
☐ Enum | ☐ Expr | ☐ Control | ☐ Hidden | ☐ ReadOnly | ☐ Bind | ☐ Collection | ☐ StringResource |
문법
CellTreeLineControl.-nexa-border
문법 설정
-nexa-border ::= <line-width> <line-style> <color> [,<line-width> <line-style> <color>]{3}
<line-width> ::= 'thin' | 'medium' | 'thick' | <nWidth> 'px'
<line-style> ::= 'none' | 'hidden' | 'dotted' | 'dashed' | 'solid' | 'double' | 'groove' | 'ridge' | 'inset' | 'outset'
<color> ::= <NamedColor> | <NumericColor>
1회 입력 : top/right/bottom/left 에 모두 적용됩니다.
2회 입력 : top/bottom, right/left 에 첫번째 값부터 각각 적용됩니다.
3회 입력 : top, right/left, bottom 에 첫번째 값부터 각각 적용됩니다.
4회 입력 : top, right, bottom, left 에 첫번째 값부터 각각 적용됩니다.
* 2회~4회 입력은 border-radius 속성값이 설정되지 않은 경우만 적용됩니다. | ||
* XCSS -nexa-border : 1px solid #999999; -nexa-border : 1px solid #999999, 1px solid #999999, 1px solid #999999, 1px solid #999999; | ||
<line-width> | 테두리 선의 두께를 설정합니다. "thin" 설정 시 1 pixel 두께로 테두리가 표시됩니다. "medium" 설정 시 3 pixel 두께로 테두리가 표시됩니다. "thick" 설정 시 5 pixel 두께로 테두리가 표시됩니다. <nWidth> 설정 시 <nWidth> pixel 두께로 테두리가 표시됩니다. | |
|---|---|---|
<nWidth> | 테두리 선의 두께를 pixel 단위로 설정합니다. "px" 단위는 생략할 수 없습니다. | |
<line-style> | 테두리 선의 스타일을 설정합니다. "none" 설정 시 테두리가 표시되지 않습니다. "hidden" 설정 시 테두리가 표시되지 않습니다. "dotted" 설정 시 테두리가 점선으로 표시됩니다. "dashed" 설정 시 테두리가 긴 점선으로 표시됩니다. "solid" 설정 시 테두리가 실선으로 표시됩니다. "double" 설정 시 테두리가 두줄로 표시됩니다. "groove" 설정 시 테두리가 들어간 것처럼 보이게 입체적으로 표시됩니다. "ridge" 설정 시 테두리가 올라온 것처럼 보이게 입체적으로 표시됩니다. "inset" 설정 시 컴포넌트가 들어간 것처럼 보이게 테두리가 입체적으로 표시됩니다. "outset" 설정 시 컴포넌트가 올라온 것처럼 보이게 테두리가 입체적으로 표시됩니다. | |
<color> | 테두리 색상을 색상이름 또는 색상코드로 설정합니다. | |
<NamedColor> | "red","blue" 와 같이 미리 정의된 색상이름을 문자열로 설정합니다. | |
<NumericColor> | 표시할 색의 색상코드입니다. "#" 기호로 시작하는 6자리 hexadecimal 값으로 색상코드를 설정할 수 있습니다. (ex-"#FF00FF") red, green, blue 값을 인자로 하는 "rgb()" 메소드로 색상코드를 설정할 수 있습니다. (ex-"rgb(255,0,255)") red, green, blue, alpha 값을 인자로 하는 "rgba()" 메소드로 색상코드를 설정할 수 있습니다. (ex-"rgba(255,0,255,0.3)") hue, saturation, lightness 값을 인자로 하는 "hsl()" 메소드로 색상코드를 설정할 수 있습니다. (ex-"hsl(120,50%,50%)") hue, saturation, lightness, alpha 값을 인자로 하는 "hsla()" 메소드로 색상코드를 설정할 수 있습니다. (ex-"hsla(120,50%,50%,0.8)") | |
참고
- -nexa-border 속성값을 설정하지 않으면 undefined 가 설정되고, "medium none #999999" 로 동작합니다. - <line-style> 이 "double" 일 때 두 줄을 다른 색으로 설정할 수 없습니다. <color> 에 설정된 색이 두 줄에 모두 적용됩니다. ◆ Nexacro Runtime Environment 제약 - 각 테두리의 색상이나 두께를 다르게 설정했을 경우 top > right > bottom > left 순으로 겹쳐서 표시됩니다. - <line-style> 파라미터에 "double","groove","ridge","inset","outset" 값을 설정해도 적용되지 않습니다. - <line-width> 파라미터에 "thin","medium","thick" 값을 설정해도 적용되지 않습니다. ◆ Web Runtime Environment 제약 - 각 테두리의 색상이나 두께를 다르게 설정했을 경우 웹브라우저에 따라 테두리가 겹쳐지는 순서가 다르게 처리될 수 있습니다. - 각 테두리의 색상이나 두께를 다르게 설정했을 경우 border-radius 속성값이 설정되어 있으면 두께는 각 테두리 별로 따로 적용되고, 색상은 top 에 설정된 색이 적용됩니다. - 각 테두리의 색상이나 두께를 다르게 설정했을 경우 border-radius 속성값이 설정되어 있어도 일부 브라우저는 각 테두리의 색상이나 두께가 각각 적용됩니다.