Display SBS Images in 4V

In this section, you will learn how to display a SBS image using a QuadView. As discussed in the previous section, we need to first convert the SBS image to a Quad format image.
The steps to render an SBS image are exactly the same as rendering a LIF image. However, SBS images can currently only be decoded using File Uris or ContentUris. 
In order to be compatible with the SDK, SBS images must have a suffix of _2x1 in their file name. Learn more​
This section will provide you with instructions on how to load a SBS image using a File Uri, decode it to a Quad and display using a QuadView.
Setup Resources
The steps outlined in this section are implemented in the sample project available on Github. This project contains a sample app which loads a SBS image from the raw resource directory into the device's external cache storage. This is done since SBS images cannot be decoded using raw byte[] currently.
The Uri of the file is then used to decode, synthesize views and display the image using a QuadView.
​SBS-Render-Sample-App​
Decode SBS image
Decode the SBS image using the MultiviewImageDecoder by specifying the file Uri and the output pixels
Kotlin
Java
val multiviewImage = MultiviewImageDecoder.getDefault().decode(context, fileUri, 1280 * 720)
MultiviewImage multiviewImage = MultiviewImageDecoder.getDefault().decode(imageBytes, 1280 * 720);
Decode SBS image to get the MultiviewImage instance from the MultiviewImageDecoder
We will set the output pixels to 1280 x 720 for this tutorial. This resizes all the decoded viewpoints to the set resolution.
The decoder returns null if the file Uri or contentUri points to an image that is not supported.
In order to be compatible with the SDK, SBS images must have a suffix of _2x1 in their file name. Learn more​
Note: The code in this step should be called on a worker thread. 
Populate Disparity Maps
The MultiviewImage obtained in the previous step can now be used to synthesize 4 views. 
In order to do so, we need to ensure the disparity maps are generated for the different view points. This function generates the disparity maps, if required. 
Kotlin
Java
// Obtain MultiviewSynthesizer instance
val synthesizer2 = MultiviewSynthesizer2.createMultiviewSynthesizer(context)
​
// Populate Disparity maps
synthesizer2.populateDisparityMaps(multiviewImage)
​
// Obtain MultiviewSynthesizer instance
MultiviewSynthesizer2 synthesizer = MultiviewSynthesizer2.createMultiviewSynthesizer(context);
        
// Populate Disparity maps
synthesizer.populateDisparityMaps(multiviewImage);
Obtain the MultiviewSynthesizer2 instance using the MultiviewSynthesizer2.createMultiviewSynthesizer(Context context) function.
Generate the disparity maps for the MultiviewImage using MultiviewSynthesizer2#populateDisparityMaps(MultiviewImage). 
Disparity maps are essential for generating the different views in a Quad image. Disparity maps will only be populated by this function, if not already present in the MultiviewImage
Note: All steps in this section should be called on a worker thread. 
View Synthesis to Quad
Finally, obtain a Quad Bitmap  by synthesizing the MultiviewImage to a generate four views and obtain a Bitmap representing a Quad.
Kotlin
Java
val quadBitmap = synthesizer2.toQuadBitmap(multiviewImage)
Bitmap quadBitmap = synthesizer2.toQuadBitmap(multiviewImage);
Set Quad in QuadView
You now have the Quad Bitmap which can be used to display the image in 4V using the QuadView. 
Kotlin
Java
 quadView.setQuadBitmap(quadBitmap)
 quadView.setQuadBitmap(quadBitmap);
Build your app
If you followed the steps correctly, you should be able to view the SBS image in 4V in your Android project. Feel free to refer to the sample project on Github, which converts the LIF image to a Quad while following Android best practices.
​SBS-Render-Sample-App​
​
In the next section, you will learn about the conversion pipeline and how to leverage the MultiviewImage in your android application and also learn about the decoding pipeline.