Jyloo Software - RSS Feed

Window Decoration, Part 6 - TitlePane Layout

Wed, 02 May 2012 08:29:57 GMT

Everybody knows the commonly used title panel layout for frames which is used by most desktop applications - see sketch below.

The screenshot below demonstrates how it can look in a real application with the SyntheticaAluOxide theme.
Note: In the screenshot the title panel background is not distinguishable from the toolBar even if the toolBar isn't part of the title panel. The visual behavior depends on the active theme.

In Synthetica V2.15 we support an additional layout called SECONDARYMENU which is useful to make an application more unique. The sketch below outlines the title panel elements. As you can see the menu button is spanned across two rows and a user component can be directly set for the second row.

Lets take a closer look at each step to enable this layout/style for the SyntheticaTunes application. The first step is to create a custom XML-file which holds the new window style. Because in most cases you want to change the appearance for the main frame only, Synthetica supports specifying a separate style for a named window.


<!--
*******************************************************************************
MainFrame style
*******************************************************************************
-->
  <style id="MainFrame">
    <defaultsProperty key="Synthetica.rootPane.titlePane.title.visible.MainFrame" type="boolean" value="false" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.layoutStyle.MainFrame" type="string" value="SECONDARYMENU" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.showMenuBarInTitlePane.MainFrame" type="boolean" value="true" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.clipMenuBarWidth.MainFrame" type="boolean" value="true" />
    
    <defaultsProperty key="Synthetica.rootPane.titlePane.title.alignment.MainFrame" type="integer" value="11" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.menuButton.alignment.MainFrame" type="integer" value="11" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.iconifyButton.alignment.MainFrame" type="integer" value="11" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.toggleButton.alignment.MainFrame" type="integer" value="11" />
    <defaultsProperty key="Synthetica.rootPane.titlePane.closeButton.alignment.MainFrame" type="integer" value="11" />
    
    <defaultsProperty key="Synthetica.rootPane.titlePane.menuBar.insets.MainFrame" type="insets" value="4 8 0 0"/>
    <defaultsProperty key="Synthetica.rootPane.titlePane.menuButton.insets.MainFrame" type="insets" value="0 0 0 0"/>
    <defaultsProperty key="Synthetica.rootPane.titlePane.iconifyButton.insets.MainFrame" type="insets" value="2 0 0 0"/>
    <defaultsProperty key="Synthetica.rootPane.titlePane.toggleButton.insets.MainFrame" type="insets" value="2 0 0 0"/>
    <defaultsProperty key="Synthetica.rootPane.titlePane.closeButton.insets.MainFrame" type="insets" value="2 0 0 2"/>
  </style>

The most important settings are in the first four entries - the rest covers alignment (set to top - GridBagConstraints.NORTH) and insets. In the next step we have to load the XML-file when the look and feel is set.


UIManager.setLookAndFeel(new SyntheticaAluOxideLookAndFeel(){
      @Override
      protected void loadCustomXML() throws ParseException
      {
        loadXMLConfig("/resources/custom.xml");
      }
    });

To apply the style to the window set the window name and update the rootPaneUI.


setName("MainFrame");
getRootPane().updateUI();

The menu button is ued for the application logo - for this take a lookup for the button and set the logo as icon.


JButton b = (JButton)SyntheticaLookAndFeel.findComponent("RootPane.titlePane.menuButton", this);
b.setIcon(new ImageIcon(this.getClass().getResource("/resources/icons/menuButton.png")));

The menu bar is set a usual - only the tool bar has to be set in a specific way.


setJMenuBar(new AppMenuBar());    
toolBar = new TunesToolBar();
toolBar.setFloatable(false);
((SyntheticaTitlePane)((SyntheticaRootPaneUI)getRootPane().getUI()).getTitlePane()).setUserComponent(toolBar);

That's all, the new appearance is more unique and gives your app a cool, modern look. Note: With the new style the application header needs a bit more horizontal space but less vertical space - this fits pretty well with current display ratios (16:9, 16:10).

The complete application source code is available for SyntheticaAddons customers only and can be downloaded from the SyntheticaAddons download page.

Sometimes you have to keep the menu bar at it's regular position i.e. to use the whole herizontal space. This can be simply achieved by setting the UI-property "Synthetica.rootPane.titlePane.showMenuBarInTitlePane" to false - see custom XML. The result is also appealing but of course needs some extra vertical space.

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

Synthetica V2.15 and SyntheticaAddons V1.7 is released!

Mon, 30 Apr 2012 10:42:44 GMT

We are pleased to announce the release of Synthetica V2.15.0 and SyntheticaAddons V1.7.0. Please find all major improvements below - a complete list of changes can be found at Synthetica changelog and SyntheticaAddons changelog.

New Synthetica Features

