Oracle by Example brandingOracle Application Express 18: Create Application Wizard (2 of 2) - Running the Wizard

section 0Before You Begin

This 10 minute tutorial shows you how to create an application by using the Create Application Wizard in Oracle Application Express 18 or later. This is the second tutorial in the series Oracle Application Express 18: Create Application Wizard. Read the tutorials in sequence:

Background

The Create Application Wizard enables you to create applications in Oracle Application Express 18.1 or later. To create an  application, you must add pages, define navigation, define theme and style, add features and configure settings of the application in the Create Application Wizard. 

In this OBE, you will learn how to create the application Create App Wizard by using the Create Application Wizard in Oracle Application Express 18.1 or later.

What Do You Need?

To complete this tutorial you need to:

  • Complete the preceding tutorial in this series.

Accessing your Development Environment

How you sign in and access Oracle Application Express depends upon where Oracle Application Express resides. Oracle Application Express may reside in a local on-premises Oracle Database or in a hosted environment, such as the Oracle Cloud. The sign in credentials you use to sign in differ depending upon the installation type.

  • Free Workspace: Give Oracle Application Express a test run by signing up for a free workspace. To request an evaluation workspace, go to apex.oracle.com, and click Get Started for Free.
  • Oracle Cloud: Develop and deploy applications without worrying about infrastructure, repair, and downtime. Oracle Application Express is available in Exadata Express Cloud Service and Database Cloud Service. However, you need to manually customize your databases to install and enable Oracle Application Express. To learn more, see Oracle Database Cloud Service.
  • Oracle Application Express On-premises: Install Oracle Application Express directly within any Oracle Database and then sign in to your workspace using your sign in credentials. For details on your sign in credentials, contact your administrator or see Oracle Application Express Installation Guide.
  • Oracle Application Express Pre-Built VM: Install a Pre-Built Virtual Machine (VM) which includes an Oracle Database and Oracle Application Express 18.1. To learn more, see Hands-On Lab.
    Once the VM is installed, start the VM:
    • Click the big red circle labeled Start.
    • Click the APEX shortcut, or enter the following URL: http://localhost:8080/ords/f?p=4550:1.
    • When prompted to sign in, enter the sign in credentials (unless given other credentials to use):
      • Workspace: obe
      • Username: obe
      • Password: oracle

Note your Application ID may be different when compared to the screenshots in this tutorial. Your Application ID is assigned automatically when you create the application.


section 1Create an Application

To create an application:

  1. Sign in to Oracle Application Express 18.1 or later by entering the credentials:
    •  Workspace: Enter obe
    •  Username: Enter obe
    •  Password: Enter oracle
    •  Workspace: Enter hr
    •  Username: Enter hr
    •  Password: Enter oracle
  2. On the Workspace home page, click  App Builder.
    app_builder
    Description of the illustration app_builder.png
  3. Click Create.
    create
    Description of the illustration create.png
  4. In the Create an Application dialog, select New Application.
    create_an_app
    Description of the illustration create_an_app.png
  5. Click Next. The Create an Application dialog opens.
  6. In the Name field, enter the name Create App Wizard.
  7. Click Set Appearance to change the appearance of the application.
    set_appearance
    Description of the illustration set_appearance.png
  8. In the Appearance dialog, set the following:
    • Theme Style: Select  Vita Red
    • Navigation: Select Side Menu
    • Application Icon: Select Choose New Icon
      • In the Choose Application Icon dialog, click app_theme and select the icon app_icon.
      • Click Set Application Icon.
  9. Click Save Changes. 

section 2Add Pages

Oracle Application Express offers you different types of pages that you can add in your application. You can add more pages in your application by using the Create Page Wizard.

In this section, you will learn how to add the following pages in the application Create App Wizard.

2.1 Add a Calendar

The Calendar page displays a calendar in your application with the attributes that you define here. In this section, you will create a calendar based on the SAMPLE$PROJECTS_TASKS table. In this calendar, you can view the tasks against the dates, as applicable. 

To add a calendar in the application:

  1. On the Create an Application page, click Add Page.
  2. Click Calendar.
  3. On the Add Calendar page, define the following attributes:
    •  Page Name: Enter Tasks Calendar.
    •  Set Icon: Select the icon Icon for Calendar page to be displayed in the navigation menu for this page.
    •  Table or View: Select SAMPLE$PROJECT_TASKS.
    •  Display Column: Select NAME.
    •  Start Date Column: Select START_DATE.
    •  End Date Column: Select END_DATE.
    •  Show Time: Select NO to show the time portion for events and also enable the Weekly and Daily calendar views. Select No to only show the dates for events.
  4. Click Add Page. The Tasks Calendar page appears under Pages in the Create Application wizard.

