Cómo crear un WYSIWYG con Java Swing

En este artículo te vamos a mostrar cómo crear un editor de texto básico con Java. Para ello utilizaremos la librería gráfica Swing, para ayudarnos con los componentes visuales de la aplicación. Como sabéis, Java Swing es una librería implementada para Java que incluye widgets para crear una interfaz gráfica de usuario, tales como cajas de texto, botones, desplegables y tablas.

En esta ocasión la utilizaremos para crear un sencillo editor de texto con el que podamos guardar documentos, cambiar de fuente y de tamaño y unas cuantas opciones más. Como podéis intuir será un editor sencillito, tampoco penséis que vamos a desarrollar Sublime Text, pero aún así una herramienta muy útil sobretodo para momentos de emergencia como es el caso de la edición de archivos que requieren una rápida intervención.

¿Qué vamos a utilizar para implementar la herramienta?

  • Usaremos un componente toolbox
  • Usaremos JTextPane
  • También nos ayudaremos de JFileChooser y JColorChooser

En el editor visual, debes construir algo parecido a esto:

Empezamos con la implementación

Cargamos todas las fuentes en el combobox que nos permitirá cambiar de fuente.

private void loadFont() {
GraphicsEnvironment gEnv = GraphicsEnvironment.getLocalGraphicsEnvironment();
// get all font name 
String[] fontNames = gEnv.getAvailableFontFamilyNames();
// load to combobox
ComboBoxModel model = new DefaultComboBoxModel(fontNames);
jcbFont.setModel(model);
}​

Cuando el usuario seleccione una fuente y un tamaño, tendremos que ajustar la fuente y el tamaño seleccionados por el usuario también en el componente textpane

private void jcbFontActionPerformed(java.awt.event.ActionEvent evt) {
// Change font of text
jTextPane1.setFont(new Font(jcbFont.getSelectedItem().toString(),
Font.PLAIN, Integer.parseInt(jcbSelectSize.getSelectedItem().toString())));
}
 
private void jcbSelectSizeActionPerformed(java.awt.event.ActionEvent evt) {
// Select size of text
String getSize = jcbSelectSize.getSelectedItem().toString();
Font f = jTextPane1.getFont();
// setting new size
jTextPane1.setFont(new Font(f.getFontName(),
f.getStyle(), Integer.parseInt(getSize)));
}

La API de JColorChooser de Java Swing nos ayuda a obtener un color mediante una ventana de diálogo. Usa el código de más abajo para llamar al evento ActionPerformed del botón de color.

private void btnSelectColorActionPerformed(java.awt.event.ActionEvent evt) {
Color jColor = selectColor;
// open color dialog and select Color
if ((jColor = JColorChooser.showDialog(this, "Select color", jColor)) != null) {
selectColor = jColor;
// set text color
jTextPane1.setForeground(selectColor);
}
}

RTFEditorKit puede ayudar a leer el texto formateado en el JTextPane y escribir en ficheros del sistema mediante el texto enriquecido obtenido del componente.

Cuando los usuarios hacen click en el boton de Guardar

private void save() {
JFileChooser file = new JFileChooser();
TextFilter filter = new TextFilter();
file.setFileFilter(filter);
String fileName = "";
// show save file dialog
if (file.showSaveDialog(this) == JFileChooser.APPROVE_OPTION) {
// get full path of selected file
fileName = file.getSelectedFile().getAbsolutePath();
// get meta of text
StyledDocument doc = (StyledDocument) jTextPane1.getDocument();
// convert to richtext format
RTFEditorKit kit = new RTFEditorKit();
BufferedOutputStream out;
try {
out = new BufferedOutputStream(new FileOutputStream(fileName));
// save content to file
kit.write(out, doc, doc.getStartPosition().getOffset(), doc.getLength());
out.flush();
out.close();
} catch (Exception e) {
System.out.println("Err:" + e.toString());
}
 
} else {
return;
}
}

Código para el botón de Abrir archivo y Abrir archivo como

private void open() {
JFileChooser file = new JFileChooser();
TextFilter filter = new TextFilter();
file.setFileFilter(filter);
String fileName = "";
// show open file dialog
if (file.showOpenDialog(this) == JFileChooser.APPROVE_OPTION) {
fileName = file.getSelectedFile().getAbsolutePath();
} else {
return;
}
// using richtext format
RTFEditorKit rtf = new RTFEditorKit();
try {
// load file into jTextPane
FileInputStream fi = new FileInputStream(fileName);
rtf.read(fi, jTextPane1.getDocument(), 0);
fi.close();
} catch (Exception e) {
System.out.println("err:" + e.toString());
}
}​

Y este ha sido el artículo en el que trataba explicaros cómo crear un editor de texto básico con Java Swing, esperamos que te haya gustado y sepas aplicarlo en tus futuros proyectos. Muchas gracias al autor del código Ngo Tuong Dan por cedernos la publicación del mismo.

Ya sabes que si nos quieres proponer un tema que quieres ver reflejado como un tutorial o como una práctica, solo tienes que hacer uso del área de comentarios de un poco más abajo. Por el contrario, si quieres enviarnos tus propios tutoriales, puedes hacerlo a través de la intranet de usuarios que está habilitada para ello, a través del menú Enviar Tutorial. Ya sabes, ayúdanos a crecer con tus conocimientos. ¡Un saludo y feliz código!

COMPARTE ESTE ARTÍCULO

COMPARTIR EN FACEBOOK
COMPARTIR EN TWITTER
COMPARTIR EN LINKEDIN
COMPARTIR EN WHATSAPP