1 pixel table border in JTextPane using HTML

Asked 28/7, 2010 at 17:8 Answered 31/10, 2014 at 9:22

I'm using a JTextPane to display some HTML that contains a table with a border. I want it to have a simple 1 pixel border.

I tried using style="border: 1px solid; border-collapse:collapse". This works in a web browser, but not in JTextPane.

Is there any way to have a simple 1 pixel table border using HTML in a JTextPane?

Nodus answered 28/7, 2010 at 17:8 Comment(0)

Here's a complete example:

package test

import java.awt.SystemColor;
import javax.swing.BorderFactory;
import javax.swing.BoxLayout;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.SwingConstants;
import javax.swing.SwingUtilities;

@SuppressWarnings("serial")
public class HtmlDemo extends JPanel {

    public HtmlDemo() {
        setLayout(new BoxLayout(this, BoxLayout.LINE_AXIS));

        String rgb = Integer.toHexString(SystemColor.window.getRGB());
        String backgroundColor = rgb.substring(2, rgb.length());

        String html = "<html>\n"
            + "<head>\n"
            + "<style type=\"text/css\">\n"
            + "table {\n" + "width: 100%\n" + "}\n"
            + "td, th {\n" + "background-color: #" + backgroundColor + "\n"
            + "}\n"
            + "</style>\n"
            + "</head>\n"
            + "<body>\n"
            + "HTML table test:\n"
            + "<div style=\"background-color: black\">\n"
            + "<table border=\"0\" cellpadding=\"2\" cellspacing=\"1\">\n"
            + "<tr>\n" + "<td>\n" + "cell1\n" + "</td>\n" + "<td>\n" + "cell2\n" + "</td>\n" + "</tr>\n"
            + "<tr>\n" + "<td>\n" + "cell3\n" + "</td>\n" + "<td>\n" + "cell4\n" + "</td>\n" + "</tr>\n"
            + "</div>\n"
            + "</body>\n"
            + "</html>";

        JLabel label = new JLabel(html);
        label.setVerticalAlignment(SwingConstants.CENTER);
        label.setHorizontalAlignment(SwingConstants.CENTER);

        setBorder(BorderFactory.createEmptyBorder(10, 10, 10, 10));
        add(label);
    }

    public static void main(String[] args) {

        SwingUtilities.invokeLater(new Runnable() {

            public void run() {
                JFrame frame = new JFrame("HtmlDemo");
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.add(new HtmlDemo());
                frame.pack();
                frame.setVisible(true);
            }
        });
    }
}

Rendering answered 19/8, 2011 at 21:24 Comment(1)

Small detail: You forgot to close the <table> tag: </table>. But thanx for this answer, really useful ;-) – Gristmill 24/3 at 22:13

Use a combination of

public static final String TD = "<td style='background-color: white'></td>";
public static final String TABLE_PROP = "style='border: 1px black solid; background-color: black' width='100%' cellspacing='1' cellpadding='2'";


String html = "<table " + TABLE_PROP + ">" + "<tr>" + TD + TD + "</tr><tr>" + TD + TD + "</tr></table>";
try
{
            htmlEditorKit.insertHTML(htmlDocument, caretPosition, html, 0, 0, null);
}

Pentagrid answered 4/2, 2011 at 15:53 Comment(1)

Great workaround! To reduce repeating code I have create following styles: table { border: 1px black solid; background-color: black;} and td, th { background-color: white; } – Aerostatic 14/6, 2013 at 12:40

Here's a complete example:

package test

import java.awt.SystemColor;
import javax.swing.BorderFactory;
import javax.swing.BoxLayout;
import javax.swing.JFrame;
import javax.swing.JLabel;
import javax.swing.JPanel;
import javax.swing.SwingConstants;
import javax.swing.SwingUtilities;

@SuppressWarnings("serial")
public class HtmlDemo extends JPanel {

    public HtmlDemo() {
        setLayout(new BoxLayout(this, BoxLayout.LINE_AXIS));

        String rgb = Integer.toHexString(SystemColor.window.getRGB());
        String backgroundColor = rgb.substring(2, rgb.length());

        String html = "<html>\n"
            + "<head>\n"
            + "<style type=\"text/css\">\n"
            + "table {\n" + "width: 100%\n" + "}\n"
            + "td, th {\n" + "background-color: #" + backgroundColor + "\n"
            + "}\n"
            + "</style>\n"
            + "</head>\n"
            + "<body>\n"
            + "HTML table test:\n"
            + "<div style=\"background-color: black\">\n"
            + "<table border=\"0\" cellpadding=\"2\" cellspacing=\"1\">\n"
            + "<tr>\n" + "<td>\n" + "cell1\n" + "</td>\n" + "<td>\n" + "cell2\n" + "</td>\n" + "</tr>\n"
            + "<tr>\n" + "<td>\n" + "cell3\n" + "</td>\n" + "<td>\n" + "cell4\n" + "</td>\n" + "</tr>\n"
            + "</div>\n"
            + "</body>\n"
            + "</html>";

        JLabel label = new JLabel(html);
        label.setVerticalAlignment(SwingConstants.CENTER);
        label.setHorizontalAlignment(SwingConstants.CENTER);

        setBorder(BorderFactory.createEmptyBorder(10, 10, 10, 10));
        add(label);
    }

    public static void main(String[] args) {

        SwingUtilities.invokeLater(new Runnable() {

            public void run() {
                JFrame frame = new JFrame("HtmlDemo");
                frame.setDefaultCloseOperation(JFrame.EXIT_ON_CLOSE);
                frame.add(new HtmlDemo());
                frame.pack();
                frame.setVisible(true);
            }
        });
    }
}

Rendering answered 19/8, 2011 at 21:24 Comment(1)

Small detail: You forgot to close the <table> tag: </table>. But thanx for this answer, really useful ;-) – Gristmill 24/3 at 22:13

javax.swing.text.html is based on HTML 3.2, but you can use the border attribute of the <table> tag.

Humfrid answered 28/7, 2010 at 19:22 Comment(2)

Setting border=1 doesn't create a 1 pixel border, because each cell has it's own border. – Nodus 28/7, 2010 at 21:40

@Chris B: You may have to adjust cellspacing and cellpadding, too. – Humfrid 28/7, 2010 at 22:26

trashgod is right - Java's HTML support is limited - so why not use an HTML workaround? Just put your table (with no borders) inside another table with one cell that has a border.

<table id='outerTable' border='1'><tr><td>
   <table id='innerTable'>
      // Content here
   </table>
</td></tr></table>

It's not the cleanest of methods, but it does get around HTML 3.2 limitations.'

Subjugate answered 5/1, 2011 at 14:41 Comment(0)

Here's an example to create a border to a table on preferable colour in HTML 3.2:

<table width="100%" cellpadding="1" bgcolor="#000000">
        <tr><td>
            <table width="100%"  bgcolor="#F6F6F6">
              <tr><td>   
                Test                 
              </td></tr>              
            </table>
        </td></tr></table>

Impoverish answered 31/10, 2014 at 9:22 Comment(0)

Recommended topics

Hot tags