shadow
Element Split view je všestranný komponent, ktorý umožňuje vytvoriť delené zobrazenie s dvoma alebo viacerými sekciami. Poskytuje deliaci posuvník, ktorý umožňuje dynamicky meniť veľkosť sekcií. Podporované sú dve orientácie – vertikálna a horizontálna a vnorením ďalšieho SplitView vytvoriť zložitejšie zobrazenia.
Podporované sú dve orientácie. Pridaním atribútu vertical zobrazíte vertikálny SplitView.
Pridaním vlastnosti min a max s hodnotami “0” až “100” obmedzíte škálu pohybu oddeľovača.
Pridaním atribút disabled deaktivuje možnosť posúvania oddeľovača.
Vnorením ďalšieho SplitView je možné vytvoriť zložitejšie zobrazenia.
| Description | If true, the option to scroll the separator is deactivated |
| Attribute | disabled |
| Type | boolean |
| Default | false |
| Description | If true, the orientation of the separator changes to horizontal. |
| Attribute | horizontal |
| Type | boolean |
| Default | false |
| Description | Defines the initial position of the slider. |
| Attribute | initial |
| Type | number ｜ undefined |
| Default | undefined |
| Description | Defines the value of the maximum possible separator position. |
| Attribute | max |
| Type | number ｜ undefined |
| Default | undefined |
| Description | Defines the value of the minimum possible separator position. |
| Attribute | min |
| Type | number ｜ undefined |
| Default | undefined |
No events available for this component.
No public methods available for this component.
| Name | Description |
|---|
divider | Refers to the div element of the separator. |
| Name | Description |
|---|
--wj-split-view-divider-background | Defines the background of the element. |
--wj-split-view-divider-size | Adjusts the width/height of the separator. |
--wj-split-view-divider-width | Specifies the thickness of the separator. |
--wj-split-view-max | Represents the maximum allowed size (in percent) for the panel. |
--wj-split-view-min | Represents the minimum allowed size (in percent) for the panel. |
| Name | Description |
|---|
divider | The contents shall be placed in the separator. |
end | The content is placed to the right of the separator in the LTR and to the left in the RTL. |
start | The content is placed to the left of the separator in the LTR and to the right in the RTL. |