How can I change the highlight color of a focused JComboBox

Question

Let me first explain what I'm looking to achieve. I'm creating a data entry form in Swing, made up of a number of JComboBoxes & JTextFields. A validation routine iterates over those components and determines if the values specified for each control are 'valid' (the details of the validation are irrelevant for the purposes of this example).

When the routine identifies that a component contains an invalid value, I want to change the background color of that field, and also the foreground/text color of that field - to make it clear to the user that there is a problem with that field.

Where a field is deemed 'valid', I want to set the background of the control to be white - and the foreground/text to be black.

All pretty straightforward so far, and all achievable within the attached demo code below.

When a Combo Box contains a valid value, and is focused - the background of the editor within the combo is set to a bluish color, which I'm perfectly happy with.

However, what I'm trying to achieve is to change the color that is used to highlight a focused combo box when that combo box contains an invalid value. Despite having changed the background color of the combo box to be pink, if the control is focused, it still uses the blue color to indicate that it is focused.

Example of invalid field that is focused: http://postimg.org/image/ne9xgjch3/

Though I appreciate that this is perfectly normal behaviour, what I would like to do, is change the color that is used to highlight one of the 'invalid' fields to a darker shade of the color that a non-focused & invalid control would have - so that the user can still see which control is focused, and it still be pink all over. I appreciate that this might seem petty, but my end user is insistant that the whole field remains pink (or rather, a different shade of pink) when focused. This is what my eutopia, a focused and 'invalid' field, would look like:

http://postimg.org/image/9793bqcfj/

I've tried extending the DefaultListCellRenderer & BasicComboBoxEditor classes, and setting those against the combo box as the renderer and editor respectively. I was under the impression that the Editor would be where I needed to focus my attentions, so within the getEditorComponent method of the class, I would return a label with an appropriate background and foreground - however from within that method, I have no way of knowing whether or not the control has focus, so have no way of determining how I should format the returned label. Additionally, as soon as I started setting an Editor against the combobox, I seemed to lose the ability to focus the control at all - though that may have been my lack of knowledge on how to implement the editor.

I've been reading about the BasicComboBoxUI too, but nothing I've come across has stood out as the solution.

Please can someone kindly point me in the right direction, I've spent days tinkering with this, and it's really starting to bug me. Please excuse the netbeans generated demo code, it was just to allow me to knock together a demo quickly.

package com.test;

import java.awt.*;

public class TestForm extends javax.swing.JFrame {

    public TestForm()
    {
        initComponents();
    }

