Displaying Images

Description

Displaying images It can be useful to the mobile user.

Introduction

The built-in item image feature must be enabled using Mobile Configuration Files.

Contents

How Images are requested from the backend

Images on Order lines

Mobile Configuration Files application.cfg "listConfiguration" has imageElements to define when to display images.

"imageElements" uses a value named "ItemImage".

Flow

The Mobile app requests document type "GetOrderLines"

1. The reponse includes the "ItemImage" value for each line
2. The value is a combination of Item No. and the DateTime when the image was changed
The Mobile app requests document type "GetMedia" for each image
1. These requests are sent ad-hoc, one after the other
2. The images will appear to the user, one by one

Mobile app requests images when

The images has not yet been requested
"ItemImage" value has changed = the image has changed in the backend

Guidelines for format, sizes and file type

Format / file type

Currently there is support for JPG, PNG, GIF and SVG.
However in general we advice to use either JPG or PNG and only use SVG or GIF if there is a very specific need for these.

You can find a description of the different formats/file types here:

https://www.practicalecommerce.com/Image-Formats-What-s-the-Difference-Between-JPG-GIF-PNG

PNG vs JPG

This table shows the advantages of the two types.
The Mobile WMS application have different backgrounds when showing the registration collector or showing lists.
Therefore if you have the option to use transparent background in the images then you should use png images however if you have a background that you are always using on the images that might also work for the jpg.

Image source: https://www.digitaltrends.com/photography/jpeg-vs-png/

Pixels and Mb (file sizes)

Pixels

Images can have different height and width but it is rare that we see a need for an image larger than 500 x 500 pixel.

If the "show image" feature is in use the format should minimum be 250 pixels.

Size

The smaller the file size the faster the images will be transferred to the device. In general it is a good idea not to use images about 150 Kb and smaller is preferred however if there is only a few lines on each page then larger images will also work smoothly.

Notice for PNG file it is often possible to save them as a 8-bit file that will reduce the size of the image a lot.

Summary

Recommended

Other considerations

File type

PNG

JPG can also be used if the images has a background.
SVG and GIF are also support but should only be used if necessary.

Notice for PNG file it is often possible to save them as a 8-bit file that will reduce the size of the image a lot.

Format / Pixels

Max 500 x 500

Max 1000 x 1000 for tablets

If "show image" feature is in use minimum 230 pixels in height and width.

The is not constraint for height and width so the can vary in size independently.

Size

5-60 Kb

Max 150 Kb depending on how many lines per page.
Large images can be handled but will slow the showing of images down.

Backend requirements - GetMedia

Request

<?xml version="1.0" encoding="ISO-8859-1"?>
<request xmlns="http://schemas.microsoft.com/Dynamics/Mobile/2007/04/Documents/Request" created="2018-10-30T20:02:47+01:00" name="GetMedia">
  <requestData name="GetMedia">
	<mediaIds>
		<image>TF-001_201001013344</image>
		<image>TF-002_201001013344</image>
	</mediaIds>
	<screenHeight>497</screenHeight>
    <screenWidth>320</screenWidth>
  </requestData>
</request>

The MediaID is the value sent to the backend to identify the image. The MediaId origins from a property received from the backend so that the value e.g. contain a date for when it was updated. E.g. TF-001_201001013344.

Response

<?xml version="1.0" encoding="ISO-8859-1"?>
<response status="Completed" messageid="09F553A1-24F9-41B3-93CF-DA242C677633" xmlns="http://schemas.microsoft.com/Dynamics/Mobile/2007/04/Documents/Response">
  <description/>
  <responseData>
    <media>
      <image id="TF-001_201001013344">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</image>
	  <image id="TF-002_201001013344">....</image>
  	</media>
  </responseData>
</response>

Where you can use images

Image elements on ListConfigurations

<imageElement height="5%" width="5%" dataMember="Status" horizontalAlignment="right" verticalAlignment="bottom" actionid="" >
<values>
<value imageId="unlocked" dataMemberValue="1" />
<value imageId="locked" dataMemberValue="2" />
</values>
</imageElement>

<imageElement width="25%" height="25%" sourceId="{ItemNumber}" horizontalAlignment="right" ></imageElement>

<textElement fontId="contentFont" text="{DisplayLine5}" />

Order Lines

List configuration

Extended view (Long renderer)

ImageElement on list element. Load the images in another thread that can be cancelled.

Show image from menu

<BaseOrderLine xmlns="http://schemas.taskletfactory.com/MobileWMS/BaseDataModel">
 <OrderBackendID>RE000111</OrderBackendID>
 <LineNumber>20000</LineNumber>
 <FromBin/>
 <ValidateFromBin>false</ValidateFromBin>
 <ToBin/>
 <ValidateToBin>false</ValidateToBin>
 <ItemNumber>TF-002</ItemNumber>
 <ItemBarcode>3046920028370</ItemBarcode>
 <
..
we add the information just like the lookup with a property collection
..

 </BaseOrderLine>

Lookup item

It is possible to add and image to the help label in html.
Here an example where an image is sent as a base64 string: response.xml

It is also possible to an image to the help label via html as a img href.

Locate item

The locate item uses a list configuration therefore it will also be able to show the image.

Show Image

    <page id="ReceiveLines" type="OrderLines" icon="mainmenureceive">
      <title defaultValue="@{PageReceiveOrderLinesTitle}"/>
      <orderLinesConfiguration promptUserToPostWhenAllLinesComplete="true" suggestQuantity="true" verifySingleScanRegistrations="false">
		...
      </orderLinesConfiguration>
      <actions>

--->	<showImage enabled="true" title="Show Image" imageProperty="ItemNumber" /> 

        <open icon="mainmenuscaninfo" id="ItemCrossReference" title="Add cross reference">
		...
        </open>
      </actions>
    </page>