Cards play an important role in web design. So, in APEX 20.2, we got a brand new “Cards Region” that enables us to display valuable information in something like blocks. We can add images, text, and video inside a card to make it attractive.
Without any further delay, let’s create a new APEX project and integrate a “Cards Region” on a web page.
Prerequisites
To follow along with this tutorial, you must have a working instance of APEX 20.2. You can either create a free workspace on Oracle APEX to try it out or maybe buy a reliable APEX hosting.
We will also use a sample dataset “EMP / DEPT” to stay focused on the Cards Region demo.
Getting Started
Let’s start by creating a new APEX application.
Here we need to add a new “Cards” page that will automatically retrieve data from the data source and display it inside cards. Simply click the “Cards” button.
You will be asked to enter a few details about the page. A point to be noted is that I used the “EMP” table from the sample dataset. It will automatically select the values for the “Title Column” and “Body Column” dropdown.
Meanwhile, in the “Icon Initials Column”, I selected “ENAME” whereas “DEPTNO” was inside the “Badge Column”.
Now, hit the “Add Page” button.
At this point, our cards page is ready with all the functionality. So, simply press the “Create Application” button.
It will take a moment to set up everything.
Now, let’s click the “Run Application” button to proceed.
You will be asked to enter the login credentials. Simply type the details you used while creating the workspace.
Once logged in, you will be redirected to the home page of your newly created app. Here, you can see that our cards page is also available. Click on it to try the new card region.
Now, it’s time to see the cards region in action. Here, you can see that the employee records are nicely arranged inside separate blocks.
Interesting Facts
A great thing about the cards region is that we can easily integrate it with faceted search functionality. It means that we can perform complex queries to retrieve the required records in no time.
Similarly, a card’s region gave us the ability to display the result in either grid, float, or horizontal (row) format.
Oracle APEX enables us to customize the look and feel of cards however we like. We can even add actions to the entire card widget or mark a specific image, icon, text, etc. as a button.
Conclusion
Traditionally, cards are used in different software designs, especially websites to briefly present information. They are pretty useful inside the admin panel’s dashboard or reports section. So, the APEX developers have introduced it in their latest release of version 20.2.
I hope you are now familiar with the new cards region and how to use it. So, it’s time to go ahead and try to customize it yourself. I would even recommend you to integrate it into your new or existing projects
