Nested JTabbedPanes visual glitch

Question

When nesting JTabbedPanes, there's a noticeable color change between the parent and the child.

Here's a screenshot to illustrate the issue:

How would you get about making the transition smoother?

Are there any alternatives in terms of using other layouts or components?

Answer 1

That's because the JTabbedPane is not transparent. Try to call setOpaque(false) on the tabbed pane, e.g.:

JTabbedPane outer = new JTabbedPane();
outer.setOpaque(false);
// ...
// creating inner pane "Modificar"
JTabbedPane modificar = new JTabbedPane();
modificar.setOpaque(false);
outer.addTab("Modificar", modificar);

It might not work on all looks & feels, though. For example, GTK L&F ignores calls to setOpaque() on a JToolbar.

Another alternative is to use a transparent JPanel with FlowLayout and JToggleButtons grouped in a single ButtonGroup instead of a JTabbedPane, e.g.

private void initComponents() {
    JTabbedPane outer = new JTabbedPane();
    outer.setOpaque(false);
    // ...

    JPanel innerPane = new JPanel();
    innerPane.setOpaque(false);
    innerPane.setLayout(new FlowLayout());

    ButtonGroup group = new ButtonGroup();
    addButton(innerPane, group, new JToggleButton("alta"));    
    addButton(innerPane, group, new JToggleButton("Modificar")).setSelected(true);
    addButton(innerPane, group, new JToggleButton("compraTarifa"));

    outer.addTab("Socios", innerPane);

    // ...
}

private static <T extends AbstractButton> T addButton(Component parent, ButtonGroup group, T btn) {
    group.add(btn);
    parent.add(btn);
    return btn;
}