New theme SyntheticaAluOxide

New frame header layout to support a user component within the title panel
Java 7 support for Mac OSX
Corner painter support for ScrollPanes
Opened-state support for ComboBoxes
Hover style support for top level menus
New UI-property to horizontally flip JTabbedPane appearance in RTL mode
JButton, JToggleButton, JCheckBox, JRadioButton - new UI-properties to specify default icon text gap
JList, JTable - hover style support for rows
JPopupMenu - new UI-property to preserve icon space for icons
Improved default scrollPane border setting for JTable
Improved list cell renderer for JFileChooser to respect default renderer and F2 key binding to rename files
Improved focus state support
Improved opacity setting for components
Improved control to handle custom colored text components
Improved insets handling for TitledBorderPainter
Updated SyntheticaClassy theme (fine tuning)

New SyntheticaAddons Features

SyntheticaAluOxide theme support
JYTabbedPane - new UI-property to modify close button placement within a tab
New JYDocking features
- support to specify a custom docking strategy for floating windows
- new UI-property to define the default splitpane divider size
New JYSwitchButton features
- modified foreground color for disabled state (switch lables)
- new UI-property to support dynamic switch between ON/OFF foreground color
StatusBar - new UI-property to disable visibility of the resize handle
DateComboBox - new UI-properties to specify X/Y-offset for the date popup
Improved customizability of JYTaskPane and TitledPane
DropDownButton
- new UI-properties to specify custom arrow icon and arrow icon gap
- improved RTL support
Updated SwingX library to V1.6.3

Product Links

Synthetica Look And Feel

Synthetica Download

SyntheticaAddons

SyntheticaAddons Download

Synthetica + NetBeans 7.1

Thu, 19 Jan 2012 09:29:16 GMT

As of NetBeans 7.1 non-document windows in the same docking spot are organized into a tab group and are no longer stretched by default. To support this new feature SyntheticaAddons V1.6.2 provides an updated NetBeans plugin. The new plugin is backwards compatible and works fine with NetBeans 6.9/7.0.

To enable the old appearance/behavior NetBeans supports the system property winsys.stretching_view_tabs. By setting the system property to true you can force NetBeans using the old streched tabs appearance.

Synthetica V2.14.2 and SyntheticaAddons V1.6.2 have been released!

Tue, 17 Jan 2012 20:36:41 GMT

The maintenance releases Synthetica V2.14.2 and SyntheticaAddons V1.6.2 are available. The updates provide support for NetBeans 7.1 and some minor bug fixes. See also Synthetica changelog and SyntheticaAddons changelog.

Synthetica + NetBeans RCP, Part II

Fri, 25 Nov 2011 18:08:31 GMT

This Article describes how to integrate Synthetica, Themes and SyntheticaAddons in your Netbeans Platform application (RCP). Instead of extending the classpath as described here, let's create two additional modules and add these modules to our NetBeans RCP application.

The first module covers Swing core components only. For this we create a module called Synthetica which provides Synthetica's core library and all needed theme libraries. We additionally create a LAFInstall class to install the look and feel on application startup. The "--laf" parameter, mentioned in the first article, is therefore no longer needed.

Create Module Synthetica

Create a new module
- Name: Synthetica
- Code Name Base: myrcp.synthetica
- Finish
Select Module Synthetica / Properties
- Select Libraries / Module Dependencies
- Add Dependency: Module System API, Utilities API
- Select 'Wrapped JARs'
- Add JAR: core library synthetica.jar and your preferred theme e.g syntheticaSimple2D.jar, Note: the Standard theme is already part of synthetica.jar
- Select API Versioning, select modul type eager and make myrcp.synthetica and all listed packages public

Create class myrcp.synthetica.LAFInstall and override the method #restored()

public class LAFInstall extends ModuleInstall 
{
  @Override
  public void restored() 
  {
    try 
    {
      UIManager.setLookAndFeel(
        "de.javasoft.plaf.synthetica.SyntheticaSimple2DLookAndFeel");
    } 
    catch (Exception e) 
    {
      Exceptions.printStackTrace(e);
    }    
  }  
}

Edit Important files / Module Manifest
- add the line below to the manifest file
```

				OpenIDE-Module-Install: myrcp/synthetica/LAFInstall.class
```

The second module is used to provide all SynteticaAddons libraries and covers UI-support for Netbeans components. In this example configuration we assume that SyntheticaSimple2D is used as preferred theme, which also means that the theme extension syntheticaSimple2DAddon.jar has to be added to your module.

Create Module SyntheticaAddons

