In this tutorial, you will learn one or two things about extending apps in sapui5. So what does extending apps in sapui5 mean? Well to answer this, let me just tell you there are some standard fiori apps provided by SAP (for e.g. - one of the app is track Sales order). Now there might be a case, where “some functionalities” a particular customer would want apart from the functionalities provided by SAP in those applications. So in that case, the customer would need to make another custom application, having same functionalities that are provided in the particular standard fiori app (just copy the standard app to this custom app). And then the customer would add the particular functionalities that he/she likes in the custom application. 

So to provide these extensions, it is needed to provide some extension points in the application, which we will be taking a look in this tutorial. So here I will tell you the basics of extending apps in sapui5, also I will provide examples, so that this topic will be cleared. 

So, extending SAPUI5 applications supports customers and partners in adapting the SAPUI5 standard application to their specific requirements. For example, you can adapt or replace views, extend or replace controllers, or change language-specific texts. If you want to customize the application, you would be required to configure your component.js file. There is a specific section in the component.js file named as “customizing”. Such a customization can be performed on a custom application that extends a delivered standard application. A replacement or extension of views and custom controllers can also be part of a custom application, but may not always be required. If no replacement and no custom controller exist, the custom application project only contains the component definition with the customization configuration.

The point to note here is that there is no change made to the standard application, the custom app is actually the copy of the standard project, where some additional customization are done.

SAPUI5 supports the following adaptations of the standard:

So, here I have divided the tutorials into sets, so that things won’t be complicated. So follow step by step tutorials, for a better understanding.

To handle localized text while extending apps, follow the tutorial:
http://www.sapui5tutors.com/2016/10/extending-sapui5-apps-handling-localized-resources.html

To configure component.js file according to the extension, follow this tutorial:
http://www.sapui5tutors.com/2016/10/extending-sapui5-apps-component-Configuration.html

To extend a view, follow the tutorial:
http://www.sapui5tutors.com/2016/10/extending-sapui5-applications-view-Extension.html

For tutorial on view modification or view replacement, follow the blog:
http://www.sapui5tutors.com/2016/10/extending-sapui5-apps-view-modification-replacement.html

For tutorial on controller extension, follow the blog:
http://www.sapui5tutors.com/2016/10/extending-apps-in-sapui5-controller_17.html

For tutorial on controller hooks, follow this blog:
http://www.sapui5tutors.com/2016/10/extending-apps-in-sapui5-controller.html

Okay, if you are reading this blog, you probably might know what extending apps in sapui5 means. If you don’t know, or want to exactly know what it means then you should read my previous blog on extending apps in sapui5, where I have clearly mentioned what it really means to extend an application in sapui5.

In this tutorial I will make you understand, how to handle localized text while extending apps. Whenever you copy an application, the texts stored in the SAPUI5 text repository of the original application are not copied and are, thus, not available in the copied SAPUI5 application. This also applies to applications using the extension concepts of SAPUI5.

So, now how to use localized text in the custom application? For that, instantiate a resource model with the URL to the corresponding text properties files of the original application. If needed, you can enhance this resource model with its own properties file. For applications located in the ABAP backend, the resource model of another application located in another SAPUI5 repository in the ABAP backend can be accessed by its relative path.

The following example is valid for an application that is stored in the SAPUI5 repository in the ABAP backend:

var oModel = new sap.ui.model.resource.ResourceModel({bundleUrl:"../<original bsp application name>/i18n/i18n.properties"});

If the code is not located at the root level of the application, adjust the path with additional "../" at the beginning.

You can enhance this with an additional custom text properties file, which resides in the copied application:

oModel.enhance({bundleUrl:"./other18n.properties"});

The custom text properties file can contain additional texts or texts which overwrite the default ones from the original application.

If an SAPUI5 application is extended or copied, the GUID in the SAPUI5 translation key in the copied text properties file must be exchanged with a new one. Each text properties file must contain a unique GUID. You can then upload the application with the new translation key in the text properties file to the ABAP backend by means of the team provider or the /UI5/UI5_REPOSITORY_LOAD upload report. 

So, I hope you understood how to handle localized text in extended sap ui5 application. In the next blog, I will mention the steps to configure the component.js file, for custom extensions to be made.

http://www.sapui5tutors.com/2016/10/extending-sapui5-apps-component-Configuration.html