2.2 Add an Editable Interactive Grid

The Interactive Grid page allows you to update data directly. It is similar to a spreadsheet. An interactive grid presents you a set of data in a searchable, customizable report. In this section, you will create an editable interactive grid on the table SAMPLE$PROJECTS_MILESTONE.

To add an interactive grid:

  1. In the Create Application wizard, click Add Page.
  2. Select Interactive Grid.
  3. On the Add Interactive Grid page, define the following attributes:
    •  Page Name: Enter the name Milestones.
    •  Set Icon: Click this icon to select the image which displays in the navigation menu for this page. In the Select Icon dialog, search for "table" and select this image Icon for Milestone page to be displayed in the navigation menu for this page.
  4. Select Table or View to set it as the data source for the interactive grid. When you select Table or View, the Table or View field appears to select the data source table.
  5. In the Table or View field, select SAMPLE$PROJECTS_MILESTONES.
  6. Select Allow Editing to render the interactive grid as editable.
  7. Click Add Page. The  Milestones page appears under Pages in the Create Application wizard.

2.3 Add an Interactive Report with Form

In this section, you will create an Interactive Report with Form on the table SAMPLE$PROJECT_TASKS. You choose the table on which to build a report, or provide a custom SQL SELECT statement or a PL/SQL function returning a SQL SELECT statement. You then choose the report type that is, Interactive Report or Classic Report.

To add an interactive report with form:

  1. In the Create Application wizard, click Add Page.
  2. Select Report.
  3. On the Add Report page, define the following attributes:
    •  Page Name: Enter Tasks
    •  Set Icon: Select the icon Icon for Maintain Projects to be displayed in the navigation menu for this page.
  4. Click Table or View to set the data source.
  5. Click Interactive Report to render this report as an interactive report in the application Create App Wizard.
  6. In the Table or View drop-down list, select SAMPLE$PROJECT_TASKS.   
  7. Select Include Form to include a linked form page to enable users to maintain the table values.
  8. Expand Lookup Columns to define the lookup columns and the corresponding display columns. In this OBE, we will define two lookup columns as follows: 
    • Lookup Key 1: Defines the column to change to output the display column. Select PROJECT_ID.
    • Display Column: Defines the the column from the lookup table to be displayed. Select SAMPLE$PROJECTS.NAME
    • Lookup Key 2: Select MILESTONES_ID
    • Display Column 2:  Select SAMPLE$PROJECTS_MILESTONES.NAME
  9. Click Add Page. The Tasks page appears under Pages in the Create Application wizard.   

2.4 Add a Chart

In this section, you will create a bar chart on the table SAMPLE$PROJECTS_TASKS to depict the project cost. Along the x axis, the project ID is plotted, and along the y axis, the cost of each project is depicted. 

To add a chart:

  1. In the Create Application wizard, click Add Page.
  2. Select Chart.
  3. Enter the following attributes:
    •  Page Name: Enter Project Costs
    •  Set Icon: Select the icon Icon for Charts page to display in the navigation menu for this page.
    •  Chart Type: You can select the type of chart to display such as Area, Bar, Line, Pie. For this tutorial, select Bar.
    •  Table or View: Select SAMPLE$PROJECTS_TASKS
    •  Label Column: Select PROJECT_ID
    •  Select Sum.
    •  Value Column: Select a numeric column from the table or view which is used to calculate the chart values displayed. Select COST. This will provide you the sum of the cost based on the SAMPLE$PROJECTS_TASKS table.
  4. Click Add Page. The Project Costs  page appears under Pages in the Create Application wizard.

2.5 Add a Dashboard

A dashboard page contains multiple charts. In this section, you will create two charts, a bar chart and a pie chart to depict project budget and project status respectively. You will create both these charts on the table SAMPLE$PROJECTS.

To create a dashboard page:

  1. In the Create Application wizard, click Add Page and select Dashboard.
  2. In the Page Name field, enter the name Dashboard.
  3. Set icon: Select  Icon for Dashboard page to display in the navigation menu for this page.
  4. Click Chart 1 to create the first chart and enter the following details:
    •   Chart Type: Click Bar
    •   Chart Name: Enter Project Budgets
    •   Table or View: Select SAMPLE$PROJECTS
    •   Label Column: Select Name
    •   Select Column Value
    •   Value Column: Select Budget
  5. Click Chart 2 to create the second chart and enter the following details:
    •   Chart Type: Click Pie
    •   Chart Name: Enter  Project Status
    •   Table or View: Select  SAMPLE$PROJECTS
    •   Label Column: Select Status_ID
    •   Select Count
    •   Value Column: Select All Columns
  6. Click Add Page. The Dashboard page appears under Pages in the Create Application wizard.  

