Over a million developers have joined DZone.
{{announcement.body}}
{{announcement.title}}

Scaled Linked Image in Vaadin

DZone's Guide to

Scaled Linked Image in Vaadin

· Java Zone ·
Free Resource

Microservices. Streaming data. Event Sourcing and CQRS. Concurrency, routing, self-healing, persistence, clustering...learn how Akka enables Java developers to do all this out of the box! Brought to you in partnership with Lightbend.

In vaadin you can easily embed images either via:

Embedded logoEmbed = new Embedded("yourText",new ThemeResource("../yourtheme/img/logo.png"));
logoEmbed.setType(Embedded.TYPE_IMAGE);

or if you need a linked image do the following:

Link iconLink = new Link();
iconLink.setIcon(new ExternalResource(urlAsString));
iconLink.setResource(new ThemeResource("../yourtheme/img/logo.png"));

But how can you scale that external image? This is simple if you let the browser do it for you. In Java do:

iconLink.setStyleName("mylogo");

and then you will need to change the following style in your custom style.css to your needs:

.mylogo a img { width: 67px; 

From http://karussell.wordpress.com/2010/05/31/scaled-linked-image-in-vaadin/

Microservices. Streaming data. Event Sourcing and CQRS. Concurrency, routing, self-healing, persistence, clustering...learn how Akka enables Java developers to do all this out of the box! Brought to you in partnership with Lightbend. 

Topics:

Opinions expressed by DZone contributors are their own.

{{ parent.title || parent.header.title}}

{{ parent.tldr }}

{{ parent.urlSource.name }}