MPS 2023.3 Help

Icon description

The icon description language helps describing and instantiating icons for various MPS elements: concepts, actions etc.

The language has the two following aims:

  1. Provide a tool for quick icon prototyping (e.g. making new icons for concepts)

  2. Make icons an extensible language construct

First impression

Wherever an icon is expected in the MPS language definition languages, you can enter a textual description of the desired icon instead of pointing to an existing .png file.

icon4.png

The jetbrains.mps.lang.resources contains two constructs:

  • icon{} represents the image as an instance of javax.swing.Icon class.

  • iconResource{} returns an instance of jetbrains.mps.smodel.runtime.IconResource class.

icon5.png

Creating icon prototypes

When describing an icon, you can get assistance from the Create Icon intention, which offers an automatic way to create a textual description of an icon and thus to prototype it quickly.

icon1.png

Invoking the intention will result in creating a straightforward icon definition.

icon2.png

This definition describes a circular icon with letter "X" inside of it. Upon regeneration the generated icon will take effect and shows up in the UI.

icon3.png

The language explained

An icon description consists of layers, each of which can be any of:

  • a primitive graphical shape

  • a custom image loaded from a file

  • a character

These layers are then combined into a single image to represent the icon. These icon descriptions can be used:

  • to specify icons in different places of the language definition languages - in concepts, actions, etc, where icons are expected

  • in methods in the MPS UI that are supposed to return an Icon

Extending the language

The language is open for extension. To add new icon types, you need to create a new concept and make it implement the Icon interface. The Icon interface represents the desired icon and will get transformed to a .png file during the make process.

After generating a model, all Icons are collected from the output model and their generate() methods are called. These create .png files corresponding to the images described by the corresponding Icons . When an icon resource is requested (e.g. using the icon{} syntax), a resource referenced by Icon.getResourceId() method is loaded using the classloader of the corresponding module and converted into a Java Icon object.

icon{} vs iconResource{}

There are two constructs in the resources language to load resources. icon{} loads an image as an instance of javax.swing.Icon class, while iconResource{} returns an instance of jetbrains.mps.smodel.runtime.IconResource class. The second one is used in core MPS aspects, which should not depend on the javax.swing package. All UI-related code uses icon{}.

Icons supporting both the old and the new UI

MPS can offers two distinct versions of the user interface, the traditional (old) UI and a modern (new) one. The user can select the preferred variant in Settings | Appearance & Behavior | New UI.

TextIcon, which allows icon descriptions to be provided and rendered, simply allow both variants to be described side-by-side. If the new UI variant is omitted, the old UI variant is used in both old and new UI settings.

Icons specified by a file name (FileIcon) allow for two files to be specified, one to use under the old UI and one to use under new UI. Only the old UI file is compulsory. If only the old UI icon file is specified and MPS is run under new UI, before resorting to using the old UI icon file MPS will use naming convention in an attempt to find a file suitable for new UI, although it was not specified explicitly in the icon definition.

The naming convention is as follows: Provided a single old UI icon file "A.png" is specified, MPS will use a file icon named "A_newui.svg" if it exists in the same directory as "A.png".
This allows the language designers to quickly add icons suitable for the new UI without having to manually specified them in all icon definitions.
Note that both ".png" and ".svg" formats are supported as icon files, both old and new. The heuristic, however, assumes an ".svg" file should be present.

Supporting icons in build scripts

Both file and text icons copy or generate image files (either .png or .svg) into the Java source directory of your model, alongside the generated Java sources. For the build script to treat the images as resources a file mask of resource files must be provided using the java options element:

java options generate debug info true generate no warnings false fork false compiler IntelliJ java compliance level 11 java compiler options ... generator jvm options ... copy resources true resource patterns includes **/*.properties, **/*.xml, **/*.png, **/*.svg

Notice also the copy resources flag to be set to true.

Last modified: 07 March 2024