This document follows on from the core velocity documentation.
In 3.8, a new feature was added that allows non-Java programmers to create dynamic Px Views (Px Views that are created on the fly). By using the Velocity, to create Px XML, customers have new flexibility in creating graphical views. This feature is intended for advanced Niagara users who want more dynamic graphics and navigation without having to use Java.
This feature does require the ‘axvelocity’ license feature.
Dynamic View
option.axvelocity:VelocityPxView
option and click OK
.pxvm
.Px Velocity Template File
to point to the newly created pxvm file.<pre>
<?xml version="1.0" encoding="UTF-8"?>
<!-- Niagara Presentation XML -->
<px version="1.0" media="workbench:WbPxMedia">
<import>
<module name="baja"/>
<module name="bajaui"/>
<module name="gx"/>
<module name="converters"/>
</import>
<content>
<ScrollPane>
<CanvasPane name="content" viewSize="500.0,400.0" background="#c0c0ff">
#set( $kids = $util.getChildren($ax.obj, "baja:Component") )
<GridPane layout="10.0,10.0,480.0,380.0" columnCount="1" rowGap="20">
#foreach($k in $kids)
<Label>
<ValueBinding ord="$k.getSlotPathOrd()" hyperlink="$k.getSlotPathOrd()">
<ObjectToString name="text" format="%displayName%: %.%"/>
</ValueBinding>
</Label>
#end
</GridPane>
</CanvasPane>
</ScrollPane>
</content>
</px>
</pre>
This file will now create the navigation and labels for the points dynamically.
In conclusion, Velocity Px Views are very powerful but can be cumbersome without the initial use of the Px Editor to create the overall look and feel for the Px View.
In order to make the page more manageable, it’s best to use this in conjunction with PxIncludes. The PxInclude Px file can then still be edited. For example, in this example the ‘include.px’ file can still be edited…
<pre>
<?xml version="1.0" encoding="UTF-8"?>
<!-- Niagara Presentation XML -->
<px version="1.0" media="workbench:WbPxMedia">
<import>
<module name="baja"/>
<module name="bajaui"/>
<module name="gx"/>
<module name="converters"/>
</import>
<content>
<ScrollPane>
<CanvasPane name="content" viewSize="500.0,400.0" background="#c0c0ff">
#set( $kids = $util.getChildren($ax.obj, "baja:Component") )
<GridPane layout="10.0,10.0,480.0,380.0" columnCount="1" rowGap="20">
#foreach($k in $kids)
<PxInclude ord="file:^px/include.px" variables="val=s:$k.getName()"/>
#end
</GridPane>
</CanvasPane>
</ScrollPane>
</content>
</px>
</pre>
The Px Media being used can be queried in Velocity. This is useful for dynamically creating Px Views for a Mobile experience that may require less Widgets…
<pre>
#if ($ax.pxView.isMobileMedia())
<Label text="Mobile Media is set!"/>
#elseif ($ax.pxView.isHxMedia())
<Label text="Hx Media is set!"/>
#elseif ($ax.pxView.isReportMedia())
<Label text="Report Media is set!"/>
#elseif ($ax.pxView.isWorkbenchMedia())
<Label text="Workbench Media is set!"/>
#end
</pre>
A Px file with Velocity code in allows graphics to be created on the fly without the aid of a Java programmer. Unfortunately, any Px file with VTL code can’t be edited by the Px Editor. That’s why PxIncludes are recommended to make this less cumbersome. The feature is intended for advanced users and covers the following use cases…
Copyright © 2000-2019 Tridium Inc. All rights reserved.