Exchangeable Image File Format (Exif)
Exchangeable image file format (Exif) is a standard that defines the image formats used by some digital cameras and smartphone cameras. The metadata tags of the Exif standard hold a broad range of information ranging from the image's date-time and geolocation to camera settings and image composition details. When an Exif image is converted to Base64-encoding, the metadata in the image is also converted to Base64, and is available for retrieval.
| Note: | Not all digital cameras or smartphone cameras provide Exif data. |
MobileTogether Designer's Exif functionality
MobileTogether Designer provides the following Exif-related functionality:
•The Let User Choose Image action provides an option that starts the camera application on the end user's client device. The photo that is taken is saved in an XML node as a Base64-encoded image. If the camera application uses the Exif format, then Exif metadata is also saved in the Base64-encoded image. This data is available for immediate retrieval from the XML node.
•An Altova XPath extension function called image-exif-data takes a Base64-encoded JPEG image as its argument and returns the Exif metadata contained in the string as attribute-value pairs. (See the description of the image-exif-data function for details. To find just the dimensions of images, use the MobileTogether XPath extension function mt-image-width-and height.)
•An Altova XPath extension function called suggested-image-file-extension takes a Base64 string as its argument, and returns an image file extension (such as jpg, png, bmp). This is useful for automatically detecting the correct image format and saving the file with an appropriate file extension.
•The Load/Save Image to File action enables a Base64-encoded image to be saved in a binary image format (such as jpg, png, bmp). Exif data is saved in the Base64-encoded text.
The example below explains how Exif data can be retrieved from a Base64-encoded image, and how this data can be used in a solution.
Example file: Base64Images.mtd
The design file Base64Images.mtd is located in your (My) Documents MobileTogether folder: MobileTogetherDesignerExamples\Tutorials\Images. You can open this file in MobileTogether Designer, run it in the simulator (F5), and look through the design definitions. The design's default file contains one image with Exif metadata.
The design file uses Base64-encoded images that are stored in the XML file Base64Images.xml (also located in the Tutorials\Images folder). The structure of the XML file is shown in the screenshot below. The images element has six child elements, each of which has an image of a different format stored as a Base64 text string. It contains one image with Exif metadata (the exif element). The $PERSISTENT tree is used to save temporary user selections (ComboBoxValue) and Exif metadata (ExifData).  The top part of the design (screenshot below) has a label for the page title, and two tables. The design of this part of the page is described in the previous section, Base64-Encoded Images. The objective is to allow the end user to select an image type in the combo box. This selection determines which Base64-encoded image in the XML file is selected for display in the cell to the right-of the combo box.  If the user selects the exif item in the combo box, then the Base64-encoded image in the exif element of the XML file is displayed. Exif metadata is displayed in two tables ("Selected Exif data of image" and "Exif metadata of the selected image"; see simulator screenshot below). In the simulator, if you expand the $PERSISTENT tree in the XML Data pane (see screenshot below), you will see the Exif data that has been retrieved from the Base64 string. The design of the two Exif data display tables is described below. See the previous section, Base64-Encoded Images, for a detailed description of other parts of the design.
|
•Selected Exif data is presented in a static table consisting of two columns and multiple rows (screenshot below). •The first column contains labels; the second column contains edit boxes, each having an XPath expression that returns one piece of Exif metadata. •The Image type information is obtained from the Base64-encoded text string by using the Altova XPath extension function suggested-image-file-extension. This function takes a string (the Base64 image) as its argument and retrieves the file-extension information from the string. If no file-extension information is available in the Base64 string, then the function returns the empty string. The XPath expression used is: •All the other XPath expressions in the table (besides the first row) use the Altova XPath extension function image-exif-data to obtain one piece of Exif metadata. This function takes a string (the Base64 image) as its argument and returns an element node (named Exif) with attributes holding the Exif metadata. Each attribute-value pair corresponds to one Exif metadata tag. In the expression below, the function image-exif-data returns the Exif element with multiple attributes. The metadata information we want to obtain with this expression is the width of the image. This information is stored in the @PixelXDimension attribute node of the Exif element. •For more information about the image-exif-data function, see its description in the Altova extension functions section. •Note the last Geolocation value in the table. It is obtained via an Altova-created Exif/@Geolocation attribute. •The $PERSISTENT/Root/ExifData node is populated with the Exif data by appending a child node to it that contains the result of the image-exif-data function. This is done by specifying an Append Node action on the combo box that selects which image to display (see screenshot below). The action is triggered by the OnFinishEditing event of the combo box.
|
•A table with a repeating row (screenshot of design below left; simulator view below right) is used to display all the attribute-value pairs returned by the image-exif-data function. •The repeating row is specified with an XPath expression that selects all the attributes of the Exif element node returned by the image-exif-data function:  
•The table's first column contains the index position of the current attribute: index-of(../@*/name(), ./name() ) •The second column contains the name of the current attribute: name(.) •The third column contains the value of the current attribute: current() •Not all images contain the same Exif metadata. In some cases, some metadata may be absent; in other cases, additional metadata might be present; in still other cases, metadata might be tagged with non-standard, vendor-specific tags. Consequently, knowing what metadata is available and under what attribute names is important. Only with this information can specific attribute values be retrieved. •If we know the names of the attributes that are returned, we can access its value by using the image-exif-data function like this: image-exif-data(Base64String)/@WantedAttribute. Note that the function returns the Exif element.
|
•It can be useful to see all the attribute-value pairs returned by the image-exif-data function. In order to display attribute-value pairs, we can store this output conveniently in the temporary $PERSISTENT tree. •In our example design, the $PERSISTENT/Root/ExifData node is populated with the Exif data by appending a child node to the ExifData node that contains the result of the image-exif-data function. •This is done by specifying an Append Node action on the combo box that selects which image to display (see screenshot below). The Append Node action is triggered by the OnFinishEditing event of the combo box. •The XPath locator expression in the Append Node action locates the node in the XML file that has the same name as the string in $PERSISTENT/Root/ComboBoxValue. •The $PERSISTENT/Root/ExifData node is deleted before the Exif data returned by the image-exif-data function is appended to the ExifData node. •If we know the names of the attributes that are returned, we can access the value of any attribute by using the image-exif-data function like this: image-exif-data(Base64String)/@WantedAttribute. Note that the function returns the Exif element.
|