Sun. Jan 17th, 2021

Explanation: Bounded task flows built with page fragments are displayed by using an ADF region (af:region) component.

The ADF region is the place holder component that allows the dynamic contents to be included in the parent page. When we run a page with a region, the region component peeks into the underlying for identifying the view to be displayed and instantiates the view. In general, ADF uses the af:region tag to display bounded task flows built with page fragments.

ADF allows us to embed a region in a page or page fragments. We should note that regions are capable of triggering the navigation of contents in its own display area (view port) without affecting the other regions or parent page. This is the reason why we are able to navigate between pages in bounded task flow added inside the region, keeping the parent view from being affected.

To build an ADF region containing task flow, perform the following steps:

  1. Drag and drop the bounded task flow onto the page.
  2. In the context-menu select Region. If the task flow that we dropped takes parameters, IDE will display the Edit Task Flow Binding dialog window for specifying the parameter values.
  3. Click on OK to save the changes.

A single JSF page can contain many task flows added as regions and each region may contain different content as shown below:

Requirement: I have a regionDemo.jspx page. On that page I will have three sections displaying Departments, Locations, and Countries informations.

Solution: For a demonstration of the above requirement we will use the Departments, Locations, and Countries tables of the HR schema of the Oracle Database.

For solution to the above requirement follow the steps as shown below:

Step 1: Create an Oracle ADF Fusion Web. Name the application as regionDemo.

Step 2: Create an Oracle ADF Business Components from Tables. We will be creating all the three ADF Business Components that is entity objects, view objects and application module for all the three tables: Departments, Locations, and Countries tables

Thus the created ADF Business Components are shown below:

Step 3: Open ViewController project and create three Bounded Task Flows and name it as: countriesBTF, departmentsBTF, and locationsBTF.

Step 4: Open countriesBTF and drag and drop view activity form the component palette on the countriesBTF. Name the view activity as countries. Double click on the countries view activity to create the countries.jsff. Now go to Data Controls > Expand AppModuleDataControl > Select CountriesVO1 >Drag and drop CountriesVO1 on the countries.jsff as an ADF Table.

Open departmentsBTF and drag and drop view activity form the component palette on the departmentsBTF. Name the view activity as departments. Double click on the departments view activity to create the departments.jsff. Now go to Data Controls > Expand AppModuleDataControl > Select DepartmentsVO1 > Drag and drop DepartmentsVO1 on the departments.jsff as an ADF Table.

Open locationsBTF and drag and drop view activity form the component palette on the locationsBTF. Name the view activity as locations. Double click on the locations view activity to create the locations.jsff. Now go to Data Controls > Expand AppModuleDataControl > Select LocationsVO1 > Drag and drop LocationsVO1 on the locations.jsff as an ADF Table.

Step 5: Create regionDemo.jspx page. Drag and drop af:panelGridLayout inside the regionDemo.jspx. The af:panelGridLayout will have three columns and one row as shown below:

Step 6: Drag and drop three af:panelStretchLayout inside each of the af:gridCell and set the dimensionsFrom=”parent“.  Each of the af:panelStretchLayout should have two f:facet that is             f:facet name=”center” and f:facet name=”top”.

Also change the width of the first af:gridCell as width=”24%” and chnage the width of the third af:gridCell as width=”43%”.

Drag and drop three af:outputText inside each f:facet name=”top” and set the values as Countries Table, Departments Table and Locations Table. Also set the font-size:large;

Drag and drop countriesBTF, departmentsBTF, and locationsBTF inside each of the f:facet name=”center” as a ADF region (af:region).

Step 7: Save all and run the application. Thus the ran application is shown below:

ADF Task flow is powerful feature of Oracle ADF which provides a great usability and provides a modular approach defining control flow in the application and Page fragments gave us re-usability.

Hence, the solution to our requirement.

If you like the post please comment, share, and do join me on Facebook. Please subscribe to my YouTube Channel for video tutorials.

Thanks & Regards,
Susanto Paul

 136 total views,  1 views today

By Susanto Paul

Susanto is an Oracle ACE, a qualified MCA, MBA, and a highly-skilled Senior Oracle Specialist. He is an enthusiastic Blogger and YouTuber who helps learners to solve their complex problems more efficiently. He has 9+ years of experience in multiple technologies like AWS, Oracle ADF, Oracle APEX, Oracle JET, Oracle VBCS, Oracle IDCS, Oracle PL/SQL, Oracle Integration Cloud, Java, JDBC, Servlets, JSP, Spring, Hibernate, HTML5, CSS3, JavaScript, TypeScript, NodesJS, Angular, MySQL, Oracle WebLogic Server, JUnit, JMeter, Selenium Web Driver, etc. He is a certified: Oracle Certified Professional Java SE 6 Programmer, Oracle ADF 11g Certified Implementation Specialist, Oracle Cloud Platform Application Integration 2020 Certified Specialist, Oracle Cloud Infrastructure Foundations 2020 Certified Associate, and Oracle Cloud Infrastructure Developer 2020 Certified Associate

Leave a Reply

Your email address will not be published. Required fields are marked *