Jyloo Software - RSS Feed

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

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.

How To Set A Custom Scalable Font Size

Wed, 07 Sep 2011 09:17:29 GMT

Sometimes it's necessary to set a custom font size for a component just like below.


Font f = c.getFont();
//apply 13 point font size
c.setFont(f.deriveFont(13f));

The biggest disadvantage of using a absolute font size is that the default font size will be totally ignored. A better way is to increase/decrease the font size relatively to the default font size and to respect the font scale factor setting too. As you maybe know from the article Synthetica Font Settings, Synthetica supports a scale font factor to increase readability.

In the example below we increase the font size relatively by 2 points and invoke SyntheticaLookAndFeel#scaleFontSize() to make the value aware of the UI-property 'Synthetica.font.scaleFactor'. Because the font size getter method already returns the scaled size, we have to calculate the scaled size for the relative value only.


//UIManager.put("Synthetica.font.scaleFactor", 125);
UIManager.setLookAndFeel(...);
...
Font f = c.getFont();
//increase font size by 2 points
c.setFont(f.deriveFont(f.getSize2D() + SyntheticaLookAndFeel.scaleFontSize(2f)));

Note: Keep in mind that the default font size can vary by using different themes. The recommended way to set a custom font size is to do it relatively - avoid to use absolut values.

How To Customize A JYTabbedPane Component

Tue, 09 Aug 2011 08:59:58 GMT

In this article we describe how to create a custom JYTabbedPane style which will be used as main selector component - similar to page navigation from some popular websites. The result of the customization work is shown below.

Let's start with the Swing code used in the demo to create the tabbed panel.


JYTabbedPane tabbedPane = new JYTabbedPane();
tabbedPane.addTab("<html><b>PLANE</b></html>", createPanel("Plane-Panel"));
tabbedPane.addTab("<html><b>SHIP</b></html>", createPanel("Ship-Panel"));
tabbedPane.addTab("<html><b>TRAIN</b></html>", createPanel("Train-Panel"));
tabbedPane.addTab("<html><b>BUS</b></html>", createPanel("Bus-Panel"));
tabbedPane.addTab("<html><b>CAR</b></html>", createPanel("Car-Panel"));

//set tab icons
String[] icons = new String[]{"/demo/travelselector/plane.png", "/demo/travelselector/plane_selected.png",
        "/demo/travelselector/ship.png", "/demo/travelselector/ship_selected.png",
        "/demo/travelselector/train.png", "/demo/travelselector/train_selected.png",
        "/demo/travelselector/bus.png", "/demo/travelselector/bus_selected.png",
        "/demo/travelselector/car.png", "/demo/travelselector/car_selected.png"};
for (int i=0; i<tabbedPane.getTabCount(); i++)
{  
  JLabel l = tabbedPane.getTabLabelAt(i);
  l.setIcon(new TabIcon(tabbedPane, i, icons[i*2], icons[i*2+1]));
  l.setHorizontalTextPosition(SwingConstants.CENTER);
  l.setVerticalTextPosition(SwingConstants.BOTTOM);
}

The TabIcon makes use of two icon delegates to support unselected and selected tabs.


private static class TabIcon implements Icon
{
  private JTabbedPane tabPane;
  private int index;
  private Icon regularIcon;
  private Icon selectedIcon;
    
  public TabIcon(JTabbedPane tabPane, int index, String regularIconPath, String selectedIconPath)
  {
    this.tabPane = tabPane;
    this.index = index;
    this.regularIcon = new ImageIcon(getClass().getResource(regularIconPath));
    this.selectedIcon = new ImageIcon(getClass().getResource(selectedIconPath));
  }
    
  public void paintIcon(Component c, Graphics g, int x, int y)
  {
    if (index == tabPane.getSelectedIndex())
      selectedIcon.paintIcon(c, g, x, y);
    else
      regularIcon.paintIcon(c, g, x, y);
  }

  public int getIconWidth()
  {
    return (index == tabPane.getSelectedIndex()) ? selectedIcon.getIconWidth() : regularIcon.getIconWidth();
  }

  public int getIconHeight()
  {
    return (index == tabPane.getSelectedIndex()) ? selectedIcon.getIconHeight() : regularIcon.getIconHeight();
  }    
}

Because we use HTML-based labels for all tabs and also want to respect the default foreground colors, we have to add some code to update the label foreground. Update: Since SyntheticaAddons V1.6 this is no longer needed.


//update foreground for HTML labels
tabbedPane.addChangeListener(new ChangeListener()
{      
  public void stateChanged(ChangeEvent evt)
  {
    JYTabbedPane tabPane = (JYTabbedPane)evt.getSource();
    for (int i = 0; i < tabPane.getTabCount(); i++)
      tabPane.getTabLabelAt(i).setForeground(null);
  }
});

Here's the resulting screenshot:

In the next step we create a custom style and apply the style to the component. For this we create a XML file called "selectorTabbedPane.xml" and add some base declarations to remove/reduce all predefined insets.


<synth>

<!--
*******************************************************************************
SelectorTabbedPane
*******************************************************************************
-->
  <style id="selectorTabbedPane">
    <insets top="0" left="0" bottom="0" right="0"/>
  </style>
  <bind style="selectorTabbedPane" type="name" key="TabbedPane.SelectorTabbedPane"/>

  <style id="selectorTabbedPaneContent">
    <insets top="0" left="0" bottom="0" right="0"/>
  </style>
  <bind style="selectorTabbedPaneContent" type="name" key="TabbedPaneContent.SelectorTabbedPane"/>

  <style id="selectorTabbedPaneTabArea">
    <insets top="0" left="0" bottom="0" right="0"/>
  </style>
  <bind style="selectorTabbedPaneTabArea" type="name" key="TabbedPaneTabArea.SelectorTabbedPane"/>

  <style id="selectorTabbedPaneTab">
    <insets top="0" left="0" bottom="0" right="0"/>
  </style>
  <bind style="selectorTabbedPaneTab" type="name" key="TabbedPaneTab.SelectorTabbedPane"/>