2.6 Add a Report

In this section, you will creates a report with form based on the table SAMPLE$PROJECTS_STATUS and make it an administrative page. This means that this report will be accessible only to the administrator and not to all users of this app. The report displays information about project status, project ID, created by, updated by and so on. Once you run the report, you can perform various functions such as define views, download report, subscribe and so on by clicking Actions on the report.  

To create the report:

  1. In the Create Application wizard, click Add Page and select Report.
  2. In the Page Name field, enter the name Statuses.
  3. Select Table or View and Interactive Report.
  4. In the Table or View field, select SAMPLE$PROJECTS_STATUS.
  5. Select Include Form.
  6. Now, to set this page as an administrative page, click Advanced and select Set as Administrative Page. This renders the page as an administrative page that can be accessed by the user with administration role. 
  7. Click Add Page. The Statuses page appears under Pages in the Create Application wizard.

section 3Edit Pages

The Create Application Wizard allows you to organize and delete pages that you have added in an application. In the Create an Application page of the wizard, you can:

  • Arrange the pages in the order that you want them to appear in your application
  • Remove pages

To reorder pages:

  1. In the Page section of the Create an Application wizard, click and Drag to Reorder page icon at the end of each page listing.
  2. Drop that page in the order that you prefer in the list. In this tutorial, drag and drop the pages in this order:
    • Dashboards
    • Milestones
    • Tasks
    • Task Calendar
    • Project Costs
    • Statuses

Note: The home page is always displayed first and cannot be reordered.

Administrative pages are always displayed at the bottom of the list and the order dictates how they appear in the Application Administration list on the Administration page.


section 4Add Features

Oracle Application Express offers the following features that you can add to your application. You can any one or all of the features. In this tutorial, you will apply all of these features. In the Features section of the Create Application Wizard:

  1. Select Check All to apply all the features in your application. The available features are:
    •  About Page: To include a description about the application page.
    •  Access Control: To incorporates role based user authentication within your application.
    •  Activity Reporting: To includes numerous reports on end user activity for your application.
    •  Configuration Options: To enables application administrators to enable or disable specific functionality within the application.
    •  Feedback: To provides a mechanism for end users to post general comments back to the application administrators and developers.
    • Theme Style Selection: To enables administrators to customize color scheme (theme style) for the application. You can define the default theme style, and select various theme styles.


section 5Configure Settings

In the Settings section, specify the settings used in the generation of the application. You can configure the following settings under the Settings section:

  • Application ID: This field contains an automatically generated identifier by default. You may enter a unique, numeric identifier for your application.
  • Schema: Select the database schema that stores database objects, for this application Create App Wizard.
  • Language: English (en).
  • Authentication: Select an option on how you want users to authenticate into your application.
  • Advanced Settings: Set additional definition, security and globalization settings. You can apply these settings when creating the application, and edit them after creating the application. Click Advanced Settings, and enter the following in the Advanced Settings window:
    •   Short Description: Maintain Project Details
    •   Description: Allows users to insert, update, and delete all of the details related to project management including projects, milestones, and tasks.
    •   Click Save Changes.
  • User Interface Defaults: Set defaults for user interface settings, such as rows per page, and add list of values definitions. These settings are used when generating components within the application.

section 6Create and Run the Application

After you have completed adding the pages, and features, you must first create the application and then run it. To create and run the application:

  1. To create the Create App Wizard app, click Create Application in the Create an App wizard.
    The application creation process begins. The progress bar indicates the progress.
    The Create Application button in Create App Wizard
    Description of the illustration create_application.png
    Once the application creation is complete, the application is displayed in the App Builder home page, as shown in the screenshot. You can see that the home page displays the application ID, application name, the pages that you created, and a number of additional pages that are created to implement the features that you selected. Run the application to implement it.
    app homepage
    Description of the illustration create_app_wizard_homepage.png
  2. To run the application, click Run Application in the App Builder home page. You are redirected to the sign in page of the application Create App Wizard.
    The Run Application icon
    Description of the illustration run_app.png
  3. Sign in to the application using your credentials. The Create App Wizard application opens as shown in the screenshot.
    the create app wizard
    Description of the illustration the_app.png
    This completes the task of creating an application by using the Create an Application Wizard.

more informationWant to Learn More?