Programming Examples

Are you a Programmer or Application Developer or a DBA? Take a cup of coffee, sit back and spend few minutes here :)

JTextPane & Text Formatting

1. About JTextPane

The JTextPane component of Java Swing can render document like rich text content. So instead of a plain text, one can display styled text along with images. The JTextPane also supports housing the components like text field, combo boxes, etc. The styled text can have bold, italic, color, Font etc attributes applied to it. In this example, we will create a styled document using the JTextPane and StyleConstants.

2. StyleConstants & SimpleAttributeSet

In Swing, the text package holds both StyleConstants and SimpleAttributeSet. StyleConstants defines a set of styles and methods which plug those styles to the SimpleAttributeSet. For Example, the StyleConstants maintains a FontSize constant and provides a method to add that style constant to the SimpleAttributeSet by taking a number as a param.

Have a look at the below depiction:

Java Swing JTextPane Example
Java Swing JTextPane Example

JTextPane support two crucial functions. The insertIcon function can insert an image into the component and it needs an ImageIcon instance. We can construct this instance from the image file stored on the disc or internet.

The insertString method can insert a formatted string to the JTextPane. This method can take SimpleAttributeSet which holds a group of constants to apply text formatting. When we move to code, you will see how we use the StyleConstants to push the text styles to the Java Swing’s SimpleAttributeSet.

Know about JTextPane, StyleConstants and SimpleAttributeSet

3. About JTextPane Example

The below picture shows the example we create here:

Java Swing JTextPane Example
Java Swing JTextPane Example

The example is a JFrame Window which houses a JTextPane. Here, one can see the JTextPane Example displaying the content with a mixture of texts and images. The document displays heading text in blue colour and normal text in red colour. The heading text is slightly bigger than the normal text. Towards the end of the document, there will be document footer in green colour. This is not shown above.

Using this example, we will learn how to insert text and image into the JTextPane. At this moment, we can also visualize that we have three variations of the text and, in this example, we will group three types of text formatting styles to prepare the document.

4. Class Data Members

In the below code, at code snippet 02, we will see the data members for this example. JTextPane is the swing component which displays the document content. We also declare three styles to display blue heading text, normal red text, and green footer text. SimpleAttributeSet class of Java Swing will hold these style groups. Code snippet 01, we used it many times in our example and hence no explanation required here.

5. Create Style Groups – SimpleAttributeSet

Next, we create three groups via SimpleAttributeSet to hold the text formatting. Later, we will use these styling while preparing the document of this example.

6. Group StyleConstants via SimpleAttributeSet

The StyleConstants class provides utility functions to add text formatting to the SimpleAttributeSet. Say, for example, have a look at the code snippet 4.4a. Here, we are grouping four text formatting under a single attribute set called BlueTitleText. By looking at this code snippet, one can say the title text will be in 20-Points Verdana font with blue bold formatting. In the same way, we group two other style attributes in two separate formatting groups. Now, our attribute set is ready and we will focus on creating the JTextPane.

7. Create Scrollable JTextPane

We create the JTextPane just like how we created the JEditorPane in the previous example. Here, we give our JTextPane to the JScrollPane to avail the scrolling capability. We ask the JScrollPane to provide both horizontal and vertical scrolling support.

8. Move Cursor to End of JTextPane

Our JTextPane is ready and formatting groups also ready for the document creation. The below method will move the insertion point towards the end of the document. Prior to adding JTextPane content using the insertIcon and insertString methods, we will call this custom method.

JTextPane’s getDocument method gives us the Document instance and from that we can get the length of the document. Note, when we add the document content, its length will increase. We use this document length to move the insertion point towards the end of the document by calling the method setSelectionStart and setSelectionEnd. In our code snippet, we pass the document length to both these methods.

9. Insert Icon to JTextPane

Next, we write a method to insert icon to the JTextPane. Our method takes an ImageIcon instance and adds that to the JTextPane by calling the insertIcon method. You can also notice how we call the setInsertiontoDocEnd to move the cursor to the document end before inserting the image.

10. Insert Styled Text to JTextPane

The custom function insertDocContent is overloaded below by having two arguments from our previous version (Last section) which takes only one argument. Here, we moved the insertion point to the end of the document by calling our custom function setInsertiontoDocEnd. But we do not need this as the insertString Function will take care of the insert location.

Our custom function takes text we want to insert and the style we want to apply while setting the string to the document content. The style is of type SimpleAttributeSet, which we defined in section 6. While we call the insertString function of the Document, we pass this SimpleAttributeSet as param to apply the text formatting for the text we are going to insert. Also note, the first parameter denotes the insertion point and here we pass the length of the document. This means we always insert the string towards the end of the document. But, you can use this insertString function to insert the string content anywhere in the document.

11. JTextPane Styled Document Content

We have all set and now we will create the content for the document. You can pick the map from below and save it as PNG files (India.png, France.png). Or you can use your own images.


Now look at the code below. At line 2 and 8, we create titles for the document in a blue text by calling our custom function insertDocContent. Note, the third param passed the style attribute grouped under BlueTileText, which is a SimpleAttributeSet (Refer section 6). In the same way, we insert the normal red coloured text. For example, line 3-6 inserts a normal text in red color.

At line 7 and 17, we pass ImageIcon instance from C:\temp location. Make sure you have these PNG files in your C:\temp location or change the code to refer to the image files on your disc. Since we overloaded the function insertDocContent, we used it to insert both image and text contents. The key functions are insertIcon & insertString from Document, which will allow as to create the JTextPane document content dynamically.

12. Watch Implementation as Youtube

13. Code Reference



Categories: Swing

Tags: , , , , ,

Do you like this Example? Please comment about it for others!!

This site uses Akismet to reduce spam. Learn how your comment data is processed.