Oracle® Fusion Middleware Developer's Guide for Oracle WebCenter 11g Release 1 (11.1.1.5.0) E10148-16 |
|
![]() Previous |
![]() Next |
This appendix provides reference information about Oracle Composer-specific tags, configuration files, and style properties. This information is useful while performing the tasks described in Chapter 19, "Enabling Runtime Editing of Pages Using Oracle Composer" and Chapter 20, "Extending Runtime Editing Capabilities Using Oracle Composer."
This appendix contains the following sections:
Section B.2, "Oracle Composer-Specific Files and Configurations"
Section B.3, "Oracle Composer Default Add-Ons and Property Panels"
Section B.5, "Oracle Composer Components Style-Specific Properties"
This section is a quick reference for all Oracle Composer tags. When you add Oracle Composer components to a page, default values are assigned to certain attributes. You can change these default values and define values for the remaining attributes in JDeveloper.
For information about adding these components to the page, see Section 19.1, "Designing Editable Pages Using Oracle Composer Components."
Note: The Property Inspector in JDeveloper displays certain extended metadata attributes under the Customization Attributes category. You can use these properties to provide additional metadata information. For more information, see the section "Extended Metadata Properties" in Oracle Fusion Middleware Fusion Developer's Guide for Oracle Application Development Framework. |
This section contains the following subsections:
Use the Page Customizable
component to enable page editing at runtime. The Page Customizable
component denotes the customizable part of a page and shows the Oracle Composer toolbar in Edit mode at runtime. When you enclose components within a Page Customizable
component, Oracle Composer is enabled in the application page at run time, allowing the user to customize and edit the components.
In large applications, where you want to enable runtime page editing on multiple pages, you can include the Page Customizable
component in the page template, somewhere in the top of the hierarchy. This way, all pages created using the template are editable at runtime.
Geometry Management
View mode: The Page Customizable
component can be stretched by a parent layout component that stretches its children, for example, a Panel Stretch Layout
or Panel Splitter
component. If the Page Customizable
component is stretched, it in turn stretches its child component to fill the space available to it. However, if the Page Customizable
component is not stretched, its size is determined by the child component.
Edit mode: The Page Customizable
component stretches its child component to fill the space available to it.
Attributes
Table B-1 describes the attributes of a Page Customizable
component.
Table B-1 Attributes of a Page Customizable Component
Attribute | Type | Supports EL | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is |
Appearance Attributes |
|||
sourceViewPosition |
String |
Yes |
The position of the Source view pane displaying components in a tree structure. Valid values are Alternatively, the Source Position submenu on the View menu on the Oracle Composer toolbar provides options to set this attribute at runtime. For more information, see the section, Section 17.5, "Editing Capabilities in Source View in Page Edit Mode.". |
sourceViewSize |
String |
Yes |
The height or width of the Source view pane in pixels. Use this to specify height if the Since the default for Alternatively, the resize handler on the edge of the Source view pane enables users to alter the height or width of the pane at runtime. |
toolbarLayout |
String |
Yes |
The elements to be displayed on the Oracle Composer toolbar. This attribute can take a space-separated list of elements. The built in strings the component recognizes are For more information about using this attribute, see Section 20.10, "Customizing the Oracle Composer Toolbar." |
view |
String |
Yes |
The default view in which to open a page in Oracle Composer. Available options are |
Style Attributes |
|||
styleClass |
String |
Yes |
The 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 |
String |
Yes |
The CSS styles to use for this component. This is intended for basic style changes. The |
Advanced Attributes |
|||
binding |
|
Supports only EL |
An EL reference that stores 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. |
sourceViewNodeAction |
String |
Yes |
The name of the JPSX file to be called if you want to display custom actions against task flows in the component navigator in Oracle Composer Source view. The For information about using this attribute, see Section 21.4, "Enabling Custom Actions that Display on Task Flows in the Component Navigator." |
allowLabel |
Boolean |
Yes |
Specifies whether label creation must be enabled in the Customization Manager. When This attribute is relevant only if you have configured sandbox support in your application. |
catalog |
String |
Yes |
The catalog to be used as the default one for the application page. Provide the catalog definition file name. For more information about using multiple resource catalogs, see Chapter 15, "Creating and Managing Resource Catalogs." |
Supported Facets
The Page Customizable
component provides an editor
facet, which is prepopulated with a Page Editor Panel
component. To ensure that Oracle Composer works properly, the editor
facet must contain the Page Editor Panel
component.
Use the Change Mode Button
or Change Mode Link
to enable switching to Edit mode of the page at runtime.
The Change Mode Link
and Change Mode Button
components share a common set of attributes. Table B-2 describes the attributes of a Change Mode Link
or Change Mode Button
component.
Table B-2 Attributes of a Change Mode Link or Change Mode Button Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
Yes |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is In a secured application, to enable the Edit link or button only for selected users based on specific criteria, you can specify an EL value for the Note: In a secured application, it is recommended that you check all users' privileges and enable the Edit link or button only for privileged users. Unauthenticated users who stumble into page Edit mode can change component properties. |
Behavior Attributes |
|||
immediate |
Boolean |
Yes |
Specifies whether data validation - client-side or server-side - must be skipped when events are generated by this component. When |
Advanced Attributes |
|||
binding |
or
|
Supports only EL |
An EL reference that stores the component instance in 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. |
If you do not want to use the Change Mode Link
or Change Mode Button
component, you can add your own button or link component and use the ChangeModeLink
or ChangeModeButton
API to enable the switching of the page mode.
Disabling Runtime Editing in Your Application Pages
To disable runtime editing of pages, you can revoke Edit privileges for users, or delete the Change Mode Link
or Change Mode Button
component from the page so that the user cannot navigate to the Edit mode of the page.
The Layout Customizable
component applies a predefined layout to its child components. It is a container component that enables end users to lay out its child components in several predefined ways. Use the Layout Customizable
component only to enable changing of the page layout at runtime. If you just want container components in which to layout components, but do not want to enable runtime layout changes, then it is recommended that you use ADF Faces layout components like Panel Stretch Layout
and Panel Group Layout
. It is recommended that you have just one Layout Customizable
on the page.
A Layout Customizable
component contains a direct child Panel Customizable
component and two facets with Panel Customizable
components by default to enable users to add content inside them at runtime. However, you can add any components inside the Layout Customizable
component and its facets. The content in the three Panel Customizable
components can be placed in different ways using predefined layouts. For more information, see the section, "Predefined Layout Types".
Table B-3 describes the attributes of a Layout Customizable
component.
Table B-3 Attributes of the Layout Customizable Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is The rendering of a component can also be defined at runtime using the Show Component and Hide Component options. |
type |
String |
Yes |
Specifies the layout to be used for the page. You can choose from a list of eight predefined layouts. For more information, see Table B-5. Default value is You can define customization restrictions on a |
Appearance Attributes |
|||
text |
String |
Yes |
Specifies the text to be displayed for the Change Layout menu. Use the For example:
|
accessKey |
Char |
Yes |
A character used to gain quick access to this button. For accessibility reasons, this functionality is not supported in screen reader mode. If the same access key appears in multiple input fields in the same page of output, the rendering user agent cycles among the elements accessed by the similar keys. Note that user agents are inconsistent about dealing with two links having same access key, and so the cycling behavior is dependent on what the user agent provides. This attribute is sometimes referred to as the "mnemonic". The character specified by this attribute must exist in the Note that the |
showIcon |
Boolean |
Yes |
Specifies whether the default Change Layout icon is visible or not. The default value is |
showLayoutChanger |
Boolean |
Yes |
Specifies whether the Change Layout icon or text must be displayed. The default value is When set to
|
showTypes |
String |
Yes |
Specifies the names of predefined layouts that must be displayed in the layout changer. Use this attribute to control the layout options displayed to users. You can provide a space-separated list of layout types. By default, all eight layouts are displayed when a user clicks the Change Layout icon or link. |
shortDesc |
String |
Yes |
The 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 2 truncates long tooltips. For form components, the |
Style Attributes |
|||
styleClass |
String |
Yes |
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 |
String |
Yes |
The CSS styles to use for this component. This is intended for basic style changes. The |
Behavior Attributes |
|||
binding |
|
Supports only EL |
An EL reference that stores the component instance in 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. For example: binding="#{yourManagedBean.Binding}" |
Supported Facets
Table B-4 describes the facets provided for a Layout Customizable
component.
Table B-4 Facets of the Layout Customizable Component
Name | Description |
---|---|
contentA |
Prepopulated with a |
contentB |
Prepopulated with a |
facetSeparator |
Content to be rendered once between each facet. |
separator |
Content to be rendered once between each of the other children. |
Predefined Layout Types
When you add a Layout Customizable
component to the page, three child Panel Cutsomizable
components are added by default; one direct child and two Panel Customizable
s in the two facets. However, you can replace the child Panel Customizable
components with any container components of your choice. When you select the layout type, the components in these Panel Customizable
s are arranged according to the layout type chosen.
Table B-5 describes the eight layouts that you can apply to your page or an area of the page at design time. To easily describe how components are laid out, let us assume the following:
The child Panel Customizable
of contentA
facet is called A.
The child Panel Customizable
of contentB
facet is called B.
The primary Panel Customizable
, which is a direct child of the Layout Customizable
, is called C.
Table B-5 Values for Type Attribute of Layout Customizable
Layout Type | Image Showing Content Arrangement |
---|---|
oneColumn |
![]() Note: In a |
threeColumn |
![]() |
threeColumnNarrow |
![]() |
twoColumn |
![]() |
twoColumnBottom |
![]() |
twoColumnNarrowLeft |
![]() |
twoColumnNarrowRight |
![]() |
twoColumnTop |
![]() |
Use the Panel Customizable
component as a container for page content that can be customized at runtime. You can add content inside a Panel Customizable
component at runtime using Oracle Composer's Resource Catalog. When you add child Show Detail Frame
components inside a Panel Customizable
, the Show Detail Frame
components provide runtime customization options for arranging or deleting components on the page.
Use this component only to perform runtime customizations on child components. If you just want a container to arrange components, then it is recommended that you use an ADF Faces container like Panel Group Layout
.
Geometry Management
The Panel Customizable
component can be stretched by a parent layout component that stretches its children, for example, a Panel Stretch Layout
or Panel Splitter
component. By setting the layout
attribute on the Panel Customizable
component to stretch
, the child component can be stretched to the size of the Panel Customizable
.
Table B-6 describes the attributes of a Panel Customizable
component.
Table B-6 Attributes of a Panel Customizable Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is The rendering of a component can also be defined at runtime using the Show Component and Hide Component options. |
halign |
String |
Yes |
Specifies the horizontal alignment of child components. You can set horizontal alignment on child components only if the Available values are |
valign |
String |
Yes |
Specifies the vertical alignment of child components. You can set vertical alignment on child components only if the Available values are |
shortDesc |
String |
Yes |
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 2 truncates long tooltips. |
layout |
String |
Yes |
Specifies how the children of the Available options are Depending on the value of the
|
Style Attributes |
|||
styleClass |
String |
Yes |
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 |
String |
Yes |
The CSS styles to use for this component. This is intended for basic style changes. The |
Behavior Attributes |
|||
allowAction |
Boolean |
Yes |
Determines whether this component allows addition of child components, dragging and dropping Available values are Note: You can also set this attribute while defining component security in the application's |
showEditAction |
Boolean |
Yes |
While in Edit mode, in Design view, renders an Edit icon on the This is relevant only in an Oracle Composer-enabled page, that is, if the |
showSplitAction |
Boolean |
Yes |
In Design view of a page in Edit mode, renders the Add Box icons on the This is relevant only in an Oracle Composer-enabled page, that is, if the Although the default value for this attribute is |
showTabAction |
Boolean |
Yes |
In Design view of a page in Edit mode, renders the Add a Tab Set or a Tab icon on the This is relevant only in an Oracle Composer-enabled page, that is, if the |
Advanced Attributes |
|||
binding |
|
Supports only EL |
An EL reference that stores the component instance in 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. |
Supported Facets
The Panel Customizable
component supports a separator
facet, which can be used to render content once between each of its child components.
Disabling the Edit Option on a Panel Customizable Component
When you switch to the Edit mode of a page at runtime, in Design view you will notice an Edit icon on all Panel Customizable
or Box
components that can be edited. To disable property editing on a specific Panel Customizable
or Box
component in Design view, you must set the showEditAction
attribute on the component to false
at design time. The Edit icon is no longer displayed on the component in Design view. However, users can still select such a component in Source view and edit its properties.
Add Show Detail Frame
components inside Panel Customizable
components to enable runtime customizations like move, minimize, restore, and delete of child components. You can move Show Detail Frame
components only if they are added inside a Panel Customizable
component.
Geometry Management
A Show Detail Frame
component can be stretched by a parent layout component that stretches its children, for example, Panel Customizable
.
A Show Detail Frame
component stretches its child component to fill the height and width available to it. It is recommended that you add only one child component inside a Show Detail Frame
component. However, if you have more than one child component, the first child component is stretched to the height and width of the Show Detail Frame
's content area and subsequent child components are ignored.
The resize handler at the lower right corner of a Show Detail Frame
enables you to resize the component vertically. From then on, the Show Detail Frame
cannot be stretched by its parent.
Table B-7 describes the attributes of a Show Detail Frame
component.
Table B-7 Attributes of a Show Detail Frame Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is The rendering of a component can also be defined at runtime using the Show Component and Hide Component options. |
text |
String |
Yes |
A title for the You can change the style of this text using the |
icon |
String |
Yes |
If you decide to add an icon on the header of the For example: icon="http://source-pc/images/accessability.gif" Note: An image that is stored at the document root does not require a full path. For example: icon="detail.gif" |
Appearance Attributes |
|||
shortDesc |
String |
Yes |
The 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 2 truncates long tooltips. For form components, the |
background |
String |
Yes |
Working with the skin CSS, provides a means of applying a different look and feel for this Available values are |
displayHeader |
Boolean |
Yes |
Indicates whether the header of the The default value is If you choose to set |
displayShadow |
Boolean |
Yes |
Specifies whether a shadow is cast by the The default value is |
expansionMode |
String |
Yes |
The default state of the Available values are |
Actions Attributes |
|||
displayActions |
String |
Yes |
Specifies when seeded interactions are displayed. Available options are |
inheritGlobalActions |
Boolean |
Yes |
This attribute is of significance if you add child custom action components, and the attribute specifies whether the global The default value is For information about global custom actions, see Section 21.3.2.2, "Defining Custom Actions at the Global Level." |
showMoveAction |
String |
Yes |
Specifies whether the Move action is displayed in the Actions menu. Available values are |
showRemoveAction |
String |
Yes |
Renders a Remove icon on the Available values are Note: In page Edit mode, the Remove icon appears regardless of this setting, provided other restrictions have not been applied. |
showResizer |
String |
Yes |
Specifies whether a resize handle is displayed on the lower right corner of the Available values are |
showMinimizeAction |
String |
Yes |
Specifies whether the minimize action is displayed on the header. Available values are |
showEditAction |
Boolean |
Yes |
While in Edit mode, in Design view, renders an Edit icon on the This is relevant only in an Oracle Composer-enabled page, that is, if the |
Style Attributes |
|||
contentStyle |
String |
Yes |
The CSS style to apply to the Th CSS styles in this attribute are commonly used to define the height and background color of the Note: If the |
styleClass |
String |
Yes |
The 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 |
String |
Yes |
The CSS styles to use for this component. This is intended for basic style changes. The |
headerStyle |
String |
Yes |
The CSS style to apply to the Th CSS styles in this attribute are commonly used to define the font, size, and color of the title text. |
Behavior Attributes |
|||
partialTriggers |
String |
Yes |
The IDs of the components that should trigger a partial update. This component listens on the trigger components. If a trigger component receives an event that causes it to update in some way, this component requests 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 - " |
disclosureListener |
|
Yes |
A method reference to a disclosure listener. A disclosure event is fired when the user expands or collapses the |
stretchContent |
String |
Yes |
Specifies whether the Available options are You can use the If you select The default height of the If you select |
Advanced Attributes |
|||
binding |
|
Supports only EL |
An EL reference that stores the component instance in 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 |
|
Yes |
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 event might include the width of a column that supported client-side resizing. |
selectChild |
String |
Yes |
Specifies whether runtime selection and customization are enabled on child components. This is relevant only in an Oracle Composer-enabled page, that is, if the Default value is If you select |
Other Attributes |
|||
helpTopicID |
String |
Yes |
Specifies a Help topic ID that is used to link to a custom Help topic from the component. To link to a Help topic from your |
Supported Facets
Table B-8 describes the facets available on a Show Detail Frame
component.
Table B-8 Show Detail Frame Facets
Name | Description |
---|---|
titleBarAction |
Used if an action is to be associated with title of the |
additionalActions |
Used if some additional actions are to be added to the Actions menu available on the |
Displaying Child Component Properties Along with Show Detail Frame Properties
When you switch to the Edit mode of a page at runtime, in Design view you will notice an Edit icon on all Show Detail Frame
components that can be edited. Clicking this icon invokes the Component Properties dialog in which users can edit the Show Detail Frame
's properties. If you want the Component Properties dialog to display the Show Detail Frame
's properties and its child component's properties, then you can use the custom attribute, sdf_selection_rule
.
In JDeveloper, right-click the Show Detail Frame
component and select Insert inside cust:showDetailFrame, JSF core, and then Attribute. In the Insert Attribute dialog, specify sdf_selection_rule
as the name and sdf_for_edit_mode_only
as the value. In Source mode, this attribute appears as shown in the following example:
<cust:showDetailFrame text="showDetailFrame 1" id="sdf1"> <f:attribute name="sdf_selection_rule" value="sdf_for_edit_mode_only"/> </cust:showDetailFrame>
Disabling the Edit Option on a Show Detail Frame Component
When you switch to the Edit mode of a page at runtime, in Design view you will notice an Edit icon on all Show Detail Frame
components that can be edited. To disable property editing on a specific Show Detail Frame
or Movable Box
component in Design view, then you can do this by setting the showEditAction
attribute on the component to false
at design time. The Edit icon is no longer displayed on the component when you enter the Edit mode of the page at runtime. However, users can still select such a component in Source view and edit its properties.
Use Custom Action
components to trigger navigational flow in a task flow when a region is included inside a Show Detail Frame
component. You can define custom actions corresponding to the ADFc outcomes of the task flows. At runtime, these custom actions are displayed on the Show Detail Frame
header as icons, menu options, or both. A Custom Action
must always be defined as a child component of a Show Detail Frame
and is useful only when the Show Detail Frame
also contains a task flow as its child component.
You can add as many Custom Action
components as there are ADFc outcomes in the task flow. If you add a Custom Action
attribute without a corresponding ADFc outcome, or if the action
attribute value does not match an ADFc outcome defined on the view that is currently being displayed by the task flow, then that action is not displayed at runtime.
Note: You can also define custom actions forShow Detail Frame components at the global level. For more information, see Section 21.3.2, "How to Enable Custom Actions on a Show Detail Frame Enclosing a Task Flow." |
Table B-9 describes the attributes of a Custom Action
component.
Table B-9 Attributes of a Custom Action Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
action |
String |
Yes |
Specifies the action outcome defined for the task flow. The value of this attribute must match the relevant ADFc outcome in the task flow definition file. |
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is The rendering of a component can also be defined at runtime using the Show Component and Hide Component options. |
text |
String |
Yes |
Represents the text of the menu item link. This is applicable for a custom action rendered as a menu item link. |
Appearance Attributes |
|||
icon |
String |
Yes |
For a custom action rendered as a toolbar link, specifies the icon to be rendered on the chrome. For a custom action rendered as a menu item link, this represents the icon to be displayed against the menu item text. This attribute supports these various types of URIs:
As icon does not allow alternative text to be provided for the image, in order to create an accessible product an icon must only be used when its use is purely decorative. |
shortDesc |
String |
Yes |
Provides 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 2 truncates long tooltips. For form components, the This is applicable only for a custom action rendered as a toolbar icon. |
location |
String |
Yes |
Determines whether the custom action is rendered as a toolbar icon or a menu item link. Available values are |
Other Attributes |
|||
actionComponent |
String |
Yes |
Specifies the ID of the command component that must be queued for the action event. When the For more information, see Section 21.3.2.3, "Configuring Custom Actions that Display Task Flow Views in a Separate Browser Window." |
Use the Show Property
component to display an attribute or parameter in a custom property panel at runtime. Use one Show Property
component for each attribute or parameter that you want to display to users at runtime.
For more information about the Show Property
component, see Section 20.3.6, "How to Display Properties and Parameters in a Custom Property Panel."
Table B-10 describes the new attributes of a Show Property
component.
Table B-10 Attributes of a Show Property Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes: |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is The rendering of a component can also be defined at runtime using the Show Component and Hide Component options. |
attributeType |
String |
Yes |
Specifies the property type. Supported values are |
value |
String |
Yes |
Specifies the current value of the property. If the EL binding for the "value" points to a bean property with a getter but no setter, and this is an editable component, the component will be rendered in read-only mode. |
label |
String |
Yes |
Specifies the label of the component. If you want the label to appear above the control, use a |
Data Attributes: |
|||
selectItem |
Specifies the list of values to be displayed if |
||
Appearance Attributes: |
|||
columns |
Int |
Yes |
Specifies the size of the text control specified by the number of characters shown. The number of columns is estimated based on the default font size of the browser. |
rows |
Int |
Yes |
Specifies the height of the text control specified by the number of characters shown. The default value is 1, which generates a one-row input field. The number of rows is estimated based on the default font size of the browser. |
shortDesc |
String |
Yes |
Provides 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 2 truncates long tooltips. For form components, the This is applicable only for a custom action rendered as a toolbar icon. |
simple |
Boolean |
Yes |
A boolean value that controls whether the component provides label support; when set to "true", the component will not display the label (these may be ignored: label, labelAndAccessKey, accessKey, showRequired, help facet) and may use simpler layout primitives. One of the usecases can be when the component is used in repeatable elements like in table, for-each etc., where label is not required. |
unselectedLabel |
Specifies the label for the option that represents a value of null, meaning nothing is selected. If |
||
Behavior Attributes: |
|||
required |
Boolean |
Yes |
Specifies whether a non-null, non-empty value must be entered. If |
autoSubmit |
Boolean |
Yes |
Specifies an attribute which if set to TRUE on a form element, the component will automatically submit when an appropriate action takes place (a click, text change, etc.). Since |
disabled |
Boolean |
Yes |
Specifies whether the property should be shown as disabled. This is useful if the |
valueChangeListener |
javax.faces.el.MethodBinding |
EL only |
Specifies a method reference to a value change listener. |
Advanced Attributes: |
|||
binding |
|
Supports only EL |
Specifies an EL reference that stores the component instance in 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. |
clientComponent |
Boolean |
Yes |
Specifies whether a client-side component will be generated. A component may be generated whether or not this flag is set, but if client Javascript requires the component object, this must be set to true to guarantee the component's presence. Client component objects that are generated today by default may not be present in the future; setting this flag is the only way to guarantee a component's presence, and clients cannot rely on implicit behavior. However, there is a performance cost to setting this flag, so clients should avoid turning on client components unless absolutely necessary. |
componentId |
If you use the |
||
showELBuilder |
Boolean |
Yes |
Specifies whether to display the EL builder for the property. |
showResourceEditor |
Boolean |
Yes |
Specifies whether to display the resource string editor for the property. However, this option is enabled only if you have configured resource string editing in the application and the property is of type String. For more information, see Section 21.12, "Configuring Runtime Resource String Editing." |
taskFlowId |
String |
Yes |
If |
taskFlowParam |
String |
Yes |
If |
validator |
String |
Yes |
Specifies a method reference to a validator method. |
Supported Facets
The Show Property
component supports a customLink
facet, which can be used to include a Commamd Menu Item
. The Command Menu Item
specified in this facet appears as a custom link in the dropdown next to the property field, along with Resource String editor and EL Builder.
This section describes the various files that you can modify to extend Oracle Composer capabilities. While some files, for example the Oracle Composer extension file, pe_ext.xml
, are entirely relevant to Oracle Composer only, others are ADF configuration files that can take entries for Oracle Composer-specific configurations.
This section includes the following topics:
You can create a pe_ext.xml
file and add elements in it to register new Oracle Composer add-ons and custom property panels, selectively render panels, register event handlers, and define property filters. This file is not available by default when you add Oracle Components to a page. You can create this file in the META-IN
F directory in your ViewController
project; for example, in the APPLICATION_HOME
\ViewController\src\META-INF
directory. This section describes the different elements of the Oracle Composer extension file schema and explain when you may want to use the schema elements.
This section contains the following subsections:
Use the addon-config
element to include entries for new Oracle Composer add-ons and custom property panels. For example, to add a new About button to your page that invokes a panel displaying information about your application, you must first create a task flow containing the information and then register this task flow in the pe_ext.xml
file. Oracle Composer add-ons declared inside the addon-config
element are configured in the adf-config.xml
file, whereas custom property panels declared within the addon-config
element are configured within the property-panels
element in the extension file itself.
For information about configuring add-ons in adf-config.xml
, see Section B.2.2.2, "addon-panels." For information about configuring custom property panels using the property-panels
element, see Section B.2.1.2, "property-panels."
Insert the addon-config
element within the pe-extension
tag. You can add only one addon-config
element in the XML file. Within the addon-config
element you can have a panels
element to define add-ons.
panels
Use the panels
element to register new add-ons or property panels in Oracle Composer. Add the panels
element within the addon-config
element. You can have only one panels
element in an extension file, and all custom panels must be defined inside this element.
panel
Use panel
elements to define individual add-ons and property panels to display to users. Within the panels
element you can insert any number of individual panel
elements that define the add-ons or property panels to be displayed in Oracle Composer. You must have one panel
element for every add-on or property panel you want to display.
Table B-11 describes the attributes of the panel
element.
Table B-11 panel Element Attributes
Attribute | Description |
---|---|
|
An identifier that is used while referencing the new add-on in |
|
The title to display on the button used to invoke the task flow in Oracle Composer. You can use EL for this property to show a localized title. For custom property panels, the title to display on the new tab for that panel. |
|
The icon that appears next to the title on the button. This is optional. |
|
The ID of the task flow that defines the add-on or property panel. |
|
A help topic ID that links to a custom help topic from the add-on or property panel. This is optional. |
When a panel
element is deleted from the file, that add-on or property panel is not displayed on the page.
The following example shows how to use the addon-config
, panels
, and panel
elements:
<addon-config> <panels> <panel name="oracle.fod.custom.panel" title="About FOD" icon="adf/webcenter/images/about.gif" taskflow-id="/WEB-INF/about-fod.xml#about-fod" /> </panels> </addon-config>
For more information about add-ons, see Section 20.2, "Creating Oracle Composer Add-Ons."
Optionally, to register an event handler for a specific add-on panel, you can also add an event-handlers
element inside a panel
element, as shown in the following example:
<event-handlers> <event-handler event="close"> oracle.fod.custom.TaskFlowEventHandler </event-handler> </event-handlers>
The XML code is the same as for any generic event handler. For more information, see Section B.2.1.4, "event-handlers."
Use the property-panels
element to register custom property panels. Add the property-panels
element within the addon-config
element. For information about custom property panels, see Section 20.3, "Creating Custom Property Panels." You can have only one property-panels
element in an extension file.
property-panel
Use the property-panel
element to define a custom property panel to display for a particular component in Oracle Composer. Within the property-panels
element you can insert any number of individual property-panel
elements to define custom property panels to display as tabs in the Component Properties dialog. To specify the component or task flow for which you want to register a custom property panel, you must add a component
or taskflow-id
element respectively within the property-panel
.
Table B-12 describes the property-panel
element attributes.
Table B-12 property-panel Element Attributes
Attribute | Description |
---|---|
|
An identifier for the custom property panel you want to display in the Component Properties dialog. |
|
Whether this panel is displayed to users in the Component Properties dialog. This can take an EL value. |
component
Use the component
element to specify the fully qualified class name of the component for which you are registering the custom property panel. You can have only one component
inside a property-panel
element.
taskflow-id
Use the taskflow-id
element to specify the name of the task flow for which you are registering the custom property panel. You can have only one taskflow-id
inside a property-panel
element.
panel
Use the panel
element to specify a custom property panel to display as a tab in the Component Properties or Page Properties dialog for the component. Within a property-panel
element, you can have any number of panel
elements. Table B-13 describes the attributes of a panel
element.
Table B-13 panel Element Attributes
Attribute | Description |
---|---|
|
Name with which you declared the panel in the |
|
Whether the custom property panel must be rendered or not. |
|
Parameters to be passed to the implementing task flow. Takes an EL only and must return a |
When a panel
element is deleted from the file, that property panel is no longer displayed in the Component Properties dialog.
The following example shows how to register a custom property panel for a Command Button
component:
<property-panels>
<property-panel name="cmdbtn">
<component>oracle.rich.CommandButton</component>
<panel name="prop.panel.cmdbtn"/>
</property-panel>
</property-panels>
The following example shows how to register a custom property panel for a task flow:
<property-panels>
<property-panel name="dashboard">
<taskflow-id>/WEB-INF/dashboard-taskflow#prop-panel</taskflow-id>
<panel name="dashboard.prop-panel" />
</property-panel>
</property-panels>
Use the lov-config element to register a custom List of Values or picker for a task flow parameter. Add the lov-config
element directly under the pe-extension
tag. You can have only one lov-config
element in an extension file. Within this element, you can add a task-flow-definition
element for each task flow that you want to register for LOV usage. Add an input-parameter-definition
for each parameter that provides an LOV. Use enumeration
elements to list the LOV options for a parameter, as shown in the following example:
<lov-config> <task-flow-definition taskflow-id="/WEB-INF/employee-details.xml#employee-details"> <input-parameter-definition> <name>Designation</name> <enumeration> <item> <name>Accounts Manager</name> <value>Accounts Manager</value> <description>Accounts Manager</description> </item> <item> <name>Accounts Assistant</name> <value>Accounts Assistant</value> <description>Accounts Assistant</description> </item> <item> <name>Payroll Executive</name> <value>Payroll Executive</value> <description>Payroll Executive</description> </item> <item> <name>Senior Manager</name> <value>Senior Manager</value> <description>Senior Manager</description> </item> </enumeration> </input-parameter-definition> </task-flow-definition></lov-config>
For more information, see Section 20.5, "Configuring Custom LOVs or Pickers for Task Flow Parameters."
Use the event-handlers
element to register handlers for events generated by Oracle Composer. Add the event-handlers
element directly under the pe-extension
tag. You can have only one event-handlers
element under pe-extension
.
Alternatively, to register an event handler for a specific Oracle Composer add-on panel, you can also add an event-handlers
element inside a panel
element under the addon-config
section. For more information, see Section B.2.1.1, "addon-config."
event-handler
Use the event-handler
element to register an event handler in Oracle Composer. Within event-handlers
you can have any number of event-handler
elements to register handlers for save, close, deletion, addition, and selection events. For example, if you have implemented the processSave
method in a Java class called SaveHandler
to perform a specific action when a Save event is invoked, then you can register that implementation in Oracle Composer by adding an event-handler
entry in the pe_ext.xml
file as follows:
<event-handlers>
<event-handler event="save">view.SaveHandler</event-handler>
</event-handlers>
For information about configuring event handlers, see Section 20.6, "Configuring Event Handlers for Oracle Composer UI Events."
Use the drop-handlers
element to register drop handlers to handle addition of components to the page from the Resource Catalog. Add the drop-handlers
element directly under the pe-extension
tag. You can have only one drop-handlers
element in an extension file.
drop-handler
Use the drop-handler
element to register a drop handler in Oracle Composer. Within drop-handlers
you can have any number of drop-handler
elements to register drop handlers that you created in the application. For example, if you created a drop handler called TestDropHandler
to handle addition of XML components on the page, then you can register that implementation in Oracle Composer by adding a drop-handler
entry in the pe_ext.xml
file as follows:
<drop-handlers> <drop-handler>test.TestDropHandler</drop-handler> </drop-handlers>
For more information, see Section 20.7, "Configuring Drop Handlers in the Resource Catalog."
Use the filter-config
element to define property filters for components that can be edited at runtime. For a selected component, the Component Properties dialog displays properties that can be edited. If you do not want to expose all properties for editing, you can filter specific properties so that they are not displayed in the Component Properties dialog. You can specify global-level filters to filter common attributes across all components, or you can define tag-level filters to filter properties for a particular component only.
Add the filter-config
element directly under the pe-extension
tag. You can have only one filter-config
element in an extension file.
For information about property filters, see Section 20.8, "Defining Property Filters."
global-attribute-filter
Use the global-attribute-filter
element to filter specific properties across all components. You can have only one global-attribute-filter
element in the extension file. Within this element you can include any number of attribute
elements to define property filters for components from different libraries.
taglib-filter
Use the taglib-filter
element to define property filters for components within a particular library. You can include multiple taglib-filter
elements to filter properties for components in different libraries. Within this element you can include tag
elements for every component belonging to the library.
Table B-14 describes the attribute the taglib-filter
element can take.
Table B-14 tag Element Attribute
Attribute | Description |
---|---|
|
Namespace of the tag library containing the component whose properties you want to filter. |
tag
Use the tag
element to specify a component whose properties you want to filter. You can include multiple tag
elements within a taglib-filter
element. Within this element you can include attribute
elements for all properties you want to filter.
Table B-15 describes the attribute the tag
element can take.
Table B-15 tag Element Attribute
Attribute | Description |
---|---|
|
Name of the component whose properties you want to filter, for example, |
attribute
Use the attribute
element to specify a property to filter either across all components or for the specified component only. To define global-level filters, you must include attribute
elements inside the global-attribute-filter
. To define property filters for a particular component, you must include attribute
elements inside the taglib-filter
element.
Table B-16 describes the attribute the attribute
element can take.
Table B-16 attribute Element Attributes
Attribute | Description |
---|---|
|
Name of the property you want to filter. |
|
Whether the property must be filtered or not. Takes a value of |
The following example shows how you can define global and component-level property filters:
<filter-config> <global-attribute-filter> <attribute name="accessKey" /> <attribute name="attributeChangeListener" /> <attribute name="autoSubmit" /> <attribute name="binding" /> </global-attribute-filter> <taglib-filter namespace="http://xmlns.oracle.com/adf/faces/rich"> <tag name="commandButton"> <attribute name="text" /> <attribute name="icon" /> </tag> </filter-config>
Use the elbuilder-config
element to configure custom values for the expression builder. The expression builder invoked from Oracle Composer's Component Properties dialog enables users to specify EL values for component properties. Users can either select for a set of predefined values or enter an EL value in the text box. You can customize the expression builder to provide more options to users. For more information, see Section 20.4, "Extending the Expression Builder."
Add the elbuilder-config
element directly under the pe-extension
tag. You can have only one elbuilder-config
element in an extension file.
selector
Use selector
elements to define and include custom options, as shown in the following example:
<elbuilder-config> <!-- define selector --> <selector id="CustomELParameter"> view.CustomELParameter </selector> <!-- include selector --> <selectors> <selector id="CustomELParameter"/> </selectors> </elbuilder-config>
You can include many selector
elements inside a selectors
element.
Example B-1 shows a sample pe_ext.xml
file with different elements used to extend Oracle Composer capabilities.
Example B-1 Sample pe_ext.xml File
<pe-extension xmlns="http://xmlns.oracle.com/adf/pageeditor/extension"> <addon-config> <!-- Oracle Composer add-on panels configuration --> <panels> <panel name="oracle.fod.custom.panel" title="About FOD" icon="adf/webcenter/images/about.gif" taskflow-id="/WEB-INF/about-fod.xml#about-fod"/> </panels> <!-- Oracle Composer property panels configuration --> <property-panels> <property-panel name="cmdbtn"> <component>oracle.rich.CommandButton</component> <panel name="prop.panel.cmdbtn" /> </property-panel> </property-panels> </addon-config> <Save event handler configuration --> <event-handlers> <event-handler event="save">view.SaveHandler</event-handler> </event-handlers> <!-- Test drop handler configuration --> <drop-handlers> <drop-handler>test.TestDropHandler</drop-handler> </drop-handlers> <!-- Property filter configuration. Properties defined here are not displayed in Oracle Composer. --> <filter-config> <global-attribute-filter> <attribute name="accessKey" /> <attribute name="attributeChangeListener" /> <attribute name="autoSubmit" /> <attribute name="binding" /> </global-attribute-filter> <taglib-filter namespace="http://xmlns.oracle.com/adf/faces/rich"> <tag name="commandButton"> <attribute name="text" /> <attribute name="icon" /> </tag> </filter-config> </pe-extension>
The adf-config.xml
file specifies application-level settings that are usually determined at deployment and are often changed at runtime. This file is created when you create your application and is located in the ADF META-INF
folder under Descriptors
in the Application Resources panel. The following example shows the minimal adf-config.xml
file created when you create a WebCenter application:
<?xml version="1.0" encoding="windows-1252" ?> <adf-config xmlns="http://xmlns.oracle.com/adf/config" xmlns:adf="http://xmlns.oracle.com/adf/config/properties"> <adf:adf-properties-child xmlns="http://xmlns.oracle.com/adf/config/properties"> <adf-property name="adfAppUID" value="Application4-2138"/> </adf:adf-properties-child> </adf-config>
When you add the Page Customizable
component to a page, certain required configurations are added to the adf-config.xml
file.
You must update the adf-config.xml
file when you perform tasks such as registering new add-ons and custom property panels, selectively rendering add-ons, creating customization layers, enabling and disabling the Oracle Composer sandbox, creating custom Resource Catalogs, and disabling Source view. The following sections describe the various adf-config.xml
elements used for Oracle Composer-specific configurations.
This section contains the following subsections:
Use the page-editor-config
element to include Oracle Composer-specific configurations such as add-on panel registration, sandbox configuration, resource string editor configuration, and so on. Add the page-editor-config
element within the adf-config
tag as shown in the following example:
<adf-config xmlns="http://xmlns.oracle.com/adf/config" xmlns:adf="http://xmlns.oracle.com/adf/config/properties" xmlns:mdsC="http://xmlns.oracle.com/adf/mds/config"> . . . <page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config"> </page-editor-config> </adf-config>
Use the addon-panels
element to register custom add-ons and property panels in Oracle Composer. Insert the addon-panels
element within the page-editor-config
element. You can have only one addon-panels
element in the file. Within this you can have any number of addon-panel
elements to register custom panels. For more information about Oracle Composer add-ons and property panels, see Section 20.2, "Creating Oracle Composer Add-Ons" and Section 20.3, "Creating Custom Property Panels."
addon-panel
Use an addon-panel
element to register an add-on in the adf-config.xml
file. An addon-panel
element must only be included inside the addon-panels
element. You can have any number of addon-panel
elements to register custom panels.
The following example shows how you can use addon-panels
and addon-panel
elements to register a new add-on:
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config">
<addon-panels>
<!-- Page Properties add-on -->
<addon-panel name="oracle.adf.pageeditor.addonpanels.page-settings" />
<!-- Page Reset add-on -->
<addon-panel name="oracle.adf.pageeditor.addonpanels.page-reset" />
<addon-panel name="oracle.fod.custom.panel" />
</addon-panels>
. . .
</page-editor-config>
The addon-panel
element also supports the rendered
attribute. This attribute can take an EL value and specifies whether the panel must be rendered in Oracle Composer or not.
When registering custom add-ons, you must also include entries for the default add-ons. If the default add-ons are not registered, then only your custom add-on is available in Oracle Composer.
The addon-panel
element supports the following parameters:
rendered: Use to specify whether the add-on must be rendered or not. The rendered
attribute can take true
, false
, or an EL value. Use this attribute to display an add-on conditionally based on specific criteria.
parameters: Use to declaratively pass parameters to the add-on task flow. The parameters
attribute takes an EL value as shown in the following example:
<addon-panels>
<addon-panel name="oracle.adf.pageeditor.addonpanels.customization-manager" parameters="#{AppUtilBean.customizationManagerParams}"/>
. . .
</addon-panels>
where AppUtilBean
provides the logic to pass parameters to the add-on task flow.
Use the sandbox-namespaces
element to register namespaces for all metadata for which you want to enable sandbox creation at runtime. For more information about enabling sandbox creation, see Section 22.2.1, "How to Enable Oracle Composer Sandbox Creation."
Insert the sandbox-namespaces
element within the adf-config
element. The following example shows how to use the sandbox-namespaces
element:
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config"> . . . <sandbox-namespaces> <namespace path="/pages"/> <namespace path="/pageDefs"/> </sandbox-namespaces> </page-editor-config>
When creating customization layers in your application, use the session-options-factory
element to register the ComposerSessionOptionsFactory
implementation with Oracle Composer. This class contains the logic to save customizations in different layers based on the specified criteria. For more information, see Section 22.3, "Adding Customization Layers to View and Edit Modes: Example."
The following example shows how to register a class named AppsSessionOptionsFactoryImpl
:
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config"> . . . <session-options-factory>view.AppsSessionOptionsFactoryImpl</session-options-factory> </page-editor-config>
Use the rcv-config
element to register custom Resource Catalogs with Oracle Composer and to register the ResourceCatalogSelector
implementation when using multiple Resource Catalogs.
If you want to display a custom Resource Catalog to users in place of the default one, you must first create a catalog definition file with the required content and then register this catalog definition in the Oracle Composer extension file and adf-config.xml
file. The custom Resource Catalog is then displayed when a user clicks an Add Content button on the page. For more information, see Section 15.2, "Creating a Custom Resource Catalog."
Insert the rcv-config
element within the adf-config
tag. The following example shows how you can use the rcv-config
element to register a custom catalog called users-catalog
:
<adf-config xmlns="http://xmlns.oracle.com/adf/config" xmlns:adf="http://xmlns.oracle.com/adf/config/properties" xmlns:mdsC="http://xmlns.oracle.com/adf/mds/config"> . . . <rcv-config xmlns="http://xmlns.oracle.com/adf/rcs/viewer/adf-config"> <default-catalog catalog-name="users-catalog"/> </rcv-config> </adf-config>
You can also configure multiple Resource Catalogs with Oracle Composer so that different catalogs are displayed to different users depending on the specified criteria. When configuring multiple Resource Catalogs, use the rcv-config
element with a catalog-selector
element to register the ResourceCatalogSelector
implementation, which contains the logic for selecting a Resource Catalog.
The following example shows how you can use the rcv-config
element to register a ResourceCatalogSelector
implementation called CatalogSelector
:
<adf-config xmlns="http://xmlns.oracle.com/adf/config" xmlns:adf="http://xmlns.oracle.com/adf/config/properties" xmlns:mdsC="http://xmlns.oracle.com/adf/mds/config"> . . . <rcv-config xmlns="http://xmlns.oracle.com/adf/rcs/viewer/adf-config"> <catalog-selector class-name="webcenter.CatalogSelector"/> <default-catalog catalog-name="default-catalog"/> </rcv-config> </adf-config>
Use the customizableComponentsSecurity
element to apply restrictions on Show Detail Frame
actions. Insert the customizableComponentsSecurity
element within the adf-config
tag.
Within the customizableComponentsSecurity
element, you can specify the enableSecurity
, actionsCategory
, actions
, and custom-actions
elements.
enableSecurity
Use the enableSecurity
element to override the security inheritance behavior on Show Detail Frame
actions. This element can take a value of true
or false
. If set to true
, then the ability for a user to modify a component is first determined from the page permissions and then adjusted according to the current set of actions defined for that type of permission. If set to false
, then all actions are available to users. A user's page permissions and actions configured in adf-config.xml
are ignored.
actionsCategory
Use the actionsCategory
element to apply restrictions on a group of Show Detail Frame
actions simultaneously. Within the actionsCategory
element, you can have actionCategory
elements for the supported categories. For more information about action categories, see Section 23.5.2, "Defining Security at the Actions Category Level."
The following example shows how actionsCategory
can be used:
<adf-config xmlns="http://xmlns.oracle.com/adf/config" xmlns:adf="http://xmlns.oracle.com/adf/config/properties" xmlns:mdsC="http://xmlns.oracle.com/adf/mds/config"> . . . <cust:customizableComponentsSecurity xmlns="http://xmlns.oracle.com/adf/faces/customizable/config"> <cust:enableSecurity value="true"/> <cust:actionsCategory> <cust:actionCategory name="personalizeActionsCategory" value="false"/> <cust:actionCategory name="editActionsCategory" value="true"/> </cust:actionsCategory> <cust:actions> . . . </cust:actions> </cust:customizableComponentsSecurity> </adf-config>
actions
Use the actions
element to apply restrictions on individual actions. Within each actions element, you can have action
elements for all supported actions.
The following example shows how actions
can be used:
<adf-config xmlns="http://xmlns.oracle.com/adf/config" xmlns:adf="http://xmlns.oracle.com/adf/config/properties" xmlns:mdsC="http://xmlns.oracle.com/adf/mds/config"> . . . <cust:customizableComponentsSecurity xmlns="http://xmlns.oracle.com/adf/faces/customizable/config"> <cust:enableSecurity value="true"/> <cust:actionsCategory> . . . </cust:actionsCategory> <cust:actions> <cust:action name="showMinimizeAction" value="true"/> <cust:action name="showMoveAction" value="false"/> </cust:actions> </cust:customizableComponentsSecurity> <adf-config>
For more information about applying action-level restrictions, see Section 23.5, "Applying Action-Level Restrictions on Panel Customizable and Show Detail Component Actions."
custom-actions
Use the custom-actions
element to define custom actions to display along with the other Show Detail Frame
actions. You must add only one custom-actions
element inside the customizableComponentsSecurity
section. Within this you can add any number of custom-action
elements to define individual custom actions.
Note: Alternatively, you can add acustom-actions element inside an adf-config-child element instead of inside the customizableComponentsSecurity section. |
For more information about custom actions, see Section 21.3.2, "How to Enable Custom Actions on a Show Detail Frame Enclosing a Task Flow."
When defining type-level application customization restrictions on components, use the mds-config
element to register a standalone XML file describing the restrictions to be applied on specific components. For information about applying type-level restrictions, see Section 23.1.1, "How to Define Type-Level Customization Policies."
Insert the mds-config
element within the adf-config
tag. You can add the mds-config
element as follows:
<mds-config xmlns="http://xmlns.oracle.com/mds/config"> <type-config> <standalone-definitions> <file>Directory_Name/standalone.xml</file> </standalone-definitions> </type-config> </mds-config>
Use a resource-string-editor
element to enable resource string editing in your application. Insert the resource-string-editor
element within the page-editor-config
section, as shown in the following example:
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config"> . . . <resource-string-editor> <enabled>true</enabled> </resource-string-editor> </page-editor-config>
For more information, see Section 21.12, "Configuring Runtime Resource String Editing."
Use the enable-source-view
element to enable or disable Source view in Oracle Composer. Insert the enable-source-view
element within the page-editor-config
section. Source view is enabled by default in Oracle Composer. You can disable it by setting enable-source-view
to false
, as shown in the following example:
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config"> . . . <enable-source-view>false</enable-source-view> </page-editor-config>
For more information, see Section 21.8, "Disabling Source View for the Application."
Use the enable-zoom
element to enable or disable the capability to zoom into task flows in Oracle Composer. Insert the enable-zoom
element within a source-view
tag in the page-editor-config
section. Task flow zoom is enabled by default in Oracle Composer. You can disable it by setting enable-zoom
to false
, as shown in the following example:
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config"> . . . <source-view> <enable-zoom>false</enable-zoom> </source-view> </page-editor-config>
For more information, see Section 21.9, "Disabling Task Flow Zoom Capability."
Use this to configure the change manager to be used for persisting changes made in Oracle Composer. Insert the persistent-change-manager
element within the adf-faces-config
section. You must set persistent-change-manager
to MDSDocumentChangeManager
as follows if you want to persist application customizations to MDS:
<adf-faces-config xmlns="http://xmlns.oracle.com/adf/faces/config"> <persistent-change-manager> <persistent-change-manager-class>oracle.adf.view.rich.change.MDSDocumentChangeManager</persistent-change-manager-class> </persistent-change-manager> . . . </adf-faces-config>
For more information about change persistence in Oracle Composer, see Section 21.11, "Configuring the Persistence Change Manager."
For more information about the persistent-change-manager
element, see Oracle Fusion Middleware Fusion Developer's Guide for Oracle Application Development Framework.
Use the taglib-config
element to specify the component tags that must be persisted by default. This element is relevant only when you define change persistence using persistent-change-manager
in your adf-config.xml
file.
When you add Oracle Composer components to the page, the adf-config.xml
file is populated with the taglib-config
element containing a list of tags and attributes that must be persisted. You can add more elements and attributes to the default list.
For more information about this element, see Oracle Fusion Middleware Fusion Developer's Guide for Oracle Application Development Framework.
Insert the taglib-config
element within the adf-faces-config
section. The taglib-confi
g element appears as shown in the following example:
<adf-faces-config xmlns="http://xmlns.oracle.com/adf/faces/config"> . . . <taglib-config> <taglib uri="http://xmlns.oracle.com/adf/faces/customizable"> <tag name="showDetailFrame"> <persist-operations>all</persist-operations> <attribute name="expansionMode"> <persist-changes>true</persist-changes> </attribute> <attribute name="contentStyle"> <persist-changes>true</persist-changes> </attribute> </tag> <tag name="panelCustomizable"> <persist-operations>all</persist-operations> </tag> </taglib> </taglib-config> </adf-faces-config>
For more information, see Section 21.11, "Configuring the Persistence Change Manager."
Use this to override Oracle Composer-specific security configurations, specifically if you want to override the default security policies with application-level checks. Insert the security-config
element inside the page-editor-config
section. Within the security-config
element, you can define security-policies
, security-policy
, policy-class
, and task-flow-security
elements.
security-policies
Use this to encompass all the security policies and policy overrides for Oracle Composer. You can have only one security-policies
element under the page-editor-config
section.
security-policy
Use this to override an existing policy. Add one security-policy
element for each policy that you want to override.
The security-policy
element supports the name
and override
attributes, where name
is used to specify a name with which to register the custom policy and override
is used to specify the name of the default policy that you want to override.
policy-class
Use this to specify the name of the custom security policy.
task-flow-security
Use this element, along with the check-permission
attribute, to enable Oracle Composer to check for a task flow's permissions so that only users with appropriate privileges are allowed to edit or customize the task flow at runtime.
For more information, see Section 23.6, "Implementing Task Flow Security."
Example B-2 shows a sample adf-config.xml
file with Oracle Composer-specific configurations.
Example B-2 Sample adf-config.xml File with Oracle Composer-Specific Configurations
<?xml version="1.0" encoding="windows-1252" ?>
<adf-config xmlns="http://xmlns.oracle.com/adf/config"
xmlns:adf="http://xmlns.oracle.com/adf/config/properties"
xmlns:mdsC="http://xmlns.oracle.com/adf/mds/config">
<adf:adf-properties-child xmlns="http://xmlns.oracle.com/adf/config/properties">
<adf-property name="adfAppUID" value="configfilesapp-7198"/>
</adf:adf-properties-child>
<mdsC:adf-mds-config version="11.1.1.000">
<mds-config xmlns="http://xmlns.oracle.com/mds/config">
<persistence-config>
<metadata-namespaces>
<namespace path="/oracle/adf/rc/metadata"
metadata-store-usage="WebCenterFileMetadataStore"/>
<namespace path="/persdef/"
metadata-store-usage="WebCenterFileMetadataStore"/>
<!-- Namespace definitions for Oracle Composer sandbox -->
<!-- Your jspx customizations alone go here -->
<namespace path="/pages" metadata-store-usage="WebCenterFileMetadataStore">
<namespace-restriction type="CUSTOMIZATIONS"/>
</namespace>
<!-- Your pagedef customizations alone go here -->
<namespace path="/pageDefs" metadata-store-usage="WebCenterFileMetadataStore">
<namespace-restriction type="CUSTOMIZATIONS"/>
</namespace>
</metadata-namespaces>
<metadata-store-usages>
<metadata-store-usage id="WebCenterFileMetadataStore"
default-cust-store="true">
<metadata-store class-name="oracle.mds.dt.persistence.stores.file.SrcControlFileMetadataStore">
<property name="metadata-path" value="../../mds"/>
</metadata-store>
</metadata-store-usage>
</metadata-store-usages>
</persistence-config>
<cust-config>
<match>
<customization-class name="oracle.adf.share.config.SiteCC"/>
</match>
</cust-config>
<cache-config>
<max-size-kb>100000</max-size-kb>
</cache-config>
<!-- Registration of a standalone XML file used for type-level customization policies -->
<type-config>
<standalone-definitions>
<file>Directory_Name/standalone.xml</file>
</standalone-definitions>
</type-config>
</mds-config>
</mdsC:adf-mds-config>
<page-editor-config xmlns="http://xmlns.oracle.com/adf/pageeditor/config">
<!-- Oracle Composer add-on panel configuration -->
<addon-panels>
<addon-panel name="oracle.adf.pageeditor.addonpanels.page-settings" />
<addon-panel name="oracle.adf.pageeditor.addonpanels.page-reset" />
<addon-panel name="oracle.fod.custom.panel" />
</addon-panels>
<!-- Oracle Composer sandbox configuration -->
<sandbox-namespaces>
<namespace path="/pages"/>
<namespace path="/pageDefs"/>
</sandbox-namespaces>
<!-- ComposerSessionOptionsFactory class registration for implementing customization layers -->
<session-options-factory>view.AppsSessionOptionsFactoryImpl</session-options-factory>
<!-- Resource string editor configuration -->
<resource-string-editor>
<enabled>true</enabled>
</resource-string-editor>
<!-- Switch to enable or disable Oracle Composer Source view -->
<enable-source-view>false</enable-source-view>
</page-editor-config>
<!-- Multiple Resource Catalog configuration -->
<rcv-config xmlns="http://xmlns.oracle.com/adf/rcs/viewer/adf-config">
<catalog-selector class-name="webcenter.CatalogSelector"/>
<default-catalog catalog-name="users-catalog"/>
</rcv-config>
<!-- Oracle Composer and Customizable Components actions security configuration -->
<cust:customizableComponentsSecurity xmlns="http://xmlns.oracle.com/adf/faces/customizable/config">
<cust:enableSecurity value="true"/>
<cust:actionsCategory>
<cust:actionCategory name="personalizeActionsCategory" value="false"/>
<cust:actionCategory name="editActionsCategory" value="true"/>
</cust:actionsCategory>
<cust:actions>
<cust:action name="showMinimizeAction" value="true"/>
<cust:action name="showMoveAction" value="false"/>
</cust:actions>
</cust:customizableComponentsSecurity>
<adf-faces-config xmlns="http://xmlns.oracle.com/adf/faces/config">
<!-- Oracle Composer persistence change manager configuration -->
<persistent-change-manager>
<persistent-change-manager-class>oracle.adf.view.rich.change.MDSDocumentChangeManager</persistent-change-manager-class>
</persistent-change-manager>
<!-- Oracle Composer default persistence configuration -->
<taglib-config>
<taglib uri="http://xmlns.oracle.com/adf/faces/customizable">
<tag name="showDetailFrame">
<persist-operations>all</persist-operations>
<attribute name="expansionMode">
<persist-changes>true</persist-changes>
</attribute>
<attribute name="contentStyle">
<persist-changes>true</persist-changes>
</attribute>
</tag>
<tag name="panelCustomizable">
<persist-operations>all</persist-operations>
</tag>
</taglib>
</taglib-config>
</adf-faces-config>
</adf-config>
The adf-settings.xml
file, in addition to holding generic project- and library-level settings, can also be used to define custom actions on task flows. This section describes the adf-settings.xml
configurations specific to Oracle Composer.
Use the custComps-config
element to define custom actions on task flows consumed in the application. At runtime, the custom actions configurations in the application's adf-config.xml
and adf-settings.xml
files are picked up and appropriate actions are displayed on the Show Detail Frame
component surrounding a task flow. For more information, see Section 21.3, "Enabling Custom Actions on a Task Flow."
Insert the custComps-config
element within the adf-settings
tag. Within the custComps-config
element, you can specify the customActions
element.
customActions
Use the customActions
element in the adf-settings.xml
file to define actions that you want to display on task flows. The custom actions defined here will be displayed along with the other actions on the surrounding Show Detail Frame
component. You must add only one customActions
element inside the custComps-config
section. Within the customActions
element you can add any number of customAction
elements to define individual custom actions, as shown in the following example:
<customActions> <customAction action="next" location="chrome" rendered="true" icon="/adf/webcenter/editheader_ena.png" text="Next" taskFlowId="/WEB-INF/task-flow-definition.xml#task-flow-definition" shortDesc="next"/> <customAction action="prev" location="chrome" rendered="true" icon="/adf/webcenter/editheader_ena.png" text="Previous" taskFlowId="/WEB-INF/task-flow-definition.xml#task-flow-definition" shortDesc="prev"/> </customActions>
The web.xml
file is a Java EE standard descriptor that contains details about web applications. When you add a Page Customizable
component to your page, the web.xml
file available in the Application_Root
\
Project_Name
\public_html\WEB-INF
directory is updated to enable change persistence among other settings.
You must update web.xml
further when creating an application that uses multiple customization layers and when enabling Oracle Composer sandbox. The following sections describe the web.xml
configurations specific to Oracle Composer.
The CHANGE_PERSISTENCE
context parameter in the application's web.xml
file specifies how application customizations are persisted. To enable changes in an Oracle Composer-enabled page to be persisted in MDS, you must ensure that the CHANGE_PERSISTENCE
context parameter is set to ComposerChangeManager
, as shown in the following example:
<context-param> <param-name>org.apache.myfaces.trinidad.CHANGE_PERSISTENCE</param-name> <param-value>oracle.adf.view.page.editor.change.ComposerChangeManager</param-value> </context-param>
This context parameter registers the ChangeManager
class to be used to ensure persistence to MDS. This configuration happens automatically when you add a Page Customizable
component to a page in a new WebCenter application. However, in an existing ADF application, this context parameter may be set to some other value, for example session
or oracle.adf.view.rich.change.FilteredPersistenceChangeManager
. Therefore, when you add Oracle Composer components to such an application, you must ensure that the CHANGE_PERSISTENCE
parameter is set to ComposerChangeManager
.
For more information, see Section 21.11, "Configuring the Persistence Change Manager."
Use WebCenterComposerFilter
in the web.xml
file to register Oracle Composer's ComposerSessionOptionsFactory
with Oracle ADF for every HTTP request. The request is then handled depending on your implementation of ComposerSessionOptionsFactory
. This filter can be defined as shown in the following example:
<filter-mapping> <filter-name>WebCenterComposerFilter</filter-name> <url-pattern>/faces/*</url-pattern> <dispatcher>FORWARD</dispatcher> <dispatcher>REQUEST</dispatcher> </filter-mapping>
You must use WebCenterComposerFilter
if you are performing the following tasks:
Creating customization layers. For information, see Section 22.3, "Adding Customization Layers to View and Edit Modes: Example."
Enabling sandbox creation in Oracle Composer. For more information, see Section 22.2.1, "How to Enable Oracle Composer Sandbox Creation."
This section lists the add-ons and property panels available by default in Oracle Composer.
This section lists the add-ons available in Oracle Composer and provides the names with which these add-ons are registered in the adf-config.xml
file. It is useful to know these names as you will need them to enable or disable the display of the add-ons in your application.
Page Properties
Used to edit page properties and create page parameters.
This add-on is registered with the name oracle.adf.pageeditor.addonpanels.page-settings
in the adf-config.xml
file.
Reset Page
Used to reset page customizations.
This add-on is registered with the name oracle.adf.pageeditor.addonpanels.page-reset
in the adf-config.xml
file.
Customization Manager
Used to manage customizations made to pages and task flows.
This add-on is registered with the name oracle.adf.pageeditor.addonpanels.customization-manager
in the adf-config.xml
file.
The Page Properties and Reset Page add-ons are rendered by default. If you create custom add-ons in your application, while registering those add-ons in adf-config.xml
, you must also include the entries for the default add-ons. Without these, the default add-ons are not displayed in Oracle Composer. For information about add-ons, see Section 20.2, "Creating Oracle Composer Add-Ons."
This section lists the property panels available by default in the Component Properties and Page Properties dialogs and provides the names with which these panels are registered in the pe_ext.xml
file. These names are useful if you choose to override the default panels with custom property panels, or hide some or all of the default panels. For information about creating property panels, see Section 20.3, "Creating Custom Property Panels."
Display Options
Used to define display-related behavior of a component. This panel is displayed in the Component Properties dialog for all components.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.generic-property-inspector
.
Display Options (Show Detail Frame)
Used to define display-related behavior of a Show Detail Frame
component. This panel is displayed in the Component Properties dialog for a Show Detail Frame
component only.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.sdfprop
.
Tabs
Used to define the display properties and order of tabs on a Panel Customizable
or Box
component. This panel is displayed in the Component Properties dialog for a Panel Tabbed
or Panel Customizable
component. The panel is displayed for a Panel Customizable
component only if the component has tabs on it.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.panel-tabbed
.
Style
Used to define the appearance of the component instance. This panel is displayed in the Component Properties dialog for all components.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.inline-style-editor
.
Content Style
Used to define the appearance of content inside a component instance. This panel is displayed in the Component Properties dialog for all components.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.content-style-editor
.
Events
Used to wire a contextual event to an action handler to enable the passing of values from a producer component to a consumer component when the event is triggered on the producer. This panel displays in the Component Properties dialog for all components.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.events
.
Region Parameters
Used to define parameters for the task flow region. This panel displays in the Component Properties dialog only for task flow regions.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.region-param
.
Portlet Paramters
Used to define portlet parameters. This panel displays in the Component Properties dialog only for portlets.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.portlet-param
.
Layout Customizable
Used to define the layout for page components by selecting from a set of predefined layouts. This panel displays in the Component Properties dialog only for Layout Customizable
components.
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.layout-cust-prop
.
Child Components
Used to rearrange and show or hide child components inside a Panel Customizable
component. This panel displays only for Panel Customizable
components
In the pe_ext.xml
file, this panel is referenced with the name oracle.adf.pageeditor.pane.child-navigator
.
Page Parameters
Used to define the page parameters that can be wired to components on the page. This panel displays in the Page Properties dialog.
In the pe_ext.xml
file, this panel is referenced with the name oracle.webcenter.page.pane.page-param
.
Page Security
Used to define page permissions. This panel displays in the Page Properties dialog for secured application pages.
In the pe_ext.xml
file, this panel is referenced with the name oracle.webcenter.page.pane.page-sec
.
By default, context-sensitive help is not available for Oracle Composer panels and dialogs, and therefore Help icons are not displayed. These icons are displayed when you install a help provider and hook up help topics for the different panels and dialogs. Oracle Composer help topics are available in the pages_cs.jar
file on the Oracle WebCenter Suite 11g Demonstrations and Samples page on the Oracle Technology Network (OTN) at:
To integrate this help with the Oracle Composer UI in your WebCenter Portal application, a help provider must be available to the application. After creating a help provider, use the topic IDs in Table B-17 to hook up individual help topics.
Table B-17 Oracle Composer Runtime Help Topics
Topic ID to be Used | Corresponding Oracle Composer UI |
---|---|
pages_cs_pgeditmodesv |
Source view of a page in Edit mode |
pages_cs_pgeditmodedv |
Design view of a page in Edit mode |
pages_cs_cpparams |
Parameters tab in the Component Properties dialog |
pages_cs_cpdisplayopts |
Display Options tab in the Component Properties dialog |
pages_cs_cptabs.html |
Tabs tab in the Component Properties dialog |
pages_cs_cpstyle |
Style tab in the Component Properties dialog |
pages_cs_cpcontstyle |
Content Style tab in the Component Properties dialog |
pages_cs_othercss |
Other CSS option on the Style tab in the Component Properties dialog |
pages_cs_cpevents |
Events tab in the Component Properties dialog |
pages_cs_compcat |
Catalog dialog |
pages_cs_ppgen |
Display Options tab in the Page Properties dialog |
pages_cs_ppsecurity |
Security tab in the Component Properties dialog |
pages_cs_pppgparams |
Parameters tab in the Component Properties dialog |
pages_cs_cplayoutprops |
Layout Customizable tab in the Component Properties dialog for a |
pages_cs_resourceeditor |
Select text resource dialog invoked on selecting the Select Text Resource option on the menu next to a field in the Component Properties dialog |
Creating and Registering a Help Provider
This section describes an example where the help topics are extracted to a folder in the application Web context root and then hooked up to the UI elements.
Note: For detailed information about creating a help provider and displaying help for components, see the section, "Displaying Help for Components" in the Oracle Fusion Middleware Web User Interface Developer's Guide for Oracle Application Development Framework. |
To create and register a help provider:
Download the help JAR from OTN and extract the help files to a folder in your application, for example, Web Content/help
.
Create a provider class, for example, WebCenterHelpProvider
, with the following code:
package portal; import javax.faces.component.UIComponent; import javax.faces.context.FacesContext; import oracle.adf.view.rich.help.ResourceBundleHelpProvider; public class WebCenterHelpProvider extends ResourceBundleHelpProvider { public WebCenterHelpProvider() { super(); } public String getExternalUrl(FacesContext context, UIComponent component, String topicId) { return "http://localhost:7101/help_test-Portal-context-root/help/" + topicId+".html"; } }
Register the new help provider in the adf-settings.xml
file as follows:
<adf-settings xmlns="http://xmlns.oracle.com/adf/settings"> <adf-faces-config xmlns="http://xmlns.oracle.com/adf/faces/settings"> <help-provider prefix="pages_cs"> <help-provider-class> portal.WebCenterHelpProvider </help-provider-class> <property> <property-name>baseName</property-name> <value>oracle.adfinternal.view.page.editor.resource.ComposerBundle</value> </property> </help-provider> </adf-faces-config> </adf-settings>
Run a page in your application and verify that the help shows up correctly.
This section includes a series of tables that describe the style selectors associated with Oracle Composer components. Additionally, it describes how to use the background
property to choose one of three skin-defined looks for these components.
This section contains the following subsections:
Use a style selector to describe an element's appearance by identifying the element and defining styles for it.
This section contains the following subsections:
Use global style selectors to define styles for multiple components within the application. Table B-18 lists and describes the global style selectors relevant to Oracle Composer components.
Table B-18 Global Style Selectors
Style Selector | Description |
---|---|
.ComposerDark:alias |
Specifies the default color for toolbars, headers, and so on in Oracle Composer, with a color scheme of dark. |
.ComposerLight:alias |
Specifies the default color for toolbars, headers, and so on in Oracle Composer, with a color scheme of light. |
.ComposerBackground |
Specifies the color scheme for Composer dialogs, such as the Component Properties and Page Properties dialogs. |
.ComposerBorder |
Specifies the border, width, and so on for Composer dialogs, such as the Component Properties and Page Properties dialogs. |
.PEClickableImageAnchor:alias |
An alias for rendering a clickable icon in a table cell. Specifies the CSS properties needed to display an image which is clickable and which has inline-mode display. For example, you can specify this as a common property for all action icons on a |
.ChildPanelFacetWarning |
Specifies the style for the warning message displayed in the child navigator in the Component Properties dialog. |
Use the style selectors in Table B-19 to skin the status indicator component in the Oracle Composer toolbar.
Table B-19 Status Indicator Style Selectors
Style Selector | Description |
---|---|
af|statusIndicator.ComposerStatus |
Specifies the style for the status indicator component. You can use this to specify a fixed height for the status indicator. |
af|statusIndicator.ComposerStatus::idle-icon |
Specifies the icon that represents the idle state. This icon is generally a non-animated icon that indicates communication is NOT occurring with the server. |
af|statusIndicator.ComposerStatus::processing-icon |
Specifies the icon that represents the processing state. This icon is generally an animated icon that indicates communication IS occurring with the server. |
af|statusIndicator.ComposerStatus::connecting-icon |
Specifies the icon that displays when the Active Data Service is in the process of connecting. This icon is generally an animated icon. |
af|statusIndicator.ComposerStatus::connected-icon |
Specifies the icon that displays when the Active Data Service is in the connected state. This icon is generally a non-animated icon and may be the same as the idle state icon. |
af|statusIndicator.ComposerStatus::reconnecting-icon |
Specifies the icon that displays when the Active Data Service has lost connection and is attempting to reconnect. This icon is generally an animated icon. |
af|statusIndicator.ComposerStatus::disconnected-icon |
Specifies the icon that displays when the Active Data Service is in the disconnected state. This icon is generally a non-animated icon used to indicate that no further reconnection attempts will be made without use interaction. |
Use the style selectors in Table B-20 to skin Page Customizable
components.
Table B-20 Page Customizable Style Selectors
Style Selector | Description |
---|---|
af|pageCustomizable |
Specifies the default size of a |
af|pageCustomizable af|toolbox.ComposerToolbox |
Specifies the style for the main dark gray toolbar displayed in Edit mode. This toolbar contains a message about the page being edited and the various buttons. |
af|pageCustomizable af|toolbox.ComposerToolbox af|panelGroupLayout.ComposerConcurrency |
Specifies the style for the concurrency toolbar that appears below the main Oracle Composer toolbar when two or more users are editing a page at the same time in the same customization layer. |
af|pageCustomizable af|toolbox.ComposerToolbox af|toolbar af|pageCustomizable af|toolbox.ComposerToolbox af|toolbar::separator af|pageCustomizable af|toolbox.ComposerToolbox af|toolbox::body af|pageCustomizable af|toolbox.ComposerToolbox af|toolbox::body af|toolbox::row af|pageCustomizable af|toolbox.ComposerToolbox af|toolbox::body af|toolbox::last-row af|pageCustomizable af|toolbox.ComposerToolbox af|toolbox::body af|toolbox::row af|toolbox::leading-cell |
Specifies the styles for the different areas in the toolbar. |
af|pageCustomizable af|toolbox.ComposerToolbox af|commandToolbarButton::text af|pageCustomizable af|toolbox.ComposerToolbox af|commandToolbarButton:hover af|pageCustomizable af|toolbox.ComposerToolbox af|commandToolbarButton:depressed |
Specify the styles for the Oracle Composer toolbar buttons such as Page Properties and Reset Page. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar::body af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar::body:rtl |
Specifies the style for the body of the View menu on the toolbar. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar af|menu::bar-item-text |
Specifies the style for the text on the View menu. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar af|menu::bar-item:highlighted |
Specifies the style for the View menu when the mouse hovers over it. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar af|menu::bar-item:depressed |
Specifies the style for the View menu when it is clicked. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar af|menu::bar-item-open-icon-style |
Specifies the style for the dropdown icon appearing on the View menu. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar af|menu:depressed af|menu::bar-item-open-icon-style |
Specifies the style for the dropdown icon when it is clicked on the View menu. |
af|pageCustomizable af|toolbox.ComposerToolbox af|menuBar af|menu:highlighted af|menu::bar-item-open-icon-style |
Specifies the style for the dropdown icon when the mouse hovers over it. |
af|pageCustomizable af|toolbar.SourceView |
Specifies the style for the toolbar in Oracle Composer Source view. |
af|pageCustomizable af|toolbar.SourceView af|menuBar |
Specifies the style for the menubar in Source view. |
af|dialog.ComposerDialog::content-start af|dialog.ComposerDialog::content-start:rtl af|dialog.ComposerDialog::content af|dialog.ComposerDialog::content:rtl af|dialog.ComposerDialog::content-end |
Specify the styles for the dialogs invoked using Oracle Composer toolbar buttons. Available alias is |
af|pageCustomizable af|breadCrumbs.ComposerBreadcrumbs af|pageCustomizable af|breadCrumbs.ComposerBreadcrumbsHidden:step |
Specify the styles for Oracle Composer breadcrumbs. |
af|pageCustomizable:edit af|panelGroupLayout.ComposerSplitHorz af|pageCustomizable:edit af|panelGroupLayout.ComposerSplitVert |
Specifies the style for |
af|pageCustomizable:edit, af|pageCustomizable:stretched |
Specifies the style for the This selector ensures that in Edit mode, a |
af|pageCustomizable:printable |
Specifies the style for the |
af|pageCustomizable af|panelGroupLayout.ComposerCutComp af|tree::node-stamp-text |
Specifies the style for the dotted line border around components that are cut. |
Use the style selectors in Table B-21 to skin Layout Customizable
components.
Table B-21 Layout Customizable Style Selectors
Style Selector | Description |
---|---|
af|layoutCustomizable::menu:edit |
Specifies the style for the Change Layout button in Edit mode. |
af|layoutCustomizable::menu:edit af|commandImageLink::text af|layoutCustomizable::menu:edit af|commandImageLink::text:hover |
Specify the styles for the text on the Change Layout button in Edit mode. |
af|layoutCustomizable.AFStretchWidth |
Specifies the width to which the component can stretch horizontally. |
Use the style selectors listed in Table B-22 to skin Panel Customizable
components.
Note: Some style selectors in Table B-22 have three color-scheme selections: light, medium, and dark. Using these you can define three distinct looks in your CSS and specify which one to use through thebackground property in the JDeveloper Property Inspector. Depending on which value is specified for a component instance's background property, the skin applies the relevant style. |
Table B-22 Panel Customizable Style Selectors
Style Selector | Description |
---|---|
af|panelCustomizable |
Specifies the style for the root element of the component. |
af|panelCustomizable.PEStretched |
Specifies the style for the component, when it is stretched. |
af|panelCustomizable:edit |
Specifies the style for the container in Edit mode. |
af|panelCustomizable:edit:drop-target |
Specifies the style for this component when you drag another component on the page and hover over this component to drop it in. |
af|panelCustomizable::edit-mode-content-style |
Specifies the style for the area containing the Edit and Delete icons. |
af|panelCustomizable::add-icon-style af|panelCustomizable::add-icon-style:active af|panelCustomizable::add-icon-style:hover af|panelCustomizable::add-icon-style:rtl |
Specify the styles for the Add Content button on the component. |
af|panelCustomizable::edit-icon-style af|panelCustomizable::edit-icon-style:active af|panelCustomizable::edit-icon-style:hover |
Specify the styles for the Edit icon on the component. |
af|panelCustomizable::delete-icon-style af|panelCustomizable::delete-icon-style:active af|panelCustomizable::delete-icon-style:hover |
Specify the styles for the Delete icon on the component. |
.PanelCustomizableDropProxy |
Specifies the style for the placeholder area inside this component when you drag another component on the page and hover over this component to drop it in. |
af|panelCustomizable:edit:inline-selected .p_AFActiveInlineEditableContainer af|panelCustomizable:edit:hover-target |
Specifies the styles for the components in the inline editable subtree in the |
af|panelCustomizable::add-icon-link af|panelCustomizable::add-icon-link:active af|panelCustomizable::add-icon-link:hover |
Specify the styles for the Add icon in the |
af|panelCustomizable::addtab-icon-style af|panelCustomizable::addtab-icon-style:active af|panelCustomizable::addtab-icon-style:hover |
Specify the styles for the Add Tab icon in the |
af|panelCustomizable::split-up-icon-style af|panelCustomizable::split-up-icon-style:active af|panelCustomizable::split-up-icon-style:hover af|panelCustomizable::split-down-icon-style af|panelCustomizable::split-down-icon-style:active af|panelCustomizable::split-down-icon-style:hover af|panelCustomizable::split-left-icon-style af|panelCustomizable::split-left-icon-style:active af|panelCustomizable::split-left-icon-style:hover af|panelCustomizable::split-right-icon-style af|panelCustomizable::split-right-icon-style:active af|panelCustomizable::split-right-icon-style:hover |
Specify styles for the icons available on a |
.PanelCustomizableDropProxy |
Specifies the style for a component being dragged and dropped inside a |
Use the style selectors listed in Table B-23 to skin portlets and Show Detail Frame
components.
In WebCenter Portal applications, each portlet is rendered with portlet chrome (for more information, see Section 57.1.1, "Portlet Anatomy"). The portlet chrome shares the same chrome rendering mechanism as a Show Detail Frame
component. Thus, the style and icon selectors that apply to Show Detail Frame
also apply to the portlet chrome. In other words, in addition to defining styles for Show Detail Frame
components, use Show Detail Frame
style and icon selectors to define styles for portlets.
Note: SomeShow Detail Frame style selectors in Table B-23 have light, medium, and dark color scheme options. Using these you can define three distinct looks in your CSS and specify which one to use through the background property in the JDeveloper Property Inspector. Depending on which value is specified for a component instance's background property, the skin applies the relevant style. |
Table B-23 Show Detail Frame Style Selectors
Style Selector | Description |
---|---|
af|showDetailFrame |
Specifies the style for the root element of the component. |
af|showDetailFrame::container:light af|showDetailFrame::container:medium af|showDetailFrame::container:dark |
Specify the styles for the element containing the contents within the component. |
af|showDetailFrame.p_AFStretched |
Specifies the style for the root element when the component is stretched. |
af|showDetailFrame::content af|showDetailFrame::content:light af|showDetailFrame::content:medium af|showDetailFrame::content:dark |
Specify the styles to render for the content region of the component. |
af|showDetailFrame::header af|showDetailFrame::header:light af|showDetailFrame::header:medium af|showDetailFrame::header:dark |
Specify the styles for the header element. This element surrounds the header text, icon, and actions regions. |
af|showDetailFrame::header-center af|showDetailFrame::header-center:medium af|showDetailFrame::header-center:dark |
Specify the styles for the region on the component header containing the icons, title, and actions menu. |
af|showDetailFrame::header-startaf|showDetailFrame::header-start:rtl af|showDetailFrame::header-start:dark af|showDetailFrame::header-start:dark:rtl |
Specify the styles for the small cap-like area at the start of the header. Available alias is |
af|showDetailFrame::header-end, af|showDetailFrame::header-end:rtl af|showDetailFrame::header-end:dark af|showDetailFrame::header-end:dark:rtl |
Specify the styles for the small cap-like area at the end of the header. Available alias is |
af|showDetailFrame::footer-start af|showDetailFrame::footer-start:rtl af|showDetailFrame::footer-center af|showDetailFrame::footer-end af|showDetailFrame::footer-end:rtl |
Specify the styles for the |
af|showDetailFrame::shadowbox af|showDetailFrame::shadowbox:rtl af|showDetailFrame::shadowbox_div1 af|showDetailFrame::shadowbox_div1:rtl af|showDetailFrame::shadowbox_div2 af|showDetailFrame::shadowbox_div2:rtl |
Specify styles for the shadow cast by the |
af|showDetailFrame::toolbar af|showDetailFrame::toolbar:rtl |
Specifies the styles for a floating toolbar on the |
af|showDetailFrame::icon-style |
Specifies the style for the icon on the |
af|showDetailFrame::header-text af|showDetailFrame::header-text:rtl |
Specifies the style for the title available on the component header. Available alias is |
af|showDetailFrame::header-actions |
Specifies the style for icons such as delete and the actions menu on the component header. |
af|showDetailFrame::toolbar-container af|showDetailFrame::toolbar-container:light af|showDetailFrame::toolbar-container:medium af|showDetailFrame::toolbar-container:dark |
Specify styles for the container element of the floating toolbar. Available aliases are |
af|showDetailFrame::collapse-icon-style af|showDetailFrame::collapse-icon-style:active af|showDetailFrame::collapse-icon-style:hover af|showDetailFrame::collapse-icon-style.PEDisplayNone |
Specify styles for the Collapse icon on the component header. Available aliases are You can use |
af|showDetailFrame::disclose-icon-style af|showDetailFrame::disclose-icon-style:active af|showDetailFrame::disclose-icon-style:hover af|showDetailFrame::disclose-icon-style.PEDisplayNone |
Specify the styles for the Disclose icon on the component header. You can use |
af|showDetailFrame::actionmenu-icon-style af|showDetailFrame::actionmenu-icon-style:active af|showDetailFrame::actionmenu-icon-style:hover |
Specify the styles for the action menu icon. This style has a background-image that you can override. |
af|showDetailFrame::remove-icon-style af|showDetailFrame::remove-icon-style:active af|showDetailFrame::remove-icon-style:hover |
Specify the styles for the Delete icon. |
af|showDetailFrame::edit-icon-style af|showDetailFrame::edit-icon-style:active af|showDetailFrame::edit-icon-style:hover |
Specify the styles for the Edit icon. |
af|showDetailFrame::preview-icon-style af|showDetailFrame::preview-icon-style:active af|showDetailFrame::preview-icon-style:hover |
Specify styles for the Preview icon. |
af|showDetailFrame::edit-mode-content-style af|showDetailFrame::edit-mode-content-style:light |
Specify the styles for the area that contains the edit and remove icons. |
af|showDetailFrame::edit-mode-edit-icon-style af|showDetailFrame::edit-mode-edit-icon-style:active af|showDetailFrame::edit-mode-edit-icon-style:hover |
Specify the styles for the Edit icon on the component header in Edit mode. |
af|showDetailFrame::edit-mode-remove-icon-style af|showDetailFrame::edit-mode-remove-icon-style:active af|showDetailFrame::edit-mode-remove-icon-style:hover |
Specify the styles for the Delete icon on the component header in Edit mode. |
af|showDetailFrame::edit-text-link af|showDetailFrame::edit-text-link:rtl af|showDetailFrame::edit-text-link:hover |
Specify the styles for the Edit Text link in Edit mode when the component includes a Rich Text Editor component as a child. |
af|showDetailFrame::resize af|showDetailFrame::resize:rtl |
Specifies the style for the resize handler on the component. Available alias is |
af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|toolbox > af|toolbox::body, af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|toolbox > af|toolbox::body > af|toolbox::row, af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|toolbox > af|toolbox::body > af|toolbox::last-row, af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|richTextEditor::content-input-container af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|richTextEditor::content-input, af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|richTextEditor::content-input-container af|showDetailFrame::content:medium.PEWrapsRTE af|showDetailFrame::content:light.PEWrapsRTE af|showDetailFrame::content.PEWrapsRTE > af|richTextEditor af|toolbox |
Specify styles for the areas surrounding and inside a nested Rich Text Editor component. For example, to ensure that the background color of the Rich Text Editor component is transparent in Edit mode, or to provide borders around the component. |
af|showDetailFrame::content.PEStretched |
Specifies the height when the |
af|showDetailFrame::content.PEStretched:printable |
Ensures that the |
af|showDetailFrame::dynamic-help-icon-container af|showDetailFrame::dynamic-help-icon-container:rtl |
Specifies the styles for the help icon container on the component header. |
af|showDetailFrame::dynamic-help-icon-style af|showDetailFrame::dynamic-help-icon-style:active af|showDetailFrame::dynamic-help-icon-style:hover |
Specify the styles for the help icon on the component header. |
.PEShowDetailFrameAnimIcon |
Specifies the animation icon to be used to show busy status on the component, for example, when you expand it. |
.PEIconAndTextInHeading:alias .PEIconAndTextInHeading:alias:rtl |
Specify the styles for rendering an icon with text in the component header. |
Table B-24 provides a quick reference for the style attributes available for WebCenter Customizable Components and Oracle Composer components through the JDeveloper Property Inspector. Note that portlets also use these style attributes.
For detailed information about style properties, see the CSS Specifications page at:
Table B-24 Style Attributes of Oracle Composer and WebCenter Customizable Components
Attribute | Description |
---|---|
|
The background color of the component. Choose from a list of colors, or click the Edit icon to select from a color palette. |
|
The image that is displayed in the component background. Select to inherit from a parent component or to display no image, or click the Edit icon to select an image. |
|
Specify whether and how the background image should repeat. Choose from:
|
|
The color of the border that surrounds the component. Choose from a list of colors, or click the Edit icon to select from a color palette. |
|
The style of border to draw around the component. Choose from:
|
|
The thickness of the component border. Select |
|
The color of the component text. Select from a list, or click the Edit icon to select from a color palette. |
|
The font family (such as Arial, Helvetica, or sans-serif) for the component text. Enter this value manually. |
|
The size of component text. Choose from:
|
|
The font style of the component text. Choose from:
|
|
The thickness of the component text. Choose from:
|
|
The spacing to apply between lines of continuous text (also known as leading). Specify a height by choosing from:
|
|
An image to use as an indicator of a list item. Specify an image instead of defining a
Or click the Edit icon and select an image. |
|
The type of indicator to use for items on a list. Use this instead of specifying a image through Select from among many styles offered on the list, including |
|
The border of space surrounding the component content. Choose from:
|
|
The amount of space between the component and its margin or, if there is a border, between the component and its border. Choose from:
|
|
The horizontal alignment of the component text. Choose from:
|
|
The decorative value to apply to component text. Choose from:
|
|
The vertical alignment of component text. Choose from:
|
|
The spacing between text. Specify a width by choosing from:
|
Customizable Components (HTML) are similar in function to customizable components from the 10.1.3.2.0 release and can be used to add more customizable components to your migrated 10.1.3.2.0 application page. These customizable components are available from the Customizable Components (HTML) tag library in JDeveloper. When you add customizable components to the page, default values are assigned to certain attributes and you can define values for the remaining attributes as required.
Customizable components enable users to minimize or maximize, hide or show, or move any component on the page at runtime.
Use the Panel Customizable (HTML)
component as a container for page content that can be customized at runtime. Components added inside a Panel Customizable (HTML)
can be maximized, minimized, or rearranged.
Use this component only to perform runtime customizations on child components. If you just want a container to arrange components at design time, then it is recommended that you use an ADF Faces container like Panel Group Layout
.
Table B-25 describes the attributes of a Panel Customizable (HTML)
component.
Table B-25 Attributes of a Panel Customizable (HTML) Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is |
layout |
List of values
|
Yes |
Specifies how the children of the The default value is Depending on the value of the layout attribute, child components are laid out as follows: If you select If you select |
Style Attributes |
|||
styleClass |
String |
Yes |
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 |
String |
Yes |
The CSS styles to use for this component. This is intended for basic style changes. The |
Advanced Attributes |
|||
binding |
String |
Yes |
An EL reference that stores the component instance in 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. For example: binding="#{yourManagedBean.Binding}" |
Add Show Detail Frame (HTML)
components inside Panel Customizable (HTML)
components to enable user customizations like maximizing, moving, minimizing, restoring, and deleting child components. You can perform these customizations only if you add Show Detail Frame (HTML)
components inside Panel Customizable (HTML)
components.
Table B-26 describes the attributes of a Show Detail Frame (HTML)
component.
Table B-26 Attributes of a Show Detail Frame (HTML) Component
Attribute | Type | Supports EL? | Description |
---|---|---|---|
Common Attributes |
|||
id |
String |
No |
The identifier for the component. The identifier must follow a subset of the syntax allowed in HTML:
|
rendered |
Boolean |
Yes |
Specifies whether the component is rendered. When set to The default value is |
text |
String |
Yes |
A title for the |
icon |
String |
Yes |
If you want to add an icon on the header of the For example: icon="http://source-pc/images/accessability.gif" Note: An image that is stored at the document root does not require a full path. For example: icon="detail.gif" |
Appearance Attributes |
|||
shortDesc |
String |
Yes |
The 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 2 truncates long tooltips. For form components, the |
background |
List of values
|
Yes |
Working with the skin CSS, provides a means of applying a different look and feel for this The default value is |
displayHeader |
Boolean |
Yes |
Indicates whether the header of the The default value is If you set The toolbar display is also affected by the |
expansionMode |
List of values
|
Yes |
The default state of the The default display mode is |
Actions Attributes |
|||
showMoveAction |
List of values
|
Yes |
Specifies whether the Move action is displayed in the Actions menu. The default value is |
showMinimizeAction |
List of values
|
Yes |
Specifies whether the minimize action is displayed on the header. The default is |
showMaximizeAction |
List of values
|
Yes |
Specifies whether the minimize action is displayed on the header. The default value is |
Style Attributes |
|||
contentStyle |
String |
Yes |
The CSS style to apply to the |
styleClass |
String |
Yes |
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 |
String |
Yes |
The CSS styles to use for this component. This is intended for basic style changes. The |
Behavior Attributes |
|||
partialTriggers |
String |
Yes |
The IDs of the components that should trigger a partial update. This component listens on the trigger components. If a trigger component receives an event that causes it to update in some way, this component requests 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 - " |
disclosureListener |
|
Yes |
A method reference to a disclosure listener. A disclosure event is fired when the disclosure state changes. |
Advanced Attributes |
|||
binding |
String |
Yes |
An EL reference that stores the component instance in 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. For example: binding="#{yourManagedBean.Binding}" |
attributeChangeListener |
|
Yes |
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. |
The Expression Builder option available when setting these attributes enables you to bind the component instance to a managed bean property.
Show Detail Frame Facets
You can use the Show Detail Frame (HTML)
facets to define and display custom actions on Show Detail Frame (HTML)
components. Table B-27 describes the facets that enable you to display custom actions supported by the Show Detail Frame (HTML)
component.
Table B-27 Show Detail Frame (HTML) Facets
Facet | Description |
---|---|
titleBarAction |
Used if an action is to be associated with title of the |
additionalActions |
Used if some additional actions are to be added to the list of actions available on the |
JDeveloper displays all facets available to the Show Detail Frame (HTML)
component in the Structure window. However, only those that contain UI components appear activated.
The tables in this section describe the style selectors that you can use to skin WebCenter Customizable Components.
This section contains the following subsections:
Use the style selectors listed in Table B-28 to skin Panel Customizable (HTML)
components. For icon selectors relevant to the Panel Customizable
component, see Section B.6.3.4, "Icon Selectors."
Use the style selectors listed in Table B-29 to skin the Show Detail Frame (HTML)
components.
Note: In addition to defining styles forShow Detail Frame components, the Show Detail Frame style and icon selectors define styles for portlets. |
Table B-29 Show Detail Frame (HTML) Style Selectors
Style Selector | Description |
---|---|
afh|showDetailFrame::header-top-border-light afh|showDetailFrame::header-top-border-medium afh|showDetailFrame::header-top-border-dark |
Specifies the style for the top and bottom border of a component header and, also the header background color. |
afh|showDetailFrame::container |
Specifies the style for the component's container. |
afh|showDetailFrame::header-light afh|showDetailFrame::header-medium afh|showDetailFrame::header-dark |
Specifies the style for text in the component's header. The header is usually a banner of color that contains a title and links to menus and other types of actions. Define the header background color with the |
afh|showDetailFrame::content-light afh|showDetailFrame::content-medium afh|showDetailFrame::content-dar |
Specifies the style for the component's left, right, and bottom borders. |
afh|showDetailFrame::main-menu-container |
Specifies the style for the component's main menu container. |
afh|showDetailFrame::sub-menu-container |
Specifies the style for the component's submenu container. |
afh|showDetailFrame::menu-item |
Specifies the style for an individual item on the component's main menu. |
afh|showDetailFrame::menu-item:hover |
Specifies the style to render when the mouse hovers over a component main menu item. |
afh|showDetailFrame::sub-menu-item |
Specifies the style for an individual item on the component's submenu. |
afh|showDetailFrame::sub-menu-item:hover |
Specifies the style to render when the mouse hovers over a component submenu item. |
afh|showDetailFrame::actions-image-separator |
Specifies the amount of padding to provide around the component's Actions, Minimize, and Restore icons. For more information, see also Section B.6.3.4, "Icon Selectors". |
afh|showDetailFrame::menu-item-separator |
Specifies the style for the line that separates a command or groups of commands on the component's Actions menu. In the default case, a separator appears to be a single thick line. This is achieved using |
A.afh|showDetailFrame::title-clickable |
Specifies the style to render for the component's title when the title is a link. |
afh|showDetailFrame::no-header-content afh|showDetailFrame::no-header-content-light afh|showDetailFrame::no-header-content-medium afh|showDetailFrame::no-header-content-dark |
Specifies the style to render for all four component borders when the component header is turned off. |
Use property keys to control the display of custom menu items and component action icons. Though you include property keys in your custom skin, they are not represented in the generated CSS that results from the skin.
To explain, skins go through a process that results in a generated CSS. In turn, the generated CSS is consumed by the application. Most style selectors for Panel Customizable
and Show Detail Frame
components are represented in the generated CSS. Property keys are the exception. Although they affect the application as much as any other component style selector, they are not represented in the final generated CSS.
Table B-30 lists and describes property keys relevant to Panel Customizable
and Show Detail Frame
components.
Table B-30 Property Keys of Panel Customizable and Show Detail Frame Components
Property Key | Description |
---|---|
showDetailFrame {-ora-additional-actions-position-last:true} |
Positions additional actions relative to seeded actions on the component's Actions menu. Set to The default value is |
showDetailFrame {-ora-menu-icon-display:false} |
Controls the display of icons next to their related commands on a Set to The default value is For information about specifying the icons to use when this property key is set to |
Icons are either displayed or not displayed depending on whether the component's ora-menu-icon-display
property key is set to true
or false
. Property keys are described in Section B.6.3.3, "Property Keys."
Each icon selector has a light, medium, and dark scheme. Using these you can define three distinct looks in your CSS and specify which one to use through the background
property in the JDeveloper Property Inspector. Depending on which value is specified for a component instance's background
property, the skin applies the relevant style.
For easy, error-free portability, store all application icons under the WebCenter Portal application's root folder.
The selectors described in Table B-31 apply to the icons used with Panel Customizable (HTML)
and Show Detail Frame (HTML)
components.
Table B-31 Icon Selectors for WebCenter Customizable Components
Selector | Description |
---|---|
showDetailFrame::light-ActionsIcon:alias showDetailFrame::medium-ActionsIcon:alias showDetailFrame::dark-ActionsIcon:alias
panelCustomizable::light-ActionsIcon:alias panelCustomizable::medium-ActionsIcon:alias panelCustomizable::dark-ActionsIcon:alias |
This icon represents the Actions menu. The Actions menu lists the actions a user can perform on the component. In a WebCenter Portal application, the Actions icon is rendered on the right corner of the component header. |
showDetailFrame::light-MinimizeIcon:alias showDetailFrame::medium-MinimizeIcon:alias showDetailFrame::dark-MinimizeIcon:alias
panelCustomizable::light-MinimizeIcon:alias panelCustomizable::medium-MinimizeIcon:alias panelCustomizable::dark-MinimizeIcon:alias |
This icon represents the Minimize option. Minimize collapses the view of the component like a window shade. In a WebCenter Portal application, the Minimize icon is rendered on the left side of the component header. See also, |
showDetailFrame::light-MaximizeIcon:alias showDetailFrame::medium-MaximizeIcon:alias showDetailFrame::dark-MaximizeIcon:alias |
This is applicable only for the This icon represents the Maximize option, which expands the In a WebCenter Portal application, the Maximize icon is displayed to the left of the Maximize command on the component's Actions menu. |
panelCustomizable::light-MaximizeIcon:alias panelCustomizable::medium-MaximizeIcon:alias panelCustomizable::dark-MaximizeIcon:alias |
This is applicable only for the This icon represents the Maximize option, which expands component display to the dimensions of the container. Where multiple components display in the same container, these are displaced by the maximized component. In a WebCenter Portal application, the Maximize icon is displayed to the left of the Maximize command on the component's Actions menu. |
showDetailFrame::light-RestoreIcon:alias showDetailFrame::medium-RestoreIcon:alias showDetailFrame::dark-RestoreIcon:alias
panelCustomizable::light-RestoreIcon:alias panelCustomizable::medium-RestoreIcon:alias panelCustomizable::dark-RestoreIcon:alias |
This icon represents the Restore option, which restores maximized views to their default display modes. In a WebCenter Portal application, the Restore icon is rendered to the left of the Restore command on the component's Actions menu. |
showDetailFrame::light-ExpandIcon:alias showDetailFrame::medium-ExpandIcon:alias showDetailFrame::dark-ExpandIcon:alias
panelCustomizable::light-ExpandIcon:alias panelCustomizable::medium-ExpandIcon:alias panelCustomizable::dark-ExpandIcon:alias |
The Expand icon represents the action that expands a component that has been minimized. The Expand icon toggles with the Minimize icon. That is, when the component is minimized, the Expand icon is displayed; when the component is expanded, the Minimize icon is displayed. In a WebCenter Portal application, the Expand icon is displayed on the left side of the component header. |
showDetailFrame::light-MoveIcon:alias showDetailFrame::medium-MoveIcon:alias showDetailFrame::dark-MoveIcon:alias
panelCustomizable::light-MoveIcon:alias panelCustomizable::medium-MoveIcon:alias panelCustomizable::dark-MoveIcon:alias |
This icon represents the Move option, which enables rearrangement of a component's location in relation to the other components on the page. In a WebCenter Portal application, the Move icon is displayed to the left of the Move command on the component's Actions menu. |
showDetailFrame::light-MoveLeftIcon:alias showDetailFrame::medium-MoveLeftIcon:alias showDetailFrame::dark-MoveLeftIcon:alias
panelCustomizable::light-MoveLeftIcon:alias panelCustomizable::medium-MoveLeftIcon:alias panelCustomizable::dark-MoveLeftIcon:alias |
This icon represents the Move Left option on the component submenu. Move Left rearranges the component horizontally, one position closer to the left boundary of the page. For example, imagine three horizontally arranged components. You select Move Left on the right-most component. It becomes the middle component. In a WebCenter Portal application, the Move Left icon is displayed to the left of the Move Left submenu item on the component's Actions menu. |
showDetailFrame::light-MoveRightIcon:alias showDetailFrame::medium-MoveRightIcon:alias showDetailFrame::dark-MoveRightIcon:alias
panelCustomizable::light-MoveRightIcon:alias panelCustomizable::medium-MoveRightIcon:alias panelCustomizable::dark-MoveRightIcon:alias |
This icon represents the Move Right option on the component submenu. Move Right rearranges the component horizontally, one position closer to the right boundary of the page. For example, imagine three horizontally arranged components. You select Move Right on the left-most component. It becomes the middle component. In a WebCenter Portal application, the Move Right icon is displayed to the left of the Move Right submenu item on the component's Actions menu. |
showDetailFrame::light-MoveUpIcon:alias showDetailFrame::medium-MoveUpIcon:alias showDetailFrame::dark-MoveUpIcon:alias
panelCustomizable::light-MoveUpIcon:alias panelCustomizable::medium-MoveUpIcon:alias panelCustomizable::dark-MoveUpIcon:alias |
This icon represents the Move Up option on the component submenu. Move Up rearranges the component vertically in relation to the other components on the page. For example, imagine three vertically arranged components. You select Move Up on the middle component. It becomes the topmost component. In a WebCenter Portal application, the Move Up icon is displayed to the left of the Move Up submenu item on the component's Actions menu. |
showDetailFrame::light-MoveDownIcon:alias showDetailFrame::medium-MoveDownIcon:alias showDetailFrame::dark-MoveDownIcon:alias
panelCustomizable::light-MoveDownIcon:alias panelCustomizable::medium-MoveDownIcon:alias panelCustomizable::dark-MoveDownIcon:alias |
This icon represents the Move Down option on the component submenu. Move Down rearranges the component vertically in relation to the other components on the page. For example, imagine three vertically arranged components. You select Move Down on the middle component. It becomes the bottommost component. In a WebCenter Portal application, the Move Down icon is displayed to the left of the Move Down submenu item on the component's Actions menu. |
showDetailFrame::light-HeaderLeftIcon:alias showDetailFrame::medium-HeaderLeftIcon:alias showDetailFrame::dark-HeaderLeftIcon:alias
panelCustomizable::light-HeaderLeftIcon:alias panelCustomizable::medium-HeaderLeftIcon:alias panelCustomizable::dark-HeaderLeftIcon:alias |
This icon provides an image for the top-left corner of the component header. |
showDetailFrame::light-HeaderRightIcon:alias showDetailFrame::medium-HeaderRightIcon:alias showDetailFrame::dark-HeaderRightIcon:alias
panelCustomizable::light-HeaderRightIcon:alias panelCustomizable::medium-HeaderRightIcon:alias panelCustomizable::dark-HeaderRightIcon:alias |
This icon provides the image for the top-right corner of the component header. |
showDetailFrame::light-ToolbarLeftIcon:alias showDetailFrame::medium-ToolbarLeftIcon:alias showDetailFrame::dark-ToolbarLeftIcon:alias
panelCustomizable::light-ToolbarLeftIcon:alias panelCustomizable::medium-ToolbarLeftIcon:alias panelCustomizable::dark-ToolbarLeftIcon:alias |
This icon provides the left portion of the component's FadeIn-FadeOut toolbar. The FadeIn-FadeOut toolbar comes into play when the The toolbar contains the Actions menu that would otherwise be displayed on the header. To invoke the toolbar, users move their mouse over the component content area. If the page design is very simple, then the FadeIn-FadeOut toolbar may not display, even when |
showDetailFrame::light-ToolbarRightIcon:alias showDetailFrame::medium-ToolbarRightIcon:alias showDetailFrame::dark-ToolbarRightIcon:alias
panelCustomizable::light-ToolbarRightIcon:alias panelCustomizable::medium-ToolbarRightIcon:alias panelCustomizable::dark-ToolbarRightIcon:alias |
This icon provides the right portion of the component's FadeIn-FadeOut toolbar. See the description for |
showDetailFrame::light-ToolbarCenterIcon:alias showDetailFrame::medium-ToolbarCenterIcon:alias showDetailFrame::dark-ToolbarCenterIcon:alias
panelCustomizable::light-ToolbarCenterIcon:alias panelCustomizable::medium-ToolbarCenterIcon:alias panelCustomizable::dark-ToolbarCenterIcon:alias |
This icon provides the center portion of the component's FadeIn-FadeOut toolbar. See the description for |
showDetailFrame::light-EditIcon:alias showDetailFrame::medium-EditIcon:alias showDetailFrame::dark-EditIcon:alias
panelCustomizable::light-EditIcon:alias panelCustomizable::medium-EditIcon:alias panelCustomizable::dark-EditIcon:alias |
This icon represents the Edit option on the component menu. In a WebCenter Portal application, the Edit icon is displayed to the left of the Edit menu item on the component's Actions menu. |
showDetailFrame::light-HelpIcon:alias showDetailFrame::medium-HelpIcon:alias showDetailFrame::dark-HelpIcon:alias
panelCustomizable::light-HelpIcon:alias panelCustomizable::medium-HelpIcon:alias panelCustomizable::dark-HelpIcon:alias |
This icon represents the Help option on the component menu. In a WebCenter Portal application, the Help icon is displayed to the left of the Help menu item on the component's Actions menu. |