    @SuppressWarnings("unchecked")
    // <editor-fold defaultstate="collapsed" desc="Generated Code">//GEN-BEGIN:initComponents
    private void initComponents() {

        cboOne = new javax.swing.JComboBox();
        txtOne = new javax.swing.JTextField();
        txtTwo = new javax.swing.JTextField();
        btnValidate = new javax.swing.JButton();

        setDefaultCloseOperation(javax.swing.WindowConstants.EXIT_ON_CLOSE);

        cboOne.setBackground(new java.awt.Color(255, 255, 255));
        cboOne.setModel(new javax.swing.DefaultComboBoxModel(new String[] { "Valid Value", "Invalid Value", "Another Invalid Value" }));

        txtOne.setText("123");

        txtTwo.setText("123");

        btnValidate.setText("Validate");
        btnValidate.addActionListener(new java.awt.event.ActionListener() {
            public void actionPerformed(java.awt.event.ActionEvent evt) {
                btnValidateActionPerformed(evt);
            }
        });

        javax.swing.GroupLayout layout = new javax.swing.GroupLayout(getContentPane());
        getContentPane().setLayout(layout);
        layout.setHorizontalGroup(
            layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING)
            .addGroup(layout.createSequentialGroup()
                .addContainerGap()
                .addGroup(layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING)
                    .addComponent(cboOne, 0, 376, Short.MAX_VALUE)
                    .addComponent(txtOne)
                    .addComponent(txtTwo)
                    .addGroup(javax.swing.GroupLayout.Alignment.TRAILING, layout.createSequentialGroup()
                        .addGap(0, 0, Short.MAX_VALUE)
                        .addComponent(btnValidate)))
                .addContainerGap())
        );
        layout.setVerticalGroup(
            layout.createParallelGroup(javax.swing.GroupLayout.Alignment.LEADING)
            .addGroup(layout.createSequentialGroup()
                .addContainerGap()
                .addComponent(cboOne, javax.swing.GroupLayout.PREFERRED_SIZE, 65, javax.swing.GroupLayout.PREFERRED_SIZE)
                .addPreferredGap(javax.swing.LayoutStyle.ComponentPlacement.RELATED)
                .addComponent(txtOne, javax.swing.GroupLayout.PREFERRED_SIZE, 51, javax.swing.GroupLayout.PREFERRED_SIZE)
                .addPreferredGap(javax.swing.LayoutStyle.ComponentPlacement.RELATED)
                .addComponent(txtTwo, javax.swing.GroupLayout.PREFERRED_SIZE, 58, javax.swing.GroupLayout.PREFERRED_SIZE)
                .addPreferredGap(javax.swing.LayoutStyle.ComponentPlacement.UNRELATED)
                .addComponent(btnValidate)
                .addContainerGap(javax.swing.GroupLayout.DEFAULT_SIZE, Short.MAX_VALUE))
        );

        pack();
    }// </editor-fold>//GEN-END:initComponents

    private void btnValidateActionPerformed(java.awt.event.ActionEvent evt) {//GEN-FIRST:event_btnValidateActionPerformed

        //Check if the selection in the ComboBox is valid...
        if (((String)cboOne.getSelectedItem()).equals("Valid Value"))
        {
            //Selected Value is Valid.
            //We want the combo box to appear with a white background
            //and black text.
            cboOne.setBackground(Color.white);
            cboOne.setForeground(Color.black);
        }
        else
        {
            //The value specified is invalid.
            //We want to highlight the field in pink to identify an issue,
            //and change the color of the text to red too:
            cboOne.setBackground(Color.pink);
            cboOne.setForeground(Color.red);
        }

        //Check if the value entered into the first Text Field is valid...
        if (txtOne.getText().equals("123"))
        {
            //Selected Value is Valid.
            //We want the text box to appear with a white background
            //and black text.            
            txtOne.setBackground(Color.white);
            txtOne.setForeground(Color.black);
        }
        else
        {
            //Selected Value is invalid.
            //We want the text box to appear with a pink background
            //and red text. 
            txtOne.setBackground(Color.pink);
            txtOne.setForeground(Color.red);
        }

        //Check if the value entered into the second Text Field is valid...
        if (txtTwo.getText().equals("123"))
        {
            //Selected Value is Valid.
            //We want the text box to appear with a white background
            //and black text. 
            txtTwo.setBackground(Color.white);
            txtTwo.setForeground(Color.black);
        }
        else
        {
            //Selected Value is invalid.
            //We want the text box to appear with a pink background
            //and red text. 
            txtTwo.setBackground(Color.pink);
            txtTwo.setForeground(Color.red);
        }

    }//GEN-LAST:event_btnValidateActionPerformed

    public static void main(String args[]) {


        /* Create and display the form */
        java.awt.EventQueue.invokeLater(new Runnable() {
            public void run() {
                new TestForm().setVisible(true);
            }
        });
    }

    // Variables declaration - do not modify//GEN-BEGIN:variables
    private javax.swing.JButton btnValidate;
    private javax.swing.JComboBox cboOne;
    private javax.swing.JComboBox jComboBox1;
    private javax.swing.JComboBox jComboBox2;
    private javax.swing.JTextField txtOne;
    private javax.swing.JTextField txtTwo;
    // End of variables declaration//GEN-END:variables
}

Answer 1

Update

Forget to mention. The reason you're having problems with the coloring of your combobox is because the color you are seeing is the selection color. The color is defined within the look and feel defaults, there is no way to change these colors for a single component without writing your own look and feel delegate, which I, personally wouldn't

This is an example of providing highlighting to invalid fields using JXLayer (now JLayer, but I've not had the time to convert it), while this example does use the InputVerifer API, there is no reason it has to, it's just used for part of the example. It would be quite easy to do post validation highlighting as well, the focus is on the highlighting functionality - not the method of validation ;).

