Transparent TextField with Synth Look and Feel

Question

I am trying to use synth to implement a textfield with a transparent background, and having some problems with it. I can see my panel and the transparent field fine enough in the beginning, but when the text in the field changes, it writes right over the previous text and becomes a pile of unreadable white marks. I've experimented with varying degrees of transparency, but you can still see the old field underneath slightly. Does anyone have any suggestions? My code is below.
Thanks.
synth.xml
<synth>
<!-- PANEL -->
<style id="panelStyle">
    <state>
        <imagePainter method="panelBackground" path="../../../lafImages/papyrus_bkgd.gif" sourceInsets="10 15 10 15"/>
    </state>
</style>
<bind style="panelStyle" type="name" key="PAPYRUS_PANEL"/>
<!-- TEXTFIELD -->
<style id="textFieldStyle">
    <font name="Kudasai" size="12"/>
    <state>
        <color type="TEXT_FOREGROUND" value="#FFFFFF"/>
        <!-- set the alpha value for transparency in 1st two digits -->
        <color type="BACKGROUND" value="#00000000"/>
    </state>
    <opaque value="false"/>
</style>
<bind style="textFieldStyle" type="region" key="TEXTFIELD"/>
</synth>
my tester
class SynthTester {
    private JTextField field;
    public SynthTester(){
        initLookAndFeel();
        JFrame main = new JFrame();
        JPanel panel = new JPanel();
        panel.setName("PAPYRUS_PANEL");
        field = new JTextField(3);
        field.setText("0");
        panel.add(field);
        JButton button = new JButton("+");
        button.addActionListener(new ActionListener() {
            public void actionPerformed(ActionEvent e) {
                int val;
                try {
                    val = Integer.parseInt(field.getText());
                } catch( Exception ex ) {
                    val = 0;
                val++;
                field.setText(Integer.toString(val));
        panel.add(button);
        main.add(panel);
        main.pack();
        main.setVisible(true);
    private void initLookAndFeel() {
        SynthLookAndFeel lookAndFeel = new SynthLookAndFeel(); 
        try {
            InputStream is = getClass().getResourceAsStream("synth.xml");
            if( is == null) {
                System.err.println("unable to load resource stream");
            } else {
                lookAndFeel.load(is, getClass());
                UIManager.setLookAndFeel(lookAndFeel);
        } catch (Exception e) {
            System.err.println("Couldn't get specified look and feel ("+ lookAndFeel+ "), for some reason.");
            System.err.println("Using the default look and feel.");
            e.printStackTrace();
            System.exit(1);
}

Answer 1

As its name implies, an imagePainter element creates a SynthPainter that paints from an image. For example:
<synth>
<style id="example">
<state>
<color value="white" type="BACKGROUND"/>
</state>
<imagePainter method="panelBackground" path="background.png"
sourceInsets="5 6 6 7" paintCenter="false"/>
<insets top="5" bottom="6" right="7" left="6"/>
</style>
<bind style="example" type="region" key="Panel"/>
</synth>