In this blog, I will mention how to modify a view and to
replace a view. Do follow my previous blogs on extending sapui5 apps for better
understanding on the concept of extending applications in sapui5.
Modifying a view
Modifying a particular view, currently is restricted to only
visible property of a particular control, i.e particular controls in a custom
applications can be made hidden. The controls must have the visible
property and the control's ID must be defined in the view. The view name
together with the control ID uniquely determines the control in the standard
application.
View modification is available for XML
views, JS views and HTML views. Below is an example that explains how a view
modification works. The first code snippet describes the Sub3.view.xml
view in the delivered standard application.
<mvc:View
xmlns="sap.ui.commons" xmlns:mvc="sap.ui.core.mvc">
<TextView
text="SAP View 'Sub3' - the text after this one is hidden by customizing:
"></TextView>
<TextView
id="someCustomizableTextControl" text="This text is made
invisible by customization"></TextView>
</mvc:View>
The following code snippet describes
the customizing that identifies the control someCustomizableTextControl
with the visible property set to false.
customizing:
{
"sap.ui.viewModifications":
{
"samples.components.ext.sap.Sub3":
{
"someCustomizableTextControl":
{
"visible":
false
}
}}}
Replacing a view
Views of a particular standard fiori apps, can be replaced
in a custom application, to adapt the customer needs. If the extension points
provided for view extension are not sufficient to meet the requirements of the
custom application, you can replace the standard view with a custom view.
The
following view is delivered in the standard application:
<mvc:View xmlns="sap.ui.commons"
xmlns:mvc="sap.ui.core.mvc">
<TextView text="SAP View
'Sub1' - this one should have been replaced by the customer View"></TextView>
</mvc:View>
This is the custom view to replace the standard view:
<mvc:View xmlns="sap.ui.commons"
xmlns:mvc="sap.ui.core.mvc">
<TextView text="Custom View
'Sub1' - this one replaces the original SAP View 'Sub1'"></TextView>
</mvc:View>
The
following customizing replaces the custom view with the view in the standard
application
customizing: {
.....some more content
"sap.ui.viewReplacements": {
"samples.components.ext.sap.Sub1": {
viewName: "samples.components.ext.customer.CustomSub1",
type: "XML"
}
},
So, this was about view modification and view replacement.
In the next tutorial, you will learn about controller extension.
This is dummy text. It is not meant to be read. Accordingly, it is difficult to figure out when to end it. But then, this is dummy text. It is not meant to be read. Period.
ConversionConversion EmoticonEmoticon