This is based on the idea presented by Kirill Grouchnikov on his Pushing Pixels blog, Validation overlays using JXLayer

This is a prototype of an idea I did some time ago, the code still needs some tweaking to improve performance, but is otherwise quite functional...I'd prefer better in built support for real time validation...but that's just me ;)

Main test class...

import com.jhlabs.image.GaussianFilter;
import java.awt.AlphaComposite;
import java.awt.BorderLayout;
import java.awt.Color;
import java.awt.Component;
import java.awt.Container;
import java.awt.Dimension;
import java.awt.EventQueue;
import java.awt.Graphics2D;
import java.awt.GraphicsConfiguration;
import java.awt.GraphicsEnvironment;
import java.awt.GridBagConstraints;
import java.awt.GridBagLayout;
import java.awt.Insets;
import java.awt.Point;
import java.awt.Transparency;
import java.awt.image.BufferedImage;
import java.lang.ref.WeakReference;
import java.util.ArrayList;
import java.util.List;
import javax.swing.InputVerifier;
import javax.swing.JComboBox;
import javax.swing.JComponent;
import javax.swing.JFrame;
import javax.swing.JPanel;
import javax.swing.JTextField;
import javax.swing.SwingUtilities;
import javax.swing.UIManager;
import javax.swing.UnsupportedLookAndFeelException;
import javax.swing.event.ChangeEvent;
import javax.swing.event.ChangeListener;
import javax.swing.event.EventListenerList;
import org.jdesktop.jxlayer.JXLayer;
import org.jdesktop.jxlayer.plaf.AbstractLayerUI;

public class FormValidationExample {

    public static void main(String[] args) {
        new FormValidationExample();
    }

    public FormValidationExample() {
        EventQueue.invokeLater(new Runnable() {
            @Override
            public void run() {
                try {
                    UIManager.setLookAndFeel(UIManager.getSystemLookAndFeelClassName());
                } catch (ClassNotFoundException | InstantiationException | IllegalAccessException | UnsupportedLookAndFeelException ex) {
                }

                JFrame frame = new JFrame("Testing");
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.setLayout(new BorderLayout());
                frame.add(new TestPane());
                frame.pack();
                frame.setLocationRelativeTo(null);
                frame.setVisible(true);
            }
        });
    }

    public class TestPane extends JPanel {

        private JXLayer<JPanel> layer;

        private javax.swing.JComboBox cboOne;
        private javax.swing.JTextField txtOne;
        private javax.swing.JTextField txtTwo;

        private DefaultValidationHighlightModel validationModel;
        private boolean ignoreValidationRequest;

        public TestPane() {
            setLayout(new BorderLayout());
            JPanel content = new JPanel(new GridBagLayout());

            ValidationUI ui = new ValidationUI();
            validationModel = new DefaultValidationHighlightModel(ui);

            layer = new JXLayer<>(content, ui);
            add(layer);

            cboOne = new javax.swing.JComboBox();
            cboOne.setInputVerifier(new AbstractValidationInputVerifier(validationModel) {
                @Override
                public boolean verify(JComponent input) {
                    boolean valid = false;
                    JComboBox cb = (JComboBox) input;
                    String textOfOne = txtOne.getText();
                    String textOfTwo = txtTwo.getText();
                    if (cb.getSelectedIndex() == 2) {
                        valid = true;
                    } else if (cb.getSelectedIndex() == 0
                            && "123".equals(textOfOne)
                            && "456".equals(textOfTwo)) {
                        valid = true;
                    } else if (cb.getSelectedIndex() == 1
                            && "456".equals(textOfOne)
                            && "789".equals(textOfTwo)) {
                        valid = true;
                    }
                    return valid;
                }
            });
            txtOne = new javax.swing.JTextField("123", 10);
            txtOne.setInputVerifier(new AbstractValidationInputVerifier(validationModel) {
                @Override
                public boolean verify(JComponent input) {
                    JTextField field = (JTextField) input;
                    String text = field.getText();
                    return "123".equals(text) || "456".equals(text);
                }
            });
            txtTwo = new javax.swing.JTextField("123", 10);
            txtTwo.setInputVerifier(new AbstractValidationInputVerifier(validationModel) {
                @Override
                public boolean verify(JComponent input) {
                    JTextField field = (JTextField) input;
                    String text = field.getText();
                    return "456".equals(text) || "789".equals(text);
                }
            });

            cboOne.setModel(new javax.swing.DefaultComboBoxModel(new String[]{"Only works with 123, 456", "Only works with 456, 789", "Works with everybody"}));

            GridBagConstraints gbc = new GridBagConstraints();
            gbc.gridwidth = GridBagConstraints.REMAINDER;
            gbc.fill = GridBagConstraints.HORIZONTAL;
            gbc.insets = new Insets(4, 4, 4, 4);

            content.add(cboOne, gbc);
            content.add(txtOne, gbc);
            content.add(txtTwo, gbc);

            validateFields();

        }

