Application Development Discussions
Join the discussions or start your own on all things application development, including tools and APIs, programming models, and keeping your skills sharp.
cancel
Turn on suggestions
Auto-suggest helps you quickly narrow down your search results by suggesting possible matches as you type.
Showing results for 
Search instead for 
Did you mean: 

CL_GUI_HTML_VIEWER - stretch image

Go to solution
csaba_szommer
Active Contributor

‎11-21-2022 10:12 AM

0 Kudos

I am using CL_GUI_HTML_VIEWER to display an image (using an URL) in GUI. The image is displayed within a black frame inside the container (CL_GUI_CUSTOM_CONTAINER).

Does anyone know how to control the size of the image in the container (e.g. how to stretch the image to fit the container) or how to control the frame (width and colour of the frame)?

1 ACCEPTED SOLUTION

Go to solution
ziolkowskib
Active Contributor

‎11-21-2022 10:29 AM

Hi csaba.szommer,

I would personally play with CSS to set up background color of your HTML content.
You could set the width / height of your image using widht / height attributes in the IMG tag.
Please remember that you should specify either width or height as you might be interested in keeping the original ratio of the image. 

<!DOCTYPE html>
<html>


<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        html {
            margin: 0;
            padding: 0;
        }


        body {
            margin: 0;
            padding: 0;
            background-color: #ffffff;
            color: #000;
        }
    </style>
</head>


<body>
    <div class="wrapper">
        <img src="SOMEIMAGE.JPG" width="100%" />
    </div>
</body>


</html>

Regards,
Bartosz

3 REPLIES 3

Go to solution
ziolkowskib
Active Contributor

‎11-21-2022 10:29 AM

Hi csaba.szommer,

I would personally play with CSS to set up background color of your HTML content.
You could set the width / height of your image using widht / height attributes in the IMG tag.
Please remember that you should specify either width or height as you might be interested in keeping the original ratio of the image. 

<!DOCTYPE html>
<html>


<head>
    <meta charset="utf-8" />
    <title></title>
    <style>
        html {
            margin: 0;
            padding: 0;
        }


        body {
            margin: 0;
            padding: 0;
            background-color: #ffffff;
            color: #000;
        }
    </style>
</head>


<body>
    <div class="wrapper">
        <img src="SOMEIMAGE.JPG" width="100%" />
    </div>
</body>


</html>

Regards,
Bartosz

Go to solution
csaba_szommer
Active Contributor

‎11-21-2022 10:41 AM

0 Kudos

Hi Bartosz,

thanks a lot for your reply.

I meant to control the display of the image within ABAP using the mentioned class. If it is not possible, I will have to "wrap" it as you suggested but I would like to avoid that.

Go to solution
Sandra_Rossi
Active Contributor
In response to csaba_szommer

‎11-21-2022 12:30 PM

0 Kudos

Please use the COMMENT button for comments, asking for complements, adding details, replying to a comment or a proposed solution or to the OP question, etc., ANSWER is only to propose a solution, dixit SAP text at the right of the answer area.

I mean, instead, post a comment under ziolkowskib answer.

CL_GUI_HTML_VIEWER is about displaying HTML/CSS content and more, so Bartosz is explaining you how to stretch the image, but I guess you need to make clear what HTML and CSS are, right?