<dvt:node>

dvt:node node node

UIComponent class: oracle.adf.view.faces.bi.component.hierarchyViewer.Node
Component type: oracle.dss.adf.hierarchyViewer.Node

The node component is used to stamp out nodes in the hierarchy.

The "zoom100", "zoom75", "zoom50", and "zoom25" facets are used to specify the stamps for different zoom levels of the hierarchy. The "zoom100" facet is typically the most detailed, showing the most information, because the nodes are larger at 100% size. The "zoom25" facet is typically the least detailed, showing the least information, because the nodes are smaller at 25% size. All zoom facets only support a single child component.

The following tags are allowed as children of the zoom facets:

• af:commandButton
• af:commandImageLink
• af:commandLink
• af:commandMenuItem
• af:goButton
• af:goLink
• af:image
• af:menu
• af:outputFormatted
• af:outputText
• dvt:panelCard
• af:panelFormLayout
• af:panelGroupLayout
• af:panelLabelAndMessage
• af:separator
• af:showPopupBehavior
• af:spacer

Relationship with other tags

This component must be a child of the <dvt:hierarchyViewer> component.

The node component can have the following children: facet.

Example

The following example shows XML for a node tag.
<dvt:hierarchyViewer>
<dvt:node width="233" height="233">
<f:facet name="zoom100">
<af:panelGroupLayout layout="vertical" inlineStyle="width:100%;height:100%;padding:5px">
<af:panelGroupLayout layout="horizontal">
<af:panelGroupLayout inlineStyle="width:85px;height:120px">
<af:image source="#{node.Thumburl}"/>
</af:panelGroupLayout>
<af:spacer width="5" height="5"/>
<af:panelGroupLayout layout="vertical">
<af:outputText value="#{node.Firstname}" inlineStyle="font-weight:bold;font-size:20px;color:#383A47"/>
<af:outputText value="#{node.Lastname}" inlineStyle="font-size:20px;color:#383A47"/>
<af:outputText value="#{node.Title}" inlineStyle="font-size:11px;font-style:italic;color:#383A47"/>
</af:panelGroupLayout>
</af:panelGroupLayout>
</af:panelGroupLayout>
</f:facet>
</dvt:node>
</dvt:hierarchyViewer>


Gradient background and border

By default, the node displays a gradient background that transitions from its background-color to white. The gradient can be turned off so that the background is a solid color by specifying the custom attribute "fill-type:solid" in the inlineStyle attribute on the <dvt:node> tag.

Similarly, by default, the node displays a gradient border based on its border-color. The gradient can be turned off so that the border is a solid color by specifying the custom attribute "border-type:solid" in the inlineStyle attribute on the <dvt:node> tag.

Popups

Popups launched from components in hierarchy viewer nodes can be configured to show contextual information about the node. The application can use <af:setPropertyListener> in the <af:popup> to get information from the data row associated with the node when the popup launches and transfer it to a managed bean. The components in the popup can then refer to that information stored in the managed bean when the popup renders.

Note that the desired information must be retrieved when the popup launches and stored away because the node context is only temporarily set during the popup launch. The node context on hierarchy viewer may change by the time the popup renders, but the information stored in the managed bean will not be affected.

A component in a node that launches a popup might be defined like:

       <af:commandButton id="popupButton1" text="PopupMenu">
         <af:showPopupBehavior popupid="O__popupMenu1" triggerType="action"
                               alignid="popupButton1" align="beforeEnd"/>
       </af:commandButton>
       

The associated popup could be defined on the same jspx page outside of the <dvt:hierarchyViewer> tag, and might look like:

       <af:popup id="popupMenu1" contentDelivery="lazyUncached"
                 eventContext="launcher" launcherVar="source">
         <af:menu id="menu1" text="Test Menu">
           <af:commandMenuItem id="cmi1" text="#{testBean.rowData.Empno}"/>
           <af:commandMenuItem id="cmi2" text="#{testBean.rowData.Ename}"/>
           <af:commandMenuItem id="cmi3" text="#{testBean.rowData.Job}"/>
         </af:menu>
         <af:setPropertyListener from="#{source.currentRowData}"
                                 to="#{testBean.rowData}" type="popupFetch"/>
       </af:popup>
       

In the above example, note that:

• contentDelivery must be set to "lazyUncached" so that the popup content will be fetched again each time the popup renders, because the content may change each time
• eventContext must be set to "launcher" so that the source component context, the hierarchy viewer, will be set when the popup launches
• launcherVar must be set to something so that the source component, the hierarchy viewer, can be referenced in the setPropertyListener
• the type attribute of the setPropertyListener must be set to "popupFetch" so that it is executed when the popup launches
• the from attribute of the setPropertyListener should use the launcherVar set on the popup to refer to the hierarchy viewer to get the desired information

In this example, the setPropertyListener uses the special hierarchy viewer property "currentRowData" to transfer the entire data row for the node to a managed bean. The popup contents can then refer to any item in the data row, such as "Empno", "Ename", and "Job". Alternatively, multiple setPropertyListeners could be used to retrieve and store each data item separately.

Instead of getting the data for the row, the application can get the row key to use to lookup data outside of the hierarchy viewer model. In that case, the from attribute of the setPropertyListener should be set to "#{source.rowKey}".

Hover window

By default, when a node is zoomed out to 75% or below and the mouse hovers over the node, a built-in hover window is displayed showing the node at 100%. This behavior can be overridden by specifying an <af:showPopupBehavior> tag with triggerType="mouseHover" in the node stamp, most likely as a child of the outermost container element, to show a custom ADF Faces popup instead.

The following example shows XML for such a case.

       <dvt:node width="233" height="233" id="n0">
         ...
         <f:facet name="zoom75">
           <af:panelGroupLayout inlineStyle="width:100%;height:100%;padding:3px;"
                                layout="vertical" id="pgl1">
             <af:showPopupBehavior popupid="O__popup1" triggerType="mouseHover"
                                   alignid="pgl1" align="beforeEnd"/>
             ...
           </af:panelGroupLayout>
         </f:facet>
         ...
       </dvt:node>
       

Events

Supported Facets

Attributes