        protected void validateFields() {
            if (!ignoreValidationRequest) {
                ignoreValidationRequest = true;
                try {
                    cboOne.getInputVerifier().shouldYieldFocus(cboOne);
                    txtOne.getInputVerifier().shouldYieldFocus(txtOne);
                    txtTwo.getInputVerifier().shouldYieldFocus(txtTwo);
                } finally {
                    ignoreValidationRequest = false;
                }
            }
        }

        public abstract class AbstractValidationInputVerifier extends InputVerifier {

            private IValidationHighlightModel model;

            public AbstractValidationInputVerifier(IValidationHighlightModel model) {
                this.model = model;
            }

            public IValidationHighlightModel getModel() {
                return model;
            }

            @Override
            public boolean shouldYieldFocus(JComponent input) {
                if (verify(input)) {
                    getModel().removeInvalidField(input);
                } else {
                    getModel().addInvalidField(input);
                }
                validateFields();
                return true;
            }

        }

    }
}

JXLayer related, highlight UI layers...

public class ValidationUI extends HighlightComponentUI {

    public ValidationUI() {
        super(Color.RED);
    }

}

public class HighlightComponentUI extends AbstractLayerUI<JPanel> {

    private List<WeakReference<Component>> lstHighlights;
    private Color highlightColor;

    public HighlightComponentUI(Color highlight) {
        highlightColor = highlight;
        lstHighlights = new ArrayList<WeakReference<Component>>(25);
    }

    protected void cleanReferences() {
        if (lstHighlights.size() > 0) {
            List<WeakReference<Component>> removed = new ArrayList<WeakReference<Component>>(lstHighlights.size());
            for (WeakReference<Component> wr : lstHighlights) {
                Component weak = wr.get();
                if (weak == null) {
                    removed.add(wr);
                }
            }
            lstHighlights.removeAll(removed);
            setDirty(true);
        }
    }

    protected boolean contains(Component comp) {
        boolean contains = false;
        cleanReferences();
        for (WeakReference<Component> wr : lstHighlights) {
            Component weak = wr.get();
            if (weak.equals(comp)) {
                contains = true;
                break;
            }
        }
        return contains;
    }

    protected void clearHighlights() {
        lstHighlights.clear();
        setDirty(true);
    }

    protected void addHighlight(Component comp) {
        if (comp != null) {
            if (!contains(comp)) {
                lstHighlights.add(new WeakReference<Component>(comp));
                setDirty(true);
            }
        }
    }

    public Component[] getHighlightedComponents() {
        List<Component> comps = new ArrayList<>(lstHighlights.size());
        for (WeakReference<Component> wr : lstHighlights) {
            Component comp = wr.get();
            if (comp != null) {
                comps.add(comp);
            }
        }
        return comps.toArray(new Component[comps.size()]);
    }

    protected void removeHighlight(Component comp) {
        cleanReferences();
        WeakReference<Component> toRemove = null;
        for (WeakReference<Component> wr : lstHighlights) {
            Component weak = wr.get();
            if (weak.equals(comp)) {
                toRemove = wr;
                break;
            }
        }
        if (toRemove != null) {
            lstHighlights.remove(toRemove);
            setDirty(true);
        }
    }

    public Color getHighlight() {
        return highlightColor;
    }

