Search code examples
imagebuttontoggleeclipse-scout

Change icon on button in scout eclipse


I would like to implement some think like toggle button in scout eclipse. What I need is to change image of button for state.

I see function

setIconId(String)

but I dont know how to find parameter for this function. How to find image that scout use for different state of button?

Marko


Solution

  • setIconId(..) and Icons

    It is a good practice in your Scout Application to pass as Argument from setIconId(..) a constant defined in the Icons Class. See Icons page on the wiki.

    An example for your use case:

    setIconId(Icons.WeatherSun)
    

    In the Demo Widget Application there is an Icons class:

    org.eclipsescout.demo.widgets.shared.Icons 
    

    Here some constants defined in this class:

    public static final String WeatherRain = "weather_rain";
    public static final String WeatherSnow = "weather_snow";
    public static final String WeatherSun = "weather_sun";
    

    The values defined in the constants represent an identifier for the image.

    The Image lookup is realized by the ImageLocator. (Depending on the UI technology, the appropriate IconLocator will be used. For example, in case of Swing the SwingIconLocator implementation).

    In case of weather_sun the default implementation of the ImageLocator will look for a File called weather_sun.<ext> (where <ext> can be gif, png and so on) in the \resources\icons\ folder of each plugins. In this case it will find the File: \org.eclipsescout.demo.widgets.client\resources\icons\weather_sun.png

    If the image is not found, you will see a log entry like this:

    !MESSAGE org.eclipse.scout.rt.ui.swing.SwingIconLocator.warnImageNotFound(SwingIconLocator.java:141) could not find image 'weather_sun'
    

    In the Scout SDK, there is an Icons Editor. This Editor represents all the constants defined in the Icons class and the corresponding Icon. Is a file not found a red square is displayed instead of the image.


    Toggle Button

    There is no specific field for Toggle Button, use an AbstractButton an set the display style to DISPLAY_STYLE_TOGGLE.

    See also:


    Changing the icon in a Toogle Button

    I think this code snippet does what you are looking for:

    @Order(10)
    public class ToggleButton1 extends AbstractButton {
      @Override
      protected boolean getConfiguredProcessButton() {
        return false;
      }
    
      @Override
      protected void execClickAction() throws ProcessingException {
        if (isSelected()) {
          setIconId(Icons.WeatherSun);
        }
        else {
          setIconId(Icons.WeatherRain);
        }
      }
    }
    

    It would also be possible (and even better) to use execToggleAction instead of execClickAction.

    Screenshot:

    Eclipse Scout - Toogle Button with Icon - Swing UI