Crestron Components Lib - Showcase App

ch5-subpage-reference-list: centerItems

centerItems attribute

It will center the list items, if the number and size of the list items is less than the size of the control.If Stretch attribute is set to both then stretch attribute will take more priority than centerItems attribute. Default value is false.

NOTE: user needs to specify the widget width and height inside the template.
Example:
<template id="templateWidgetId" >
 <div style="height:50px;width:250px" >
   <ch5-toggle
      label="Toggle label">
   </ch5-toggle>
 </div>
</template>

NOTE: Avoid using CH5-SubpageReferenceList with noShowType="remove"

<template  id="templateWidgetId" >
	<div style="border:1px dotted green" >
	 <ch5-toggle 
		label="Toggle label">
</ch5-toggle>
	</div>
</template>
<br>
<h5>Orientation horizontal - toggles aligned horizontally</h5>
<ch5-subpage-reference-list 
		widgetId="templateWidgetId"
		numberOfItems="2"
		centerItems="true" 
		customStyle="border:3px dotted green;">
		</ch5-subpage-reference-list>
<br/>
<br/>
<h5>Orientation vertical - toggles aligned vertically</h5>
<ch5-subpage-reference-list 
		widgetId="templateWidgetId"
		orientation="vertical"
		numberOfItems="3"
		centerItems="true" 
		customStyle="border:3px dotted green; height:280px;">
</ch5-subpage-reference-list>

Orientation horizontal - toggles aligned horizontally


Orientation vertical - toggles aligned vertically