    /**
     * Does a recursive search of all the child components of the supplied
     * parent looking for the supplied child
     *
     * @param parent
     * @param child
     * @return true if the child resides within the parent's hierarchy,
     * otherwise false
     */
    public boolean contains(Container parent, Component child) {

        boolean contains = false;
        if (child.getParent() != null) {
            if (child.getParent().equals(parent)) {
                contains = true;
            } else {
                for (Component comp : parent.getComponents()) {
                    if (comp instanceof Container) {
                        if (contains((Container) comp, child)) {
                            contains = true;
                            break;
                        }
                    }
                }
            }
        }

        return contains;
    }

    @Override
    protected void paintLayer(Graphics2D g2, JXLayer<? extends JPanel> l) {
        super.paintLayer(g2, l);
        Graphics2D c = (Graphics2D) g2.create();
        JComponent view = l.getView();
        while (view instanceof JXLayer) {
            view = (JComponent) ((JXLayer) view).getView();
        }
        for (WeakReference<Component> wr : lstHighlights) {

            Component comp = wr.get();
            if (comp != null && contains(view, comp)) {

                // A cache here would be VERY useful, would need to be mainatined
                // against the component instance as well as the component
                // size properties...
                BufferedImage img = new BufferedImage(comp.getWidth(), comp.getHeight(), BufferedImage.TYPE_INT_ARGB);
                Graphics2D g2d = img.createGraphics();
                g2d.setComposite(AlphaComposite.Clear);
                g2d.fillRect(0, 0, img.getWidth(), img.getHeight());
                g2d.setComposite(AlphaComposite.SrcOver);
                comp.printAll(g2d);
                g2d.dispose();

                BufferedImage glow = GlowEffectFactory.generateGlow(img, 8, getHighlight(), 0.75f);

                Point point = comp.getLocation();
                point = SwingUtilities.convertPoint(comp.getParent(), point, view);

                int x = point.x - ((glow.getWidth() - comp.getWidth()) / 2);
                int y = point.y - ((glow.getHeight() - comp.getHeight()) / 2);
                c.drawImage(glow, x, y, l);

            }
        }
        c.dispose();
    }
}

Validation model related class (I like to use interfaces and abstract implementations to provide flexibility to the API and reduce the coupling where I can). My original prototype had the UI layer and model separated and updated via the ChangeListener support, but I combined them here for simplicity...

public class DefaultValidationHighlightModel extends AbstractValidationHighlightModel {

    private HighlightComponentUI ui;

    public DefaultValidationHighlightModel(HighlightComponentUI ui) {
        this.ui = ui;
    }

    @Override
    public void addInvalidField(Component comp) {
        if (!ui.contains(comp)) {
            ui.addHighlight(comp);
            fireStateChanged();
        }
    }

    @Override
    public void removeInvalidField(Component comp) {
        if (ui.contains(comp)) {
            ui.removeHighlight(comp);
            fireStateChanged();
        }
    }

    @Override
    public Component[] getInvalidFields() {
        return ui.getHighlightedComponents();
    }

}

public abstract class AbstractValidationHighlightModel implements IValidationHighlightModel {

    private EventListenerList listenerList;

    public EventListenerList getListenerList() {

        if (listenerList == null) {

            listenerList = new EventListenerList();

        }

        return listenerList;

    }

    @Override
    public void addChangeListener(ChangeListener listener) {

        getListenerList().add(ChangeListener.class, listener);

    }

    @Override
    public void removeChangeListener(ChangeListener listener) {

        getListenerList().remove(ChangeListener.class, listener);

    }

    protected ChangeListener[] getChangeListeners() {

        return getListenerList().getListeners(ChangeListener.class);

    }

    protected void fireStateChanged() {

        ChangeListener[] listeners = getChangeListeners();
        if (listeners != null && listeners.length > 0) {

            ChangeEvent evt = new ChangeEvent(this);
            for (ChangeListener listener : listeners) {

                listener.stateChanged(evt);

            }

        }

    }

}

