Difference between revisions of "E4/CSS/Add Styleable Property"

Revision as of 10:59, 20 April 2009

This wiki is a "how-to" that will explain the steps needed to add a styleable CSS property in E4.

- Create a class in org.eclipse.e4.ui.css.swt.properties.custom and name it "CSSPropertyXXXXSWTHandler", where XXXX is the name of the property

- Make this new class extend "AbstractCSSPropertySWTHandler"

    public class CSSPropertyXXXXSWTHandler extends AbstractCSSPropertySWTHandler

- Within the class, create a ICSSPropertyHandler and set it equal to an instance of CSSPropertyXXXXSWTHandler

     public static final ICSSPropertyHandler INSTANCE = new CSSPropertyXXXXSWTHandler();

- Add the following two methods:

     public void applyCSSProperty(Control control, String property, CSSValue value, String pseudo, CSSEngine engine) throws Exception {}

     public String retrieveCSSProperty(Control control, String property, String pseudo, CSSEngine engine) throws Exception {}

- Within the applyCSSProperty method, write the code needed to apply the wanted styles. For example, for the border-visible property (CTabFolder) we write the following:

     public void retrieveCSSProperty(Control control, String property, String pseudo, CSSEngine engine) throws Exception {
            if (control instanceof CTabFolder) {
                CTabFolder folder = (CTabFolder) control;
                return Boolean.toString( folder.getBorderVisible() );
            }
     }

- Within the retrieveCSSProperty method, write the code needed to retrieve the value of the applied property. Again, for border-visible, we write the following:

     public String applyCSSProperty(Control control, String property, CSSValue value, String pseudo, CSSEngine engine) throws Exception {
            boolean isBorderVisible = (Boolean)engine.convert(value, Boolean.class, null);
            if (control instanceof CTabFolder) {
                CTabFolder folder = (CTabFolder) control;
                folder.setBorderVisible(isBorderVisible);
            }
            return null;
     }

- Now, we must go in org.eclipse.e4.ui.css.swt.engine.CSSSWTEngineImpl#initializeCSSPropertyHandlers , and register the name of the property and the above class just created. We must also register the CSSPropertyHandler created in the class:

     super.registerCSSProperty("xxxx", CSSPropertyXXXXSWTHandler.class);
     super.registerCSSPropertyHandler(CSSPropertyXXXXSWTHandler.class, CSSPropertyXXXXSWTHandler.INSTANCE);