Home Blog Acumatica Mobile Framework: Simple Customization to Display Codes in the Mobile App

Acumatica Mobile Framework: Simple Customization to Display Codes in the Mobile App

Nicole Ronchetti | June 8, 2022

Acumatica Mobile Framework: Simple Customization to Display Codes in the Mobile App

Introduction

Acumatica’s Mobile Framework is an amazingly easy tool to work with. You do not need to learn how to program for IOS or Android. By using the Customization Project Editor within Acumatica, we can customize the mobile interface with very little code. Here, we will look at how to modify the display of certain fields in a Generic Inquiry on the Mobile app.

We can easily add generic inquiries to the mobile app in Acumatica, by simply clicking on the Expose to Mobile check box when creating the GI.

Customization Project Editor.

However, when we compare this screen on the desktop with what we see on the mobile app, you’ll notice a few issues. First, the mobile app will automatically render the Item and Vendor with the descriptions instead of the code (CD). So, we see the Item Description field twice. In addition to that, our Safety Stock field which is a calculated field in the GI appears to be editable.

Acumatica Mobile vs Desktop Framework.

To correct these display issues, we will create a customization project to add a new screen to display the generic inquiry on our Mobile Application.

First, create a customization project. In the Customization Project Editor in Acumatica, under Mobile Application select Customize > Add New Screen. In the dialog box that appears, select the Screen ID which corresponds to the Generic Inquiry you wish to display.

Product Dashboard - Mobile Application

Under Commands, add the container and fields as seen below. These field names will correspond to the caption of the column in the generic inquiry.

I’ve set the selectorDisplayFormat on the Item and Warehouse to key to display the key value (our code) instead of the description. I’ve also set the Vendor to display KeyDescription which will give me a combination of both Key and Description and I’ve set the forceIsDisabled for the Safety Stock field to true so that field will be disabled.

Acumatica Dashboard Editor

Next we need to update the menu in the mobile app. Under Mobile Application in the Customization Project Editor select Customize > Update Main Menu.

Under Mobile Application in the Customization Project Editor select Customize > Update Main Menu.

Next we will add some simple code to add this item to the menu.

Adding some simple code to the menu.

When done, hit save and publish the project.

Mobile Overview - Publishing the Project.

Now, when we look at our Mobile application, we will see all of our changes. The Product Dashboard icon now appears on our main menu with the new icon.  When viewing our list, we can now see the inventory codes displayed and well as our other changes to the various fields.

Summary

In this blog post, I’ve shown you a very simple method to make customizations to mobile apps with very little code. But hopefully, this provides you a good introduction as to how easy it is to customize Acumatica’s Mobile interface. Using the Customization Project Editor, we are able to modify the mobile interface without any programming for IOS or Android.

To learn more on how to customize the Acumatica mobile interface, check out the T400 and T410 courses on Acumatica’s Open University.

Blog Author

Nicole Ronchetti is a Senior Technical Consultant within the Acumatica practice at DSD Business Systems. Prior to her role at DSD, Nicole spent 15 years as an ERP end-user, managing all aspects of their ERP software throughout a thriving organization in the sporting goods industry. In 2010, she chose to focus on consulting full time with an emphasis on development over the last five years.

Receive blog updates in your Inbox.