Molds

A component could have multiple different visual appearance. Each appearance is called a mold. A mold is basically a combination of a DOM structure plus CSS. That is, it is the visual representation of a component. Developers could dynamically change the mold by use of Component.setMold(String).

All components support at least a mold called default, which is the default value. Some components might have support two or more molds. For example, tabbox supports both default and accordion molds.

If tabbox's mold is not set, it use default mold.

<tabbox>
	<tabs>
		<tab label="First tab" />
		<tab label="Second tab" />
	</tabs>
	<tabpanels>
		<tabpanel>The first panel.</tabpanel>
		<tabpanel>The second panel.</tabpanel>
	</tabpanels>
</tabbox>

And you could set tabbox's mold to "accordion" to change the look.

<tabbox mold="accordion">
	<tabs>
		<tab label="First tab" />
		<tab label="Second tab" />
	</tabs>
	<tabpanels>
		<tabpanel>The first panel.</tabpanel>
		<tabpanel>The second panel.</tabpanel>
	</tabpanels>
</tabbox>

For more information about component's molds, please refer to ZK Component Reference.

Version History

Version	Date	Content