Create a new Module
- Name: SyntheticaAddons
- Code Name Base: myrcp.syntheticaaddons
- Finish
Select Module SyntheticaAddons / Properties
- Select Libraries / Module Dependencies
- Add Dependency: Look & Feel Customization Library, Nodes API, Synthetica, Tab Control, UI Utilities API, Window System API
- Select 'Wrapped JARs'
- Add JAR: de-javasoft-synthetica-netbeans.jar, syntheticaAddons.jar, syntheticaSimple2DAddon.jar, jywidgets.jar, swingx-1.6.2.jar
- Selet API Versioning, select modul type eager and make all packages public

Update: In case you have to use SwingX or SyntheticaAddons components it's better to use one single module to avoid classloader issues. So simply add the settings described for the SyntheticaAddons module to your Synthetica module and remove all dependencies to the SyntheticaAddons module from your RCP project.

Modify your Main/Core Module

Select your Main/Core Module / Properties
- Select Libraries / Module Dependencies
- Add Dependency: Synthetica, SyntheticaNetbeans

Modify your Netbeans Platform Application

Select Important Files / Project Properties
- add app.conf=myrcp.conf

create new file myrcp.conf to provide basic configuration

# ${HOME} will be replaced by user home directory according to platform
default_userdir="${HOME}/.${APPNAME}/dev"
default_mac_userdir="${HOME}/Library/Application Support/${APPNAME}/dev"

# options used by the launcher by default, can be overridden by explicit
# command line switches
default_options="--branding testrcp -J-Dnb.forceui=de.javasoft.synthetica.netbeans.SyntheticaLFCustoms -J-Xms24m -J-Xmx64m"
# for development purposes you may wish to append: -J-Dnetbeans.logger.console=true -J-ea

make sure that -J-Dnb.forceui=de.javasoft.synthetica.netbeans.SyntheticaLFCustoms has been added to the default options of the config file

Synthetica maintenance release V2.14.1 is available

Fri, 25 Nov 2011 11:51:57 GMT

Synthetica V2.14.1 is available - see changelog for more details.

SyntheticaAddons maintenance release V1.6.1 is available

Thu, 17 Nov 2011 11:27:58 GMT

SyntheticaAddons V1.6.1 is available - see changelog for more details.

JYTabbedPane Features in SyntheticaAddons V1.6

Thu, 10 Nov 2011 09:54:11 GMT

SyntheticaAddons V1.6.0 provides some new JYTabbedPane features. So let's take a look at these new features and find out how to use them in your application.

PlusButton support to add new tabs

The PlusButton isn't shown by default and has to be enabled by calling JYTabbedPane#setShowPlusButton(true). To let you control how the new Tabs will be created you additionaly have to provide an "addTab" action and put the action into the action map just like in the example below.


final JYTabbedPane tabbedPane = new JYTabbedPane();
tabbedPane.getActionMap().put("addTab", new AbstractAction(){
  public void actionPerformed(ActionEvent evt)
  {
    //add tab and content
    tabbedPane.addTab("New Tab", createTabbedPaneContent());    
    //move tab after selected tab and select the new tab
    if (tabPane.getTabCount() > 1)
    {  
      int index = tabPane.getSelectedIndex() + 1;
      tabbedPane.moveTab(tabPane.getTabCount() - 1, index);
      tabbedPane.setSelectedIndex(index);
    }  
  }
});
tabbedPane.setShowPlusButton(true);

Editable tabs

Tabs are non-editable by default. However, JYTabbedPane#setTabsEditable(true) is the related method to make tabs editable on double-click. If you are interested in tab text changes, add a PropertyChangeListener to the tabbed pane and filter events for the property name "title".

Custom Close Button Strategy

Sometimes it's necessary to use a custom strategy e.g. to make one or more tabs non-closable. By setting the custom ICloseButtonStrategy below there's no way for the user to close the first tab.


JYTabbedPane tabbedPane = new JYTabbedPane();
tabbedPane.setCloseButtonStrategy(new ICloseButtonStrategy()
{      
  public boolean isButtonVisible(JYTabbedPane tabbedPane, Tab tab)
  {
    return tab.getTabIndex()) > 0;
  }
});

Tab History Support

The default behavior on tab close is to automatically select the next available tab in the tab row. By enabling tab history JYTabbedPane is able to remember the tab which was selected before the currently selected tab and restores the tab on tab close. This feature improves usability for closable tabs.

The example below demonstrates how to enable tab history.


JYTabbedPane tabbedPane = new JYTabbedPane();
tabbedPane.setTabHistoryEnabled(true);
tabbedPane.setCloseButtonStrategy(CloseButtonStrategy.ALL_TABS);

How to customize a JYTabbedPane component

How To Set A Custom Close Tab Action

Customization - How to apply a Firefox style to a JTabbedPane

Synthetica V2.14 and SyntheticaAddons V1.6 is released!

Tue, 08 Nov 2011 14:23:25 GMT

