Synthetica's HeaderShadow - A New Window Decoration Element(14:19, 08. Jul. 2015)

In Synthetica V2.20.0 we've added a new feature called HeaderShadow. It's a simple but dynamic shadow effect which appears at the bottommost header component. This means i.e. if your window makes use of a menubar and a toolbar, the effect appears on the toolbar only. When the toolbar is floatable and will be moved away the shadow appears on the menubar automagically.

Dynamic HeaderShadow

In our new theme SyntheticaPlainLookAndFeel the HeaderShadow is enabled by default  to clearly distinguish between header and content visually - the result looks pretty appealing.

Synthetica supports some different strategies for which components the shadow effect will appear - this is controlled by the UI-property Synthetica.rootPane.headerShadow.type which can have the string values listed below.

  • NONE - means disabled, not visible
  • NORMAL - if one ore more toolbars are available the effect appears at the bottommost toolbar, if a menubar is available and no toolbar is there it appears on the menubar, if neither a toolbar nor a menubar is displayed the effect will be shown on the titlebar of the window.
  • SHADOW_COMPONENT_MENUBAR_ONLY - see NORMAL without titlePane support
  • SHADOW_COMPONENT_ONLY - if one ore more toolbars are available the effect appears at the bottommost toolbar, if no other component is specified as shadow component
  • TITLEPANE_ONLY - the shadow effect appears on the title pane only

In the SyntheticaTunes mockup application the toolbar is part of the titlePane - in this scenario it's helpful to set the shadowType to TITLEPANE_ONLY, either through a custom XML file (see FAQ) or by providing the value through the UIManager just like below.

//Example:
UIManager.setLookAndFeel("de.javasoft.plaf.synthetica.SyntheticaPlainLookAndFeel");
UIManager.put("Synthetica.rootPane.headerShadow.type", "TITLEPANE_ONLY");

Synthetica Tunes Demo

Sometimes it's also useful to provide a hint if a component should not support the headerShadow i.e. when a toolbar is used at the bottom of a window. In this case you can set the clientProperty Synthetica.headerShadowSupport to false.

//Example:
toolBar.putClientProperty("Synthetica.headerShadowSupport", false);

Synthetica Office Demo

Additionally Synthetica supports enabling the shadow effect for a custom header component by calling SyntheticaRootPaneUI#setHeaderShadowComponent(JComponent).

//Example:
((SyntheticaRootPaneUI)getRootPane().getUI()).setHeaderShadowComponent(myComponent);

Custom HeaderShadow Component

Related Posts

Window Decoration, Part 1 - Basics and Title Pane
Window Decoration, Part 2 - Non-Rectangular Window Shapes
Window Decoration, Part 3 - Custom Decoration for Dialogs
Window Decoration, Part 4 - Logo Renderer and More
Window Decoration, Part 5 - TitlePane Variations
Window Decoration, Part 6 - TitlePane Layout
Window Decoration, Part 7 - TitlePane Menu Inline Style