Notice: this Wiki will be going read only early in 2024 and edits will no longer be possible. Please see: https://gitlab.eclipse.org/eclipsefdn/helpdesk/-/wikis/Wiki-shutdown-plan for the plan.
Difference between revisions of "E4/CSS"
< E4
m (→Sample) |
|||
| Line 21: | Line 21: | ||
} | } | ||
}); | }); | ||
| + | // applying styles to the child nodes means that the engine | ||
| + | // should recurse downwards, in this example, the engine | ||
| + | // should style the children of the Shell | ||
engine.applyStyles(shell, /* applyStylesToChildNodes */ true); | engine.applyStyles(shell, /* applyStylesToChildNodes */ true); | ||
Revision as of 20:03, 28 June 2009
Contents
Overview
The new CSS declarative styling support provides developers with the flexibility of styling their user interface based on a set of properties defined within a CSS style sheet. Note that while the support for SWT widgets is the primary focus of the current developers that are working on the CSS code, the core engine is headless and can be used to "style" other things such as for applying arbitrary properties to a model.
Sample
The sample code below creates a simple Label within a Shell but the Label's foreground colour is styled to a blue colour by the CSS engine.
Display display = new Display(); Shell shell = new Shell(); shell.setLayout(new GridLayout()); Label label = new Label(shell, SWT.LEAD); label.setText("Hello world!"); label.setLayoutData(new GridData(SWT.FILL, SWT.FILL, true, true)); CSSEngine engine = new CSSSWTEngineImpl(display); engine.parseStyleSheet(new StringReader("Label { color: blue }")); engine.setErrorHandler(new CSSErrorHandler() { public void error(Exception e) { e.printStackTrace(); } }); // applying styles to the child nodes means that the engine // should recurse downwards, in this example, the engine // should style the children of the Shell engine.applyStyles(shell, /* applyStylesToChildNodes */ true); shell.setSize(400, 300); shell.open(); while (!shell.isDisposed()) { if (!display.readAndDispatch()) { display.sleep(); } } display.dispose();
SWT Mapping
CSS style sheets can be used to modify SWT widget properties. There is a table showing the mapping between CSS properties and SWT widget calls.