KNOWLEDGE BASE
Log In    |    Knowledge Base    |    4D Home
Tech Tip: How to use images as custom data formats in mobile app
PRODUCT: 4D for iOS | VERSION: 18 R | PLATFORM: Mac
Published On: July 6, 2021

When developing a 4D for iOS mobile app, you can implement custom data formatters to allow for a more interesting user interface/experience. One type of custom data format to implement are integer to image icons. This type of data format will convert integer data to images. To create image icons as a data format, first create a Mobile/formatters/integerToImage/Images directory in the Resources folder. Inside the Images folder, place the images you would like to use for the icons, and take note of the file names. Then, create a file named “manifest.json” that contains JSON data like this:

{
"name": "integerToImage",
"type": ["integer"],
"binding": "imageNamed",
"choiceList": {*Integer-to-Image Mapping*}, "assets": {
"size": { "width": *desired width*, "height": *desired height* }}}

In the “choiceList” object, create a mapping of the integer-to-image file names. For example, to convert all 1’s to a certain image, say imageFile.png, add “1”:”imageFile” as a key-value item. In the "size" object, you can control the width and height of the icons. Afterwards, put the manifest.json file next to the Images folder. Finally, in the Labels & Icons section of the 4D for iOS editor, go to the desired field to format and select the “integerToImage” format.