Use the Show Detail Frame component to provide a chrome with options to collapse/restore, resize, or delete the component. By using Show Detail Frame components, you can include more detailed information on a page without cluttering its visual appearance because users can resize, collapse/restore, or delete the component as convenient. A Show Detail Frame provides a header with options to perform various actions on the component at runtime. More
You can also enable users to move the Show Detail Frame components to different locations on the page.
A Show Detail Frame component provides additional capabilities on some child components. For example, if you wrap an ADF Faces Rich Text Editor in a Show Detail Frame component, end users can edit and save text in the Rich Text Editor. If you wrap a task flow in a Show Detail Frame component, then using custom actions you can enable task flow navigation from the Actions menu on the Show Detail Frame header.
In addition, you can customize the menu on the header by adding your own UI controls by using facets of the Show Detail Frame tag. A list of options, available as a drop-down list on the Show Detail Frame header, allows you to control the display of the child component.
Example
<cust:showDetailFrame text="Software Options" id="sdf1" partialTriggers="d2 p1"> <af:region value="#{bindings.softopts1.regionModel}" id="r2"/> <f:facet name="additionalActions"> <af:panelGroupLayout id="pgl1"> <af:commandButton text="Details" id="cb1" action="gotoDetails"></af:commandButton> </af:panelGroupLayout> </f:facet> </cust:showDetailFrame>
Common Attributes
Element | Description |
---|---|
id |
Specifies the unique identifier for the component on the page. This attribute is populated with a unique value by default when you add the component.
|
rendered |
Specifies whether the component is rendered. When set to false, no output will be delivered for this component (the component will not in any way be rendered, and cannot be made visible on the client). The default value is true. |
text |
Specifies a title that will be displayed in the Show Detail Frame header. |
icon |
If you decide to add an icon on the header of the Show Detail Frame component, then this specifies the path where the image for the icon is stored. An image that is not stored at the document root requires a full path, for example:
Note: An image that is stored at the document root does not require a full path. For example:
|
Appearance Attributes
Element | Description |
---|---|
text |
Specifies the text that appears in the header of the Show Detail Frame component. This can be set to an expression. It is valid to leave it blank. |
shortDesc |
Specifies a short description of the component. This text is commonly used by user agents to display tooltip help text, in which case the behavior for the tooltip is controlled by the user agent. For example, Firefox 5 truncates long tooltips. For form components, the shortDesc is displayed in a note window. For components that support the helpTopicId attribute it is recommended that helpTopicId is used as it is more flexible and is more accessibility-compliant. |
icon |
Specifies the location of the icon that will be placed in the header of the Show Detail Frame component. |
background |
Working with the skin CSS, provides a means of applying a different look and feel for this Show Detail Frame instance. Available values are light, medium, dark, and coreDefault. The default value is medium. The coreDefault value is similar to medium, but it also provides a border for the container. The background in this case would be similar to that of an ADF Faces panelBox component. |
displayHeader |
Indicates whether the header of the Show Detail Frame is displayed. The default value is true. If you choose to set displayHeader to false and if you have exposed some actions on the component, then a toolbar is displayed when you move the mouse over the component area. The toolbar contains a drop-down icon, which displays a menu of available options. This toolbar displays only in Edit mode, if there are actions available on the component. |
displayShadow |
Specifies whether a shadow must be cast by the Show Detail Frame component. Available values are true and false. Default value is false. |
expansionMode |
Represents the default state of the Show Detail Frame. Available values are normal and minimized. Default value is normal.
In the minimize mode, only the header is displayed. |
rendered |
Determines whether or not the component is rendered to the browser. Default value is true. |
Actions Attributes
Element | Description |
---|---|
displayActions |
Specify when the seeded interactions must be displayed. Available values are onHover and always. The default value is always. |
inheritGlobalActions |
Specifies whether the global action value must be inherited in this instance if the action value was defined to be the same at the global and local level. Available values are true and false. Default value is false. |
icon |
Specifies the location of the icon that will be placed in the header of the Show Detail Frame component. |
showMoveAction |
Renders a Move command on the Show Detail Frame Actions menu for Show Detail Frame components placed inside a Panel Customizable component. Available options are menu and none. Default value is menu. |
showRemoveAction |
Renders a Remove icon on the Show Detail Frame header. This icon can be used to remove the component from the page. Available options are chrome and none. Default value is none.
Note: The Remove icon is displayed in page Edit mode irrespective of this attribute setting, provided customization restrictions have not been applied. |
showResizer |
Specifies whether a resize handle must be displayed on the lower right corner of the Show Detail Frame. You can alter only the height of a Show Detail Frame while resizing it. Available options are none and always. The default value is always. At run time, you can reduce the height of the Show Detail Frame component to a minimum of 24px. |
showMinimizeAction |
Renders a Minimize icon on the Show Detail Frame header that collapses and restores the Show Detail Frame. Available values are chrome and none. Default value is chrome. |
showEditAction |
Renders an Edit icon on the Show Detail Frame header that enables you to edit component properties at runtime. Available values are true and false. Default value is true. This is relevant only in a Composer-enabled page, that is, if the Show Detail Frame component is nested within a Page Customizable component. |
Style Attributes
Element | Description |
---|---|
contentStyle |
Specifies the CSS style to apply to the Show Detail Frame content area. Manually enter any style in compliance with CSS version 2.0 or later.The CSS styles in this attribute are commonly used to define the height and background color of the Show Detail Frame. For example, height:200px; background-color:green; |
styleClass |
A CSS style class to use for this component. The style class can be defined in your JSPX page or in a skinning CSS file, for example. |
inlineStyle |
The CSS styles to use for this component. This is intended for basic style changes. The inlineStyle is a set of CSS styles that are applied to the root DOM element of the component. If the inlineStyle's CSS properties do not affect the DOM element you want affected, then you will have to create a skin and use the skinning keys which are meant to target particular DOM elements, like ::label or ::icon-style. |
headerStyle |
Specifies the CSS style to apply to the Show Detail Frame title that is displayed on the header. Manually enter any style in compliance with CSS version 2.0 or later.The CSS styles in this attribute are commonly used to define the font, size, and color of the title text. |
Behavior Attributes
Element | Description |
---|---|
partialTriggers |
The IDs of the components that should trigger a partial update. This component will listen on the trigger components. If a trigger component receives an event that will cause it to update in some way, this component will request to be updated too. Identifiers are relative to the source component (this component), and must account for NamingContainers. If your component is inside of a naming container, you can use a single colon to start the search from the root of the page, or multiple colons to move up through the NamingContainers - "::" will pop out of the component's naming container (or itself if the component is a naming container) and begin the search from there, ":::" will pop out of two naming containers (including itself if the component is a naming container) and begin the search from there. |
disclosureListener |
Specifies a method reference to a disclosure listener. A disclosure event is fired when the user expands or collapses the Show Detail Frame component. Specify a method reference of type javax.el.MethodExpression. |
stretchContent |
Specifies whether the Show Detail Frame component stretches its child component. Available options are true, false, and auto. The default value is true.You can use the stretchContent attribute to stretch a child component that supports being stretched. For example, container components like Panel Form Layout, Panel Customizable, and Show Detail Item provide the capability to be stretched when placed inside a component that stretches. If you select true, the child component is stretched to the height and width of the Show Detail Frame's content area. The default height of the Show Detail Frame is 200px and it is defined using the ContentStyle attribute.If you select auto, the child component is stretched only if the Show Detail Frame stretches it. If not, the child component displays a scroll bar. |
Advanced Attributes
Element | Description |
---|---|
binding |
An EL reference that will store the component instance on a bean. This can be used to give programmatic access to a component from a backing bean, or to move creation of the component to a backing bean. |
attributeChangeListener |
A method reference to an attribute change listener. Attribute change events are not delivered for any programmatic change to a property. They are only delivered when a renderer changes a property without the application's specific request. An example of an attribute change events might include the width of a column that supported client-side resizing. Specify a method reference of type javax.el.MethodExpression. |
selectChild |
Specifies whether runtime selection and customization must be enabled on child components. This is relevant only in a Composer-enabled page, that is, if the Show Detail Frame component is nested within a Page Customizable component. The default value is yes.When you add a shared component like a task flow inside a Show Detail Frame component, users can edit components on the task flow's page. You can use the selectChild attribute to restrict users from editing components on the task flow's page. |
Customization Attributes
Element | Description |
---|---|
customizationAllowed |
Specifies whether customizations are allowed on this component. Available values are true and false. The default value is true. |
customizationAllowedBy |
Specifies the roles for which customization is enabled.
Note: To display all relevant roles in this drop-down list, you must ensure that the roles are specified in the MDS customization policy. |
Other Attributes
Element | Description |
---|---|
customizationId |
This attribute is deprecated. It will be removed in the next release. Use the id attribute instead. |
helpTopicId |
Specifies a Help topic ID to link a custom Help topic with the component. The Expression Builder option available when setting these attributes allows you to bind the attribute to a managed bean. |
Supported Facets
The Show Detail Frame component supports the following two facets:
Element | Description |
---|---|
additionalActions |
Use if some additional actions are to be added to the Actions menu available on the Show Detail Frame header. To ensure that the additional actions appear similar to other actions on the menu, use Command Menu Item components or a Group component with nested Command Menu Item components inside this facet. |
titleBarAction |
Use if an action is to be associated with title of the Show Detail Frame component. The component specified by the facet is rendered in place of Show Detail Frame's text attribute. |
Related Topics
"Adding Custom Actions to Components" in Developing WebCenter Portal Assets and Custom Components with Oracle JDeveloper