public interface IValidationHighlightModel {
    public void addInvalidField(Component comp);
    public void removeInvalidField(Component comp);
    public Component[] getInvalidFields();
    public void addChangeListener(ChangeListener listener);
    public void removeChangeListener(ChangeListener listener);
}


public static class GlowEffectFactory {

    public static BufferedImage createCompatibleImage(int width, int height) {

        return createCompatibleImage(width, height, Transparency.TRANSLUCENT);

    }

    public static BufferedImage createCompatibleImage(Dimension size) {

        return createCompatibleImage(size.width, size.height);

    }

    public static BufferedImage createCompatibleImage(int width, int height, int transparency) {

        GraphicsConfiguration gc = GraphicsEnvironment.getLocalGraphicsEnvironment().getDefaultScreenDevice().getDefaultConfiguration();

        BufferedImage image = gc.createCompatibleImage(width, height, transparency);
        image.coerceData(true);
        return image;

    }

    public static BufferedImage applyMask(BufferedImage sourceImage, BufferedImage maskImage, int method) {

        BufferedImage maskedImage = null;
        if (sourceImage != null) {

            int width = maskImage.getWidth(null);
            int height = maskImage.getHeight(null);

            maskedImage = new BufferedImage(width, height, BufferedImage.TYPE_INT_ARGB);
            Graphics2D mg = maskedImage.createGraphics();

            int x = (width - sourceImage.getWidth(null)) / 2;
            int y = (height - sourceImage.getHeight(null)) / 2;

            mg.drawImage(sourceImage, x, y, null);
            mg.setComposite(AlphaComposite.getInstance(method));

            mg.drawImage(maskImage, 0, 0, null);

            mg.dispose();

        }

        return maskedImage;

    }

    public static BufferedImage generateBlur(BufferedImage imgSource, int size, Color color, float alpha) {

        GaussianFilter filter = new GaussianFilter(size);

        int imgWidth = imgSource.getWidth();
        int imgHeight = imgSource.getHeight();

        BufferedImage imgBlur = createCompatibleImage(imgWidth, imgHeight);
        Graphics2D g2 = imgBlur.createGraphics();

        g2.drawImage(imgSource, 0, 0, null);
        g2.setComposite(AlphaComposite.getInstance(AlphaComposite.SRC_IN, alpha));
        g2.setColor(color);

        g2.fillRect(0, 0, imgSource.getWidth(), imgSource.getHeight());
        g2.dispose();

        imgBlur = filter.filter(imgBlur, null);

        return imgBlur;

    }

    public static BufferedImage generateBlur(BufferedImage imgSource, int size) {

        GaussianFilter filter = new GaussianFilter(size);

        int imgWidth = imgSource.getWidth();
        int imgHeight = imgSource.getHeight();

        BufferedImage imgBlur = createCompatibleImage(imgWidth, imgHeight);
        Graphics2D g2 = imgBlur.createGraphics();

        g2.drawImage(imgSource, 0, 0, null);
        g2.dispose();

        imgBlur = filter.filter(imgBlur, null);

        return imgBlur;

    }

    public static BufferedImage generateGlow(BufferedImage imgSource, int size, Color color, float alpha) {

        int imgWidth = imgSource.getWidth() + (size * 2);
        int imgHeight = imgSource.getHeight() + (size * 2);

        BufferedImage imgMask = createCompatibleImage(imgWidth, imgHeight);
        Graphics2D g2 = imgMask.createGraphics();

        int x = Math.round((imgWidth - imgSource.getWidth()) / 2f);
        int y = Math.round((imgHeight - imgSource.getHeight()) / 2f);
        g2.drawImage(imgSource, x, y, null);
        g2.dispose();

        // ---- Blur here ---
        BufferedImage imgGlow = generateBlur(imgMask, size, color, alpha);

        // ---- Blur here ----
        imgGlow = applyMask(imgGlow, imgMask, AlphaComposite.DST_OUT);

        return imgGlow;

    }

}

Caveats

This requires JXLayer (I was using version 3) (which no longer seem to be available on the net...) and SwingX (I was using version 1.6.4)

I've put all the source code of JXLayer (version 3) and Piet's examples into a single zip and I would suggest, if you are interested, you grab a copy and store it some where safe.

You will also need JHLabs filters