Improve UI Consistency with APEX User Interface Defaults

Improve UI Consistency with APEX User Interface Defaults

·

6 min read

Introduction

I often find myself looking through APEX Builder for something new. Today, I came across APEX User Interface Defaults. As APEX developers, UI consistency is something we should all strive for, and we should use every tool in the box to help us achieve it. APEX User Interface Defaults can help you achieve consistency in your APEX Apps.

This post will focus on the APEX Attribute Directory, which is a part of APEX User Interface Defaults. APEX User Interface Defaults also include the Table Directory, which allows you to perform similar functionality based on table definitions. I hope to cover the Table Directory in a separate post.

What is the APEX Attribute Directory?

The APEX Attribute Directory is a catalog of items/columns for which you can store specific attributes:

  • The Attribute Directory is maintained at the Workspace Level and can be utilized by all Applications in the Workspace

  • Items/columns can be created from fields/report columns on existing APEX pages, imported from other workspaces, or manually entered

  • Each item/column stores the following attributes [Label, Format Mask, Default Value, Help Text, Width, Height, Data Type, and Alignment]

  • Some of these attributes apply to APEX Forms, some apply to APEX Report Columns, and some apply to both

  • Once defined, attributes can be applied to page items and report columns throughout your Application

  • When applied, Attribute Directory attributes override the equivalent attributes in the selected page items and report columns

  • Attributes are not applied automatically; you must initiate the process of applying attributes to page items and report columns manually

Example

In my example, we are building an Accounts Receivable APEX Application. We need to display customer and invoice-related fields in several places throughout the Application. To ensure consistency in our Application, we will start by defining some common Accounts Receivable related items in the APEX Attribute Directory.

Creating Items in the Attribute Directory

🧭 SQL Workshop > Utilities > User Interface Defaults > Attribute Directory

APEX Attribute Directory Table.png

From the above screenshot, you can see that I have created several items/columns and populated various attributes. Let's take a closer look at the TRANSACTION_AMOUNT attribute.

APEX Attribute Directory Trx Amount.png

This detail page is where we define the attributes of the item/column. The attributes are self-explanatory, so I won't go through each one here.

One part of the form that is worth mentioning is the Synonyms section. Here you can add synonyms that APEX uses when looking for items/columns to apply your attributes to. For example, let's say you have a page item called P120_TRX_AMOUNT. The attribute application process (see below) will suggest overriding attributes for P120_TRX_AMOUNT with attributes from TRANSACTION_AMOUNT because there is a synonym called TRX_AMOUNT in the Attribute Directory.

Applying Attributes to Page Items

Now that we have the critical attributes set up, we can apply them to items/columns throughout our APEX Application.

🧭 Application > Utilities > Attribute Directory

APEX Attribute Directory Apply Pages.png

We have two pages with attributes we want to override from our Attribute Directory. One is a Form, and the other is an Interactive Report.

Let's start by clicking on the form page (120):

APEX Attribute Directory Apply Form Analysis.png

APEX provides an overview of the number of page items that are potential or exact matches with items in the Attribute Directory. Hopefully, you can see that APEX dropped the P120_ from the APEX page item names, then with what is left, it looked for matching items/columns (or synonyms) in the Attribute Directory.

For reference, here are the four matching page items as seen in APEX Builder:

APEX Attribute Directory Apply - Form Items.png

Clicking 'Review 4 Items for update' will show the four potential matches and their current attribute values.

APEX Attribute Directory Apply Form Update.png

APEX allows us to apply all or specific attributes to all or particular items. Clicking 'Update Items' will override the attributes on the APEX page with the attributes from the Attribute Directory.

Before and After

Let's take a look at screenshots showing what the UI looked like before and after applying our attributes.

Before

APEX Attribute Directory Form Before.png

After

APEX Attribute Directory Form After.png

So, what changed?

  • The labels have been made consistent with our standard labels

  • All of the fields now have consistent help text

  • The Trx. Amount has had a format string applied

  • The Trx. Date has had a format string applied

Applying Attributes to Report Columns

We can see similar results if we follow the same process for Page 125, which is based on an Interactive Report.

APEX Attribute Directory Apply Form Analysis.png

APEX Attribute Directory Apply Report Update.png

Here is what the IR columns are named in the report definition. APEX used these column names to find appropriate values from the Attribute Directory.

APEX Attribute Directory Apply Report IR Columns. png

Before & After

The before and after UI for the Interactive Report looks like this:

Before

APEX Attribute Directory Report Before. png

After

APEX Attribute Directory Report After. png

I wish there were an attribute for report column header alignment!

Populating the Attribute Directory from Existing Pages

APEX has you covered if you already have several established applications and want to build an attribute directory.

🧭 Application > Utilities > Attribute Directory

APEX Attribute Directory - Import from APEX 1.png

Select a page from where you want to import items/columns to the Attribute Directory. In this case, I selected page 20.

APEX Attribute Directory - Import from APEX 2.png

APEX shows you potential items and report columns to be added to the Attribute Directory. Click 'Review 4 Items for Insert into the Attribute Directory'.

APEX Attribute Directory - Import from APEX 3.png

Select the appropriate attributes and items, then click 'Update Attribute Directory'.

APEX Attribute Directory - Import from APEX 4.png

The final screenshot shows the new items added to the Attribute Directory. You can now change these attributes and re-apply them to your APEX pages.

As well as creating new attributes, APEX will also update attributes in the Attribute Directory based on attributes in your APEX pages. Just follow the same process as above. If APEX finds items that it thinks are already in the Attribute Directory, it will suggest updating them, not inserting them.

Creating Attributes from the Table Directory

At the start of this post, I mentioned another feature of User Interface Defaults is the Table Directory. If you have attributes defined in the Table Directory, you can migrate these to the Attribute Directory. This is a good option for the initial population of your Attribute Directory.

Import / Export

Although you may not often need to migrate the Attribute Directory to other instances, you can export and import the Attribute Directory.

🧭 SQL Workshop > Utilities > User Interface Defaults > Attribute Directory

APEX Attribute Directory - Import Export.png

Room for Improvement

While User Interface Defaults are helpful, this feature could be expanded to include more attributes. I understand that this may be difficult to implement for some attributes (especially dependent ones), but I think it would be worth the effort.

💡If we wanted to reach further, the process could be entirely re-imagined to provide bulk update functionality. 🤔 Imagine that, as a developer, you could define a list of search criteria and a list of attributes and values. Then have APEX perform a bulk update of all impacted components and attributes using your search criteria. This functionality could dramatically improve productivity and substantially improve consistency across your APEX applications.

Conclusion

Hopefully, I have piqued your interest in APEX User Interface Defaults and the Attribute Directory. Having recently discovered it myself, I am interested to see if it is helpful in my goal to develop more consistent User Interfaces for my users.

🔗 Read More