image
image
is designed to display images from different sources. The component can be bound to a data container or configured programmatically.
-
XML element:
image
-
Java class:
JmixImage
Basics
An image can be represented as an entity attribute of FileRef
or byte[]
type. In the example below, the picture
attribute of the User
entity is a reference to a file in file storage:
@JmixEntity
@Entity
@Table(name = "USER_", indexes = {
@Index(name = "IDX_USER__ON_USERNAME", columnList = "USERNAME", unique = true),
@Index(name = "IDX_USER__DEPARTMENT", columnList = "DEPARTMENT_ID")
})
public class User implements JmixUserDetails, HasTimeZone {
/* other attributes */
@Column(name = "PICTURE", length = 1024)
private FileRef picture;
}
To display the image provided by this attribute, specify it in the component. For that, specify the data container and property attributes.
<data readOnly="true">
<instance id="userDc" class="com.company.onboarding.entity.User" >
<fetchPlan extends="_base"/>
<loader id="userDl">
<query>
<![CDATA[select u from User u where u.username = 'bob']]>
</query>
</loader>
</instance>
</data>
<facets>
<dataLoadCoordinator auto="true"/>
</facets>
<layout>
<image id="fileRefImage"
dataContainer="userDc"
property="picture"/>
</layout>
Resources
Alternatively, the image
component can display images from different resources. You can set the resource type declaratively using the nested XML elements described below, or programmatically using the setSrc()
method.
Static Resource
An image can be served statically by the application.
By default, static content is served from /static
, /public
, /resources
, or /META-INF/resources
directories of the classpath (see details in the Spring Boot documentation).
-
In XML:
For example, if your image is located under
/src/main/resources/META-INF/resources
, such as/src/main/resources/META-INF/resources/icons/icon.png
, you can specify the resource as follows:<image id="staticImage" resource="icons/icon.png"/>
-
In Java:
image.setSrc("icons/icon.png");
Attributes
id - alignSelf - alternateText - ariaLabel - classNames - colspan css - dataContainer - enabled - height - maxHeight - maxWidth - minHeight - minWidth - property - resource - text - themeNames - title - visible - whiteSpace - width
ariaLabel
Sets a separate, visually hidden label for accessibility technologies, such as screen readers.
Handlers
To generate a handler stub in Jmix Studio, use the Handlers tab of the Jmix UI inspector panel or the Generate Handler action available in the top panel of the view class and through the Code → Generate menu (Alt+Insert / Cmd+N). |