Professional Documents
Culture Documents
0187ea5e2eff4166b0453b9dcc8fc64f
view on: demo kit nightly build | demo kit latest release
Component Metadata
The component class provides specific metadata for components by extending the
ManagedObject class. The UIComponent class provides additional metadata for the
configuration of user interfaces or the navigation between views.
Note: With the introduction of the descriptor for applications, components, and libraries, we recommend to
migrate the component metadata to the descriptor. The descriptor is inspired by W3C’s Web Application Manifest
and provides comprehensive information for applications, components and libraries. For more information, see
Descriptor for Applications, Components, and Libraries. The metadata property manifest must be set to json
to indicate that the manifest.json file should be loaded and used:
sap.ui.core.Component.extend("some.sample.Component", {
"metadata": {
"manifest": "json"
}
});
You can also define the descriptor inline by just providing an object. However, we do not recommend this because
this would prevent that the descriptor can be analyzed by tools.
• abstract: Specifies if your component class is an abstract class that serves as a base
for other components
• version: Version of your component; this parameter belongs to the design time
metadata and is currently not used; it may be used in the future in the design time
repository
The following properties are deprecated and no longer needed if you use the descriptor:
• includes: Array of strings containing the paths to CSS and JavaScript resources for
your component; will be added to the header of the HTML page and loaded by the
browser. The resources will be resolved relative to the location of Component.js.
• dependencies: Used to specify all external dependencies, such as libraries or
components. Like the includes for resources that are added to the application’s HTML,
the dependencies are loaded by OpenUI5 core before the component is initialized.
Everything that is referenced here can be used in your component code right from the
start. Specify here external dependences such as libraries or components, that will be
loaded by OpenUI5 core in the initialization phase of your Component and can be used
after it.
– libs: Path to the libraries that should be loaded by OpenUI5 core to be used in
your component
• config: Static configuration; specify the name-value pairs that you need in the
component
sap.ui.core.Component.extend("some.sample.Component", {
"metadata": {
"manifest": "json", // Specifies that your Component class uses the
descriptor via the manifest.json file
"abstract": true, // Specifies if your Component class is an abstract
one that serves as a base for your other components
"library": "sap.ui.core", // Specifies the library the component
belongs to
"version": "1.0", // Version of your Component
"properties": { // Defined for components in the same way as for a
control or view
"config": "any"
}
}
});
In addition to the common metadata for components, the UIComponent class provides the
following metadata for UI compnents:
• publicMethods: Definition of public methods for your component
The following properties are deprecated and no longer needed if you use the descriptor:
• rootView: Can be the view name as string or the view configuration object
– config: Default values for routing that are applied, if no setting is specified by a
route
• viewType: View type of the view that is created, for example XML, JS or
HTML
• pattern: String that is matched against the hash. The {} means this
segment of the URL is passed to a handler with the value it contains
sap.ui.core.UIComponent.extend("some.sample.UIComponent", {
"metadata": {
"publicMethods": [ "render" ],
"aggregations": {
"rootControl": {
"type": "sap.ui.core.Control", multiple: false, visibility:
"hidden"
}
}
}
}),
sap.ui.core.UIComponent.extend("samples.components.shell.Component", {
"metadata": {
"abstract": true,
"version": "1.0",
"properties": {
"appTitle": {
"name":"appTitle",
"type":"string",
"defaultValue":"Default Value that will be replaced with
something meaningful through the setter for this property"
},
"someOtherProp": {
"name":"myProperty",
"type":"string",
"defaultValue":"Some text"
}
}
}
});
The getters and setters for these properties are generated automatically and can be
overwritten if additional functionality is required.