Scaling (zoom) feature in the JTextPane for HTML View

There are many pages discussing making Zooming feature available in Java JEditorPane or JTextPane. On of the most complete ones is on http://java-sl.com

showing feasible implementations that handles:

• page zooms

  • caret position and selected text highlight rendering issues

1. The caret+selection issue is often over-looked, and the solution does Not work for JTextPane used to render HTML, such as in Ekit HTML editor from hexidec.

2. In addition, animated GIF also does not update correctly in Ekit.

Thus, I provide a specific solution for these (HTML & GIF).

Scaling (Zoom) Feature

Firstly, implement the scaling solution in http://java-sl.com/Scale_In_JEditorPane.html

For Ekit, merge the features into com.hexidec.ekit.component.ExtendedHTMLEditorKit instead.

Once accomplished, you'll get zoom ability in the text editor. It even works for HTML documents.

However, owing to floating point scaling and underlying integer-based glyph (text) rendering, it causes the ugly display issues in caret position and selected text highlights in zoomed view. The article mentions a couple of fixes involving setting i18n hint and overriding repaint(), but they don't fully work. The subsequent fix is needed.

Caret+Selection Fix for Plain Text

Secondly, to fix the issue, use the fix in the informative article: http://java-sl.com/Scale_In_JEditorPane_GlyphPainter.html

It provides ScaledGlyphPainter (extends GlyphView.GlyphPainter) and ScaledLabelView* (extends LabelView) classes to achieve this.

Note: the original article has a typo. These can be downloaded from java-sl.com in scale_glyphpainter.jar and the source codes are in the 'src' folder.

Hopefully it works, but for Ekit, the issues persists for HTML documents.

Thus, I've figured out the correct fix for Ekit or JTextPane showing HTML documents. This solution is in the next section.

Caret+Selection Fix for HTML

Basically, you need to adapt the prior solution and change the correct elements.

Modify com.hexidec.ekit.component.ExtendedHTMLEditorKit.java's HTMLFactoryExtended.create() method to create the equivalent of ScaledLabelView.

Though here, I would like to rename this new class ScaledInlineView to better reflect the correct solution. Which in this case, is that you have to extend javax.swing.text.html.InlineView instead of LabelView.

To use it:

With this fix, the rendering looks way better.

If you'd brute forced the original ScaledLabelView in, HTML text will become plain text and line breaks (i.e. <br>) will fail.

Side Note: internally HTMLFactory uses InlineView for rendering HTML text, and a hidden child class of BRView for rendering the line breaks.

Animated GIF Fix for Ekit

Ekit has a custom RelativeImageView class that renders images for HTML pages in JTextPane. It makes a bounds assumption in its repaint request method that is no longer valid when the page is zoomed.

Thus, this needs to be fixed by changing the fContainer.repaint call:

Ekit Mod

My mod 0f Ekit is available on GitHub here.

It adds the page zoom feature and lots of keyboard short-cuts for ease of use =)

Acknowledgments

Thanks to all the authors and helpful troubleshooters on StackOverflow etc., all of who provided the original zoom features and fixes, and links to the articles =)

And Howard Kistler for the decade old Java-based HTML editor, Ekit.