</synth>

Now we load and apply the style to the tabbed panel.


//load custom style
UIManager.setLookAndFeel(new SyntheticaBlackEyeLookAndFeel(){
  @Override
  protected void loadCustomXML() throws ParseException
  {
    loadXMLConfig("/demo/travelselector/selectorTabbedPane.xml");        
  }
});
...    
JYTabbedPane tabbedPane = new JYTabbedPane();
//apply style
tabbedPane.setName("SelectorTabbedPane")

In the screenshot below you can see that all the space around the sub-elements doesn't appear any longer.

Because we need some space for the selector, we modify tab insets. Additionally we add text related color settings.


  <style id="selectorTabbedPaneTab">
    <insets top="8" left="2" bottom="22" right="2"/>
    <defaultsProperty key="JYTabbedPane.tab.selectedBold.SelectorTabbedPane" type="boolean" value="false"/>    
    <state>
      <color type="TEXT_FOREGROUND" value="#8B8D92"/>
    </state>
    <state value="SELECTED">
      <color type="TEXT_FOREGROUND" value="#D6D7DC"/>
    </state>
  </style>
  <bind style="selectorTabbedPaneTab" type="name" key="TabbedPaneTab.SelectorTabbedPane"/>

By specifying some JYTabbedPane properties, tabs will be centered and some additional space between the tabs appears.


  <style id="selectorTabbedPane">
    <insets top="0" left="0" bottom="0" right="0"/>
    <!-- 0 is Swing constant for CENTER -->
    <defaultsProperty key="JYTabbedPane.horizontalTabAlignment.SelectorTabbedPane" type="integer" value="0"/>
    <defaultsProperty key="JYTabbedPane.tabGap.SelectorTabbedPane" type="integer" value="20"/>
    <defaultsProperty key="JYTabbedPane.tabReorderByDraggingEnabled.SelectorTabbedPane" type="boolean" value="false"/>
    <defaultsProperty key="JYTabbedPane.tabControlsShowStrategy.SelectorTabbedPane" type="string" value="NEVER"/>        
  </style>
  <bind style="selectorTabbedPane" type="name" key="TabbedPane.SelectorTabbedPane"/>

In the next step we specify a background image for the tab area.


<style id="selectorTabbedPaneTabArea">
  <insets top="0" left="0" bottom="0" right="0"/>
  <state>
    <string id="tabbedPaneTabAreaBackground">/demo/travelselector/tabAreaBackground.png</string>
    <defaultsProperty key="Synthetica.tabbedPane.tabArea.background.image.top.SelectorTabbedPane" type="idref" value="tabbedPaneTabAreaBackground"/>
    <defaultsProperty key="Synthetica.tabbedPane.tabArea.background.image.top.insets.SelectorTabbedPane" type="insets" value="2 0 10 0"/>
  </state>
</style>

As you can see, the tab area background is streched by default. Because the background also contains a "noise-texture", the scale policy has to be set to TILED. For this and for painting the selector icon we specify our own painter class which implements some simple paint operations.


  <style id="selectorTabbedPane">
    <insets top="0" left="0" bottom="0" right="0"/>
    <object class="demo.travelselector.SelectorTabbedPanePainter" id="painter"/>
    <defaultsProperty key="Synthetica.JYTabbedPanePainter.SelectorTabbedPane" type="idref" value="painter"/>
...


public class SelectorTabbedPanePainter extends JYTabbedPanePainter
{
  private static Icon selectorIcon;
 
  @Override
  public void paintTabbedPaneTab(JComponent c, SyntheticaState state, int tabIndex, int placement, int position, int angle, Graphics g, int x, int y, int w, int h)
  {
    if (!state.isSet(State.SELECTED))
      return;
    
    if (selectorIcon == null)
      selectorIcon = new ImageIcon(getClass().getResource("/demo/travelselector/tabbedPaneSelector.png"));
    
    x += (w-selectorIcon.getIconWidth())/2;
    y += h-selectorIcon.getIconHeight();
    selectorIcon.paintIcon(c, g, x, y);
  }
 
  @Override
  public void paintTabbedPaneTabAreaBackground(JComponent c, SyntheticaState state, int placement, int angle, Graphics g, int x, int y, int w, int h)
  {
    String imagePath = SyntheticaLookAndFeel.getString("Synthetica.tabbedPane.tabArea.background.image.top", c);
    Insets insets = SyntheticaLookAndFeel.getInsets("Synthetica.tabbedPane.tabArea.background.image.top.insets", c);
    ImagePainter imagePainter = new ImagePainter(g, x, y, w, h, imagePath, insets, insets, ImagePainter.TILED, ImagePainter.STRETCHED);
    imagePainter.draw();
  }  
}

That's it - the result looks much more appealing.

Download Demo Sourcecode

Note: Of course it's possible to do similar customization for left/right/bottom placed tabs. All UI-property keys are listed in the API-Doc - see related UI-delegate and painter classes.

How To Create A Flat Button Style

Customization - How to apply a Firefox style to a JTabbedPane

How To Add History To A JYSearchField

Jyloo Software - RSS Feed

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

How To Set A Custom Scalable Font Size

Related Links

How To Customize A JYTabbedPane Component

Related Posts