Skip to Content
Technical Articles

Adding Custom Control under ‘App Settings’ of a FIORI/UI5 App

Hi All,



Sometimes there are scenarios when you need to provide a feature in your app, which is only relevant for a small set of End-Users of the App.

Also, this feature could be like a one-time configuration or a switch which means the user will not be using it frequently.

Such kind of feature shouldn’t be directly made available to End-Users of the App as it may not be relevant for everyone because of above reasons & also the real estate could be utilized for something important.

Recently I came across such a situation and have used the below approach 🙂




This is how a custom control in App Settings would look like




In ‘onAfterRendering’ method of controller file of your default view, add the below code


onAfterRendering: function () {
	let oAppConfig =,
		// Text of button
		sMenuItemText = this.getResourceBundle().getText("textMenuItemSCN"),
		that = this;

	// Initializing the Fragment, as the data is not available untill the App setting button is clicked.
	if (!this._oAppSettingDialogSCN) {
		this._oAppSettingDialogSCN = sap.ui.xmlfragment("xxxxxx.fragment.AppSettingSCN", this);

	let oAppSettingsBtnSCN = new sap.m.Button({
		text: sMenuItemText,
		press: function (oEvent) {
			if (!that._oAppSettingDialogSCN) {
				that._oAppSettingDialogSCN = sap.ui.xmlfragment("xxxxxx.fragment.AppSettingSCN", that);



Run the App & you should see the button under ‘App Settings’.

Click on this button should open your fragment.


Please let me know if you have any suggestions or feedback.




Be the first to leave a comment
You must be Logged on to comment or reply to a post.