We are pleased to announce the release of Synthetica V2.14.0 and SyntheticaAddons V1.6.0. Please find all major improvements below - a complete list of changes can be found at Synthetica changelog and SyntheticaAddons changelog.

New Synthetica Features

Style name support by client property Synthetica.style (Java6u10 or above required)
- Until now a custom style has to be bound by the component name (JComponent#setName(String)). The base functionality is inherited from Synth. Because some apps already use the component name for other things there's a need to bind a style to a component by another mechanism - the client property "Synthetica.style" fulfills this requirement.
- While style binding by name is still supported, binding by client property Synthetica.style has priority.
- Because JFrame/JDialog doesn't support a #putClientProperty() method, you have to use the related RootPane instead.
Custom window shape support.
- Non-rectangular (rounded rectangale) window shapes are already supported. However, in case that you want to use a different window shape, you have to create and provide your own shape class which implements the SyntheticaWindowShape interface.
Improved customization for title panes.
Improved large icon support for menu items.
New UI-property to enable/disable style name support.
Added UI-property 'ToolTip.background' support.
Window close item in system menu will be disabled when close button becomes disabled or invisible.
Updated themes.

New SyntheticaAddons Features

New JYTabbedPane features
- build in plus button support to allow users to add new tabs
- support for editable tab titles
- custom close button strategy support
- tab history support to restore last selected tab on tab close
- custom font and color support for HTML based tab titles
New JYTable features
- support to specify initial column filter and value
- improved filter model binding
New JYDocking features
- tab reorder support
- DockableFactory support to allow dynamic, persisted dockables being restored
- support for persistent active and selected dockable states
- new UI-property to respect the minimum size of Dockables (JYDockingView) when resizing a region - JYDocking.respectMinimumDockableSize (false by default).
New Component JYTaskPane - improved customizability compared to JXTaskPane.
JYLabel - support for being editable on double click.
Updated DemoCenter application - new examples.

Product Links

Synthetica Look And Feel

Synthetica Download

SyntheticaAddons

SyntheticaAddons Download

Swing QuickTip: Redispatching Mouse Events

Mon, 12 Sep 2011 08:48:37 GMT

When creating a compound Swing component mouse events for embedded components will be consumed by the related component and do not reach the parent control. Alex from Sun/Oracle recently blogged about this behavior in his series 'Swing in a better world'.

Sometimes this is not the intended behavior, but Swing allows us to easily implement what we really need. As already described by Alex, one approach is to add the mouse listener to each subcomponent. Another, more transparent approach is to add another MouseListener to the subcomponent and to redispatch all events to the related parent. This is very helpful if you want to make sure that your custom component can be easily used by other developers and if you want to prevent subcomponents from being directly accessed. No public API is required - mouse handling is transparent.


JComponent subComponent = new JButton("JButton");    
MouseAdapter redispatcher = new MouseAdapter()
{
  @Override
  public void mouseEntered(MouseEvent evt)
  {
    dispatchMouseEvent(evt);
  }      
  @Override
  public void mouseExited(MouseEvent evt)
  {
    dispatchMouseEvent(evt);
  }
  @Override
  public void mouseMoved(MouseEvent evt)
  {
    dispatchMouseEvent(evt);
  }
  @Override
  public void mousePressed(MouseEvent evt)
  {
    dispatchMouseEvent(evt);
  }
  private void dispatchMouseEvent(MouseEvent evt)
  {
    Container parent = evt.getComponent().getParent();
    parent.dispatchEvent(SwingUtilities.convertMouseEvent(evt.getComponent(), evt, parent));
  }            
};
subComponent.addMouseListener(redispatcher);
subComponent.addMouseMotionListener(redispatcher);

Note: Redispatching only a few events by implementing related listener methods gives you fine granulated control on how the compound component will interact with the user.

Jyloo Software - RSS Feed

Window Decoration, Part 6 - TitlePane Layout

Related Posts

Synthetica V2.15 and SyntheticaAddons V1.7 is released!

New Synthetica Features

New SyntheticaAddons Features

Synthetica + NetBeans 7.1

Related Links

Synthetica V2.14.2 and SyntheticaAddons V1.6.2 have been released!

Synthetica + NetBeans RCP, Part II

Create Module Synthetica

Create Module SyntheticaAddons

Modify your Main/Core Module

Modify your Netbeans Platform Application

Related Links

Synthetica maintenance release V2.14.1 is available

SyntheticaAddons maintenance release V1.6.1 is available

JYTabbedPane Features in SyntheticaAddons V1.6

PlusButton support to add new tabs

Editable tabs

Custom Close Button Strategy

Tab History Support

Related Posts

Synthetica V2.14 and SyntheticaAddons V1.6 is released!

New Synthetica Features

New SyntheticaAddons Features

Swing QuickTip: Redispatching Mouse Events

Related Links