Custom control / image + label how to

0
0

HI,

I would need to create a control that has small icon + text after the icon.

I saw that Label control has image object, but image is centred to label and no matter what kind of image alignment I choose I am unable to achieve the desired – is there a way to customise it – and how to make sure that text will not overlap image.

The other option would be to create user control of picture + label, is there any example or demo how this can be done?

The ultimate goal will be to get a control where I can change background color, image and text.

Thank you,

DiNo

  • You must to post comments
0
0

Hi Dino,

You are also probably using an SVG image. The problem is that IE11 doesn’t support aligning svg backround images so in the designer you always see it centered. It will be aligned correctly in Chrome or Edge or FireFox at runtime.

Otherwise you can use PNG or GIF images, in which case they are always aligned correctly. The Wisej.Web.Label control supports BackgroundImage, Image, ImageSource, ImageIndex, ImageList and ImageKey, as well as ImageAlignment and TextAlignment. Also, by design, it doesn’t resize the image and the text and image can overlay when using the same alignment. If you need to resize an image, simply assign an ImageList where you can set the size, even if you don;t use images from the image list.

See images attached. The first is a label with an avg icon (aligned left but shown in the middle) and text aligned in the middle. The second icon+label is the same but using a png. The other screenshot is the result in Chrome.

HTH

 

 

Attachment
  • You must to post comments
0
0
  • You must to post comments
Showing 2 results
Your Answer

Please first to submit.