Você está na página 1de 6

TextInput Material Design

TextInput es una caja de texto que implementa el estilo de Material Design popular en
dispositivos mviles, pero este swing es para aplicaciones de escritorio en java, esta
componente viene con su par TextInputPass para contraseas. La librera es totalmente
gratuita y es su primera versin primera as que es 99% posible que se encuentren
errores, si as fuera por favor notificar en los comentarios.
Instalacin
Paso 1
Descomprima el archivo RAR en algn sitio de su computadora (Ej.: C:\Program Files\mis
librerias\materialdesign, D:\java\librerias\materialdesign, etc )
En el encontrara 2 archivos:

MDTextInput-1.0.8-bin.jar La librera de Material Design


javadoc\ Documentacin

Paso 2
Con Netbeans abierto:
Dirgete al men Herramientas Librerias, se abrira una ventana:
1. Presione el botn new library para crear una nueva librera con el nombre de
Material Design
2. En la pestaa Ruta de clases, presionar el botn Archivo JAR/Carpeta y buscar en
el disco el archivo MDTextInput-1.0.8-bin.jar del paso 1
3. En la Pestaa Javadoc , presionar el boton Archivo ZIP/Carpeta y buscar en disco
la carpeta javadoc del paso 1
4. Presionar Aceptar para guardar la libreria
Paso 3
1. En la seccin de Paleta, realizar clic derecho Administrador de paleta

2. En la ventana Administrador de Paleta, clic en Nueva categora, en nombre de


categora escribir Material Design
3. Presionar el botn Add from Library (Agregar desde librera) buscar y seleccionar
la librera creada en el paso 2, presionar siguiente.

4. Seleccionar TextInput y TextInputPass, presionar siguiente

5. Seleccionar la carpeta Material Design y presionar Terminar Cerrar


Si sigui todos los pasos correctamente, en la seccin de Paleta , debe tener lo siguiente:

Aplicacin de ejemplo

Para este ejemplo desarrollaremos un formulario de login al estilo Google Mail


Paso 1. Crea un proyecto en Netbeans llamado Test Material Design y agrega un
JFrame como se ve en la siguiente imagen:

Utiliza el Look and Feel de Windows, es el que mejor se acomoda a este estilo
minimalista.
Paso 2. En el diseador de interfaces, agrega 1 textInput y 1 textInputPass, ademas de
1 botn como se ve a continuacin:

Paso 3. Tanto textInput como textInputPass tienen las mismas propiedades que
un JTextField, ademas de unas propias:
colorPrimary: Para el color del componente cuando este gane foco
counterEnabled: Para mostrar u ocultar el contador de caracteres
error: Para colocar el mensaje de error
errorEnabled: Para mostrar u ocultar el mensaje de error
hint: para el texto de ayuda
maxLength: Para indicar el contador mximo de caracteres

Selecciona textInput1 y cambia las siguientes propiedades:

maxLength = 16
hint = Nombre de usuario
colorPrimary = [0,102,255]

Selecciona textInputPass1 y cambia las siguientes propiedades:

counterEnbled = false
hint = Password
colorPrimary = [0,102,255]

Paso 4. Doble clic en el botn (jButton1) para abrir en modo cdigo y pegar el siguiente
cdigo:

private void jButton1ActionPerformed(java.awt.event.ActionEvent ev


t) {
if (this.textInput1.getText().trim().length() > 0) {
textInput1.setErrorEnabled(false);
if (this.textInput1.getText().trim().length() > 16) {
textInput1.setError("Longitud maxima de " + textInput1
.getMaxLength() + " caracteres");
textInput1.setErrorEnabled(true);
} else if (this.textInputPass1.getText().trim().length() >
0) {
textInputPass1.setErrorEnabled(false);
textInput1.setErrorEnabled(false);
JOptionPane.showMessageDialog(this, "Usuario: " + text
Input1.getText() + "\n"
+ "Contrasea: " + textInputPass1.getText() +
"\ngracias!!!");
} else {
textInputPass1.setError("Debe escribir su contrasea")
;
textInputPass1.setErrorEnabled(true);
}
} else {
textInput1.setError("Debe escribir su nombre de usuario");
textInput1.setErrorEnabled(true);
}
}

Ejecutar

Você também pode gostar