Icon Filter Bar, Input Form, Table, List, Smart Table using SAPUI5

In this whole application, I have taken Northwind OData, The service URL is: https://services.odata.org/v2/northwind/northwind.svc/

Icon Filter Bar

The icon tab bar comprises a series of tabs that each link to a different content area or view. You can use it for navigation within an object, or as a filter. There are two key use cases:

1. You want to let users navigate between different object facets in the object details area.
2. You want to let users filter lists, and give them the option of calling up the entire list, or only items with a specific attribute.

The Icon tab bar is created using <IconTabBar></IconTabBar> tag.

Now, let us create a SAPUI5 application that consists of an Icon Filter bar, and can be used to navigate to the facets which correspondingly consist of a form, table, list, and a smart table. Where each facet is used to retrieve information that is required for a user in different forms.

View1.view.xml

View1.controller.js

Component.js

manifest.json

Output:

Thank you, Have a nice day! :)