Displaying an image or logo in Web Dynpro application without using MIME object

...Previous

 Also create an application 'ZTEST1' for a Web Dynpro component. 

2. Get the Binary contents of image/logo from BDS (Business document store).

Go to the WDDOINIT method of view and call the below Function module for getting the binary contents of a image. I am calling this FM for a specific image. To make it a dynamic call, select query on table STXBITMAPS is required. Thus it can help in deciding the image at run time. 

For black & White images pass 'BMON' in parameter I_BTYPE (graphic type) and for color images pass 'BCOL' in parameter I_BTYPE.

Data: i_name TYPE STXBITMAPS-TDNAME value 'ZLOGOTEST',
i_id TYPE STXBITMAPS-TDID VALUE 'BMAP',
i_btype TYPE STXBITMAPS-TDBTYPE VALUE 'BMON',
l_bds_bytecnt TYPE i,
l_bds_content TYPE TABLE OF bapiconten.

*-- Get image contents
CALL FUNCTION 'SAPSCRIPT_GET_GRAPHIC_BDS'
EXPORTING
i_object = 'GRAPHICS'
i_name = i_name "Image name
i_id = i_id 
i_btype = i_btype "Image type(color or gray)
IMPORTING
e_bytecount = l_bds_bytecnt
TABLES
content = l_bds_content[]
EXCEPTIONS
not_found = 1
OTHERS = 2. 

3. Convert the binary contents into BITMAP format.

BITMAP format is file format for digital images. So a conversion from BDS to BMP is required. Call the below FM after the code in step 2.

Data: l_length TYPE i,
l_content TYPE tsf_xsf_ct,

CALL FUNCTION 'SAPSCRIPT_CONVERT_BITMAP'
EXPORTING
old_format = 'BDS'
new_format = 'BMP'
bitmap_file_bytecount_in = l_bds_bytecnt
IMPORTING
bitmap_file_bytecount = l_length
TABLES
bds_bitmap_file = l_bds_content[]
bitmap_file = l_content[]
EXCEPTIONS
OTHERS = 1. 

4. Convert BITMAP to Byte stream (XSTRING).

Now table L_CONTENT contains the required data of image. But to link it with the Image element, we need to convert the Bitmap data into XSTRING format. Below source code can be used for it.

This custom logic is picked up from FM SCMS_BINARY_TO_XSTRING and is modified according to needs.

Data: w_file TYPE xstring,
l_grline TYPE LINE OF tsf_xsf_ct,
l_linelength TYPE i.

DESCRIBE FIELD l_grline LENGTH l_linelength IN BYTE MODE.
LOOP AT l_content INTO l_grline.
IF l_length > l_linelength.
CONCATENATE w_file l_grline-line INTO w_file IN BYTE MODE.
ELSE.
CONCATENATE w_file l_grline-line(l_length) INTO w_file IN BYTE MODE.
ENDIF.
l_length = l_length - l_linelength.
ENDLOOP.  

5. Generate a URL which will be linked with Image UI element.

After step 4, we have image data (xstring) in W_FILE parameter.  Now a URL needs to be generated which image UI element will point to.

DATA:url TYPE string,
guid TYPE guid_32,
cached_response TYPE REF TO if_http_response.

CREATE OBJECT cached_response
TYPE
cl_http_response
EXPORTING
add_c_msg = 1.

* set image to mime
cached_response->set_data( w_file ).
cached_response->set_header_field( 
name = if_http_header_fields=>content_type 
value = 'image/pjpeg' ).

cached_response->set_status( code = 200 reason = 'OK' ).
cached_response->server_cache_expire_rel( expires_rel = 
180 ).

CALL FUNCTION 'GUID_CREATE'
IMPORTING
ev_guid_32 = guid.

cl_wd_utilities=>construct_wd_url( EXPORTING
application_name = 'ZTEST1' "Webdynpro application name
IMPORTING out_local_url = url ).

CONCATENATE url '/' guid sy-uzeit INTO url.
cl_http_server=>server_cache_upload(
url = url 
response = cached_response ). 

6. Set the above generated URL in Image UI element's source property.

In step1, we have created a Context attribute named IMAGE_URL which is linked to Image element's Source property. In this step, we will set the value (url created in above step) in this attribute. 

DATA lo_el_context TYPE REF TO if_wd_context_element.
DATA ls_context TYPE wd_this->element_context.
DATA lv_image LIKE ls_context-image_url.

* get element via lead selection
lo_el_context = wd_context->get_element( ).

* get single attribute
lo_el_context->set_attribute(
EXPORTING
name = `IMAGE_URL`
value = url ).

Now activate the Web Dynpro component and test the application to see output.