webcomponent image

Forum to discuss the new web client version of Servoy.

webcomponent image

Postby alk » Wed Aug 24, 2022 4:12 pm

Hi,
in servoy 22.06 I am using the bootstrap component 'image',

Since I am displaying images in different sizes sometimes the images is too large and covers other components.
I am looking for an image method or an option like "reduce", fix sizes of the image - can't find

Any idea?
Best
Ralf
alk
 
Posts: 61
Joined: Wed May 21, 2014 8:34 pm
Location: Berlin

Re: webcomponent image

Postby mboegem » Wed Aug 24, 2022 4:58 pm

Hi Ralf,

just add a style class to the component.
Then in your stylesheet do something like this:
Code: Select all
.my-image {
   width: 20px;
   height: 20px;
}


Hope this helps
Marc Boegem
Solutiative / JBS Group, Partner
• Servoy Certified Developer
• Servoy Valued Professional
• Freelance Developer

Image

Partner of Tower - The most powerful Git client for Mac and Windows
User avatar
mboegem
 
Posts: 1742
Joined: Sun Oct 14, 2007 1:34 pm
Location: Amsterdam

Re: webcomponent image

Postby alk » Wed Sep 07, 2022 3:06 pm

Hi Marc

thanks that helps.

But you still have to chooce a width which is suitable to your highst size -
there seems no function to enlarge, scale the image
But maybe 'once upon the time'

Best and greetings from Berlin

Ralf
alk
 
Posts: 61
Joined: Wed May 21, 2014 8:34 pm
Location: Berlin

Re: webcomponent image

Postby mboegem » Wed Sep 07, 2022 3:33 pm

Hi Ralf,

if you can have either width or height fixed, you can set the other value to 'auto'.
Besides you can use the object-fit property, to control resizing.

So something like this, considering the height to be fixed:
Code: Select all
.my-image {
   width:auto;
   height: 120px;
   object-fit: contain;
}


You can also have a read here about image sizing:
https://www.digitalocean.com/community/ ... object-fit

Hope that helps
Marc Boegem
Solutiative / JBS Group, Partner
• Servoy Certified Developer
• Servoy Valued Professional
• Freelance Developer

Image

Partner of Tower - The most powerful Git client for Mac and Windows
User avatar
mboegem
 
Posts: 1742
Joined: Sun Oct 14, 2007 1:34 pm
Location: Amsterdam

Re: webcomponent image

Postby alk » Thu Sep 08, 2022 4:41 pm

Marc

again: thanks

Ralf
alk
 
Posts: 61
Joined: Wed May 21, 2014 8:34 pm
Location: Berlin


Return to Servoy NGClient

Who is online

Users browsing this forum: No registered users and 6 guests

cron