Layouts"

From Documentation
(Blanked the page)
Line 1: Line 1:
{{ZKComponentReferencePageHeader}}
 
  
= Splitlayout =
 
*Demonstration: N/A
 
*Style Guide: N/A
 
*[http://www.zkoss.org/product/edition.dsp Available in ZK EE only]
 
  since 9.5.0
 
 
== Related components ==
 
None.
 
 
== Required Settings ==
 
If the primary pane has a visible label, it is referenced by '''aria-labelledby''' on the separator element. Otherwise, the separator element has a label provided by aria-label.
 
 
== Keyboard Support ==
 
{| border="1px"
 
! <center>Key</center>
 
! <center>Description</center>
 
|-
 
| ArrowUp/ArrowDown
 
| When the splitter is focused, move the splitter vertically.
 
|-
 
| ArrowLeft/ArrowRight
 
| When the splitter is focused, move the splitter horizontally.
 
|-
 
| Enter
 
| If the primary pane is not collapsed, collapses the pane. If the pane is collapsed, restores the splitter to its previous position.
 
|}
 
 
== Example ==
 
<source lang="xml">
 
<zk xmlns:ca="client/attribute">
 
    <splitlayout orient="horizontal" width="600px" height="500px" collapse="after">
 
        <div>
 
            Hello Left
 
            <button label="Left"/>
 
        </div>
 
        <div>
 
            <button label="Right"/>
 
            Hello Right
 
        </div>
 
    </splitlayout>
 
</zk>
 
</source>
 

Revision as of 10:48, 14 July 2020