Continuación del tutorial [Personalizar JTabbedPane con Netbeans].
La clase BlackTabbedPaneUI que extendemos de BasicTabbedPaneUI, nos da la posibilidad de sobre escribir métodos propios de esta clase para dar un aspecto diferente a los Tabs (pestañas) y al Contenido del swing JTabbedPane. Para una descripción completa de todas los métodos y propiedades de esta clase, sugiero visitar el API Java Class BasicTabbedPaneUI.
Para este sencillo ejemplo solo necesitamos sobre escribir 3 métodos:
Antes, dentro la clase declaramos tres variables de tipo Color, ColorSel para el color del Tabs en estado seleccionado, ColorUnSel para los colores de los tabs no seleccionados y colorContentBorder para el color de borde del contenedor.
public Color colorSel = new Color(0, 0, 0); public Color colorUnSel = new Color(192, 192, 192); public Color colorContentBorder = colorSel;
Haciendo uso de java2d pintamos un rectángulo en las coordenadas X,Y dadas por la propia clase. Este método pinta todos los tabs que tenga el swing, es por eso que se debe hacer una distinción de que tab se esta pintando, si esta seleccionado o no, para eso la propiedad booleana isSelected nos indica tal estado.
@Override
protected void paintTabBackground( Graphics g, int tabPlacement, int tabIndex, int x, int y, int w, int h, boolean isSelected )
{
Graphics2D g2 = (Graphics2D)g;
g2.setColor( (isSelected)? colorSel : colorUnSel );
g2.fillRect(rects[tabIndex].x, rects[tabIndex].y,
rects[tabIndex].width, rects[tabIndex].height);
}
Para pintar el borde, de igual modo, utilizando java2d, pintamos un rectángulo (solo el borde) en las coordenadas (x,y) y (w,h) para el ancho y alto del tab.
@Override
protected void paintTabBorder(Graphics g, int tabPlacement, int tabIndex, int x, int y, int w, int h, boolean isSelected)
{
Graphics2D g2 = (Graphics2D)g;
g2.setColor( (isSelected)? colorSel : colorUnSel );
g2.drawRect(x, y, w, h);
}
Para terminar, pintamos el borde del contenedor, aquí tenemos que tener en cuenta que un JTabbedPane tiene 4 formas de disponer las pestañas, TOP, BOTTOM, LEFT, RIGHT, y de acuerdo a su posición las coordenadas x, y y el ancho y alto del contendor, así como de los propios tabs, varia. como los tabs son rectangulares no hay problema, para el contenedor, se deben hacer unos pequeños cálculos. Finalmente pintamos un rectángulo con las variables (x,y,w,h)
@Override
protected void paintContentBorder(Graphics g, int tabPlacement, int selectedIndex )
{
int width = tabPane.getWidth();
int height = tabPane.getHeight();
Insets insets = tabPane.getInsets();
int x = insets.left;
int y = insets.top;
int w = width - insets.right - insets.left;
int h = height - insets.top - insets.bottom;
switch(tabPlacement)
{
case LEFT:
x += calculateTabAreaWidth(tabPlacement, runCount, maxTabWidth);
x -= tabAreaInsets.right;
w -= (x - insets.left);
break;
case RIGHT:
w -= calculateTabAreaWidth(tabPlacement, runCount, maxTabWidth);
w += tabAreaInsets.left;
break;
case BOTTOM:
h -= calculateTabAreaHeight(tabPlacement, runCount, maxTabHeight);
h += tabAreaInsets.top;
break;
case TOP:
default:
y += calculateTabAreaHeight(tabPlacement, runCount, maxTabHeight);
y -= tabAreaInsets.bottom;
h -= (y - insets.top);
}
if ( tabPane.getTabCount() > 0 )
{
Color color = UIManager.getColor("TabbedPane.contentAreaColor");
if (color != null) {
g.setColor(color);
}
else if ( colorContentBorder == null || selectedIndex == -1 ) {
g.setColor(tabPane.getBackground());
}
else {
g.setColor(colorContentBorder);
}
g.fillRect(x,y,w,h);
}
}
La clase completa queda de la siguiente forma:
package org.matrix; import java.awt.Color; import java.awt.Graphics; import java.awt.Graphics2D; import java.awt.Insets; import javax.swing.UIManager; import javax.swing.plaf.basic.BasicTabbedPaneUI; /** * @web https://www.jc-mouse.net * @author Mouse */ public class BlackTabbedPaneUI extends BasicTabbedPaneUI { public Color colorSel = new Color(0, 0, 0); public Color colorUnSel = new Color(192, 192, 192); public Color colorContentBorder = colorSel; @Override protected void paintTabBackground( Graphics g, int tabPlacement, int tabIndex, int x, int y, int w, int h, boolean isSelected ) { Graphics2D g2 = (Graphics2D)g; g2.setColor( (isSelected)? colorSel : colorUnSel ); g2.fillRect(rects[tabIndex].x, rects[tabIndex].y, rects[tabIndex].width, rects[tabIndex].height); } @Override protected void paintTabBorder(Graphics g, int tabPlacement, int tabIndex, int x, int y, int w, int h, boolean isSelected) { Graphics2D g2 = (Graphics2D)g; g2.setColor( (isSelected)? colorSel : colorUnSel ); g2.drawRect(x, y, w, h); } @Override protected void paintContentBorder(Graphics g, int tabPlacement, int selectedIndex ) { int width = tabPane.getWidth(); int height = tabPane.getHeight(); Insets insets = tabPane.getInsets(); int x = insets.left; int y = insets.top; int w = width - insets.right - insets.left; int h = height - insets.top - insets.bottom; switch(tabPlacement) { case LEFT: x += calculateTabAreaWidth(tabPlacement, runCount, maxTabWidth); x -= tabAreaInsets.right; w -= (x - insets.left); break; case RIGHT: w -= calculateTabAreaWidth(tabPlacement, runCount, maxTabWidth); w += tabAreaInsets.left; break; case BOTTOM: h -= calculateTabAreaHeight(tabPlacement, runCount, maxTabHeight); h += tabAreaInsets.top; break; case TOP: default: y += calculateTabAreaHeight(tabPlacement, runCount, maxTabHeight); y -= tabAreaInsets.bottom; h -= (y - insets.top); } if ( tabPane.getTabCount() > 0 ) { Color color = UIManager.getColor("TabbedPane.contentAreaColor"); if (color != null) { g.setColor(color); } else if ( colorContentBorder == null || selectedIndex == -1 ) { g.setColor(tabPane.getBackground()); } else { g.setColor(colorContentBorder); } g.fillRect(x,y,w,h); } } }
La clase BlackTabbedPaneUI, se debe implementar en la clase BlackTabbedPane, asi tambien, completar los métodos SET y GET, la clase final queda de la siguiente forma:
package org.matrix; import java.awt.Color; import java.awt.Dimension; import javax.swing.JTabbedPane; /** * @web https://www.jc-mouse.net * @author Mouse */ public class BlackTabbedPane extends JTabbedPane { BlackTabbedPaneUI blackTabbedPaneUI = new BlackTabbedPaneUI(); /** * Constructor de clase */ public BlackTabbedPane(){ this.setPreferredSize( new Dimension(100,100) ); this.setForeground(new Color(255, 255, 255)); this.setUI( blackTabbedPaneUI ); this.setVisible(true); } public void setTabSelectedColor( Color color ) { blackTabbedPaneUI.colorSel = color; blackTabbedPaneUI.colorContentBorder=color; } public Color getTabSelectedColor() { return ( blackTabbedPaneUI.colorSel==null)? new Color(0,0,0): blackTabbedPaneUI.colorSel ; } public void setTabUnselectedColor( Color color ) { blackTabbedPaneUI.colorUnSel = color; } public Color getTabUnselectedColor() { return ( blackTabbedPaneUI.colorUnSel==null)? new Color(192,192,192): blackTabbedPaneUI.colorUnSel ; } }//-->
Ya solo nos queda crear el *.jar, clic derecho sobre el nombre del proyecto y CLEAN AND BUILD. con eso ya tenemos lista nuestra librería JTabbedPane. Para instalar y utilizar este swing desde netbeans, lee el siguiente tutorial [Añadir/Instalar nuevas librerias a Netbeans].
Bajate el proyecto completo en netbeans 7.2 HERE :=D
Si te quedo en alguna duda, preguuuuuuuuuuuuuntame 🙂
enjoy!!!
Yo soy yo :) JC Mouse, Soy orgullosamente boliviano soy fundador y CEO de la web jc-Mouse.net uno de las pocas web en emprendimiento y tecnología en Bolivia.
Toda la información que encuentres en este sitio es y sera completamente gratis siempre, puedes copiar, descargar y re-publicar si así lo deseas en otros blogs o sitios web, solo te pido a cambio que dejes una referencia a esta web. Esto nos ayuda a crecer y seguir aportando. Bye
Enjoy! :)
OCR (Optical Character Recognition) en español, Reconociminto Optico de Caracteres, es el proceso por el cual se extrae...
La clase hashMap es muy util para almacenar objetos de la forma ( Clave, Objeto ), donde Clave es un identificador único...
En este post crearemos un componente gráfico para java que nos permitirá seleccionar la hora del día de una manera senci...
Información sobre la serie: Neon Genesis Evangelion (新世紀エヴァンゲリオン, también conocido como «Evangelion») es una serie de an...
BottomNavigationView es una barra de navegación que se sitúa en la parte inferior de la pantalla en los dispositivos móv...
Modelo Vista Controlador (MVC) es un patrón de arquitectura de software que separa los datos de una aplicación, la inter...
Los comentarios estan cerrados
El gigante tecnologico Google a puesto un bonito Doodle en su buscador que esta fascinando a sus millones de usuarios qu...
WhatsApp anuncio a través de su blog que ya se encuentra disponible la función de envío de fotos y videos TEMPORALES, es...
Muchas de las innovaciones computacionales de la NASA se desarrollaron para ayudar a explorar el espacio, pero ahora la...
TikTok es una plataforma de microvideos muy popular entre los jóvenes el cual cuenta ya con millones de videos cortps de...
Gracias por el tutorial, lo revisare a fondo, pero no se si sepas como lograr pestañas así http://1.s3.envato.com/files/105657.jpg o talvez así (usando imagenes de un .psd generado). Gracias por todo.
lo más fácil es usar imágenes pero también puede hacerse usando java2d 🙂
orale interesante aporte justo para mejorar mis jtabbedpane aunque creo que ya me estoy desviando en lo que quiero hacer me estoy yendo a lo visual y no a lo funcional xD
gracias por el tutorial hermano… lo unico con lo que he tenido problemas es para hacer que me aparezcan los dos metodos en la paleta de propiedades de netbeans. de ante mano gracias compadre ojala me puedas responder
:/ no te entiendo, una vez que generas el jar y añades la librería a la paleta de netbeans, solo debes agregar la clase principal la que se extiende de jtabbedpane y no la que tiene el UI al final
Hola Mouse, interesante… lo del aspecto, muy bueno pero necesito que me ayudes si conoces la libreria Flamingo de java o Office LAF o el que esta ahora ultimo y se ve muy bueno por que es menos pesado Pink Matter, estoy realizando un proyecto con esas librerias ya encontre como darle el aspecto delos productos Office o como se conoce en VISUAL Studio la Cinta o Ribbon de Office. ademas quisiera como validar productos licenciados como por ejemplo los que se ven en JIDE, bueno te escribi a tu facebook pero nunca me respondes jejejej. me puedes buscar como http://facebook.com/TorbiscoChumpitazMarco
las librerías viene con sus respectivos demos, flamimgo no es la excepción, puedes personalizarlos pero claro no puedes hacer modificaciones radicales a menos que entiendas su código y lo vuelvas a compilar.
JIDE tiene muchas librerias intersantes, dime en cual estas intersado y vere si puedo ayudarte 🙂
perdón por no contestar en facebook pero a veces los mensajes se me pasan y no veo la razón de responder un mensaje con mas de 1 mes de antiguedad o.O 🙁 🙂
Jejejej….muy bien amigo.. mira dime donde cuelgo la libreria jFlamingo para que lo revices , mira mi proyecto cuenta con algunos aspectos que agradan mucho a la paersona para la cual estoy realizando el proyecto, lo priemro que hay que solucionar son:
Obtener las vistas o Aspectos del Microsoft 2007 o la de 2010 pero en Flamingo y si es mejor lo que tu incluistes con la Libreria swing BlackTabbedPane y estoypens
ando colocar los aptectos el boton de redireccionamiento al facebook al twiter, a lado del boton configurehelp de la cinta de Flamingo, mira yo quisiera habilitar de JIDE varias opciones voy aenviarte un mensaje por el facebook y colgar imagens y poner archivos que estan en el JIDE,,….. a me olvdaba mi aplicativo tiene como finalidad registrar a empleados, registrar el prestamos de articulos, tomar registro de asistencias a capacitacione sy entrenamientos mira te voy aenviar la svistas par que chekes como voy llendo… a tu instalador de MySQL y Java me servira de maravilla…Yo siempre estoy conectado durante las noches …me amanesco realizando los proyectos por que me gusta …Bueno de Antemno Muchas Gracias 🙂
los swing de JIDE son buenisimos pero son de pago, imitar algunos de ellos seria un buen reto, pero llevaría su tiempo
interesante lo que estas haciendo, pero soy novato y ya genere y contrui el proyecto pero no entiendo que mas hay que hacer…??? te agradecería una ayuda.
ya agregue la librería y la utilizo en un proyecto, los tab´s se visualizan bien pero el contentborder es de color azul… no se por que sucede????
si el contenedor te sale de color azul es porque estas usando el skin por defecto de netbeans, trata con el skin de windows 🙂
Muy bueno el JAR JTabbebPane al estilo win 8. Se te agradece JC. Yo tengo un codigo que copie de un foro y lo modifique a mis gustos, les dejo el post por si a alguien le sirve http://stackoverflow.com/questions/7054466/how-can-i-change-the-shape-of-a-jtabbedpane-tab/7056093#7056093 . Con esto que explico el master JC le entenderan facil al codigo.
puedes montar el proyecto completo y no solo el jar de este tema se lo agradeceria mucho muchas gracias
los enlaces de descarga estan al final del post
Hola, yo si que soy bien NUEVO en esto del netbeans, ya segui paso a paso lo indicado y ya tengo mi JAR, ahora como lo utilizo ? :p sorry por la ignorancia, quiero saber como lo aplico?, tengo mi jdialog y ahi puse un contenedor y jtabbedpanes como aplico ahi este JAR?
Gracias!!
Sin respuesta? 🙁
Hola esta super el tutorial me agrada mucho pero disculpa la pregunta, ya me descargue el proyecto y lo agregue en las librerías, pero no se como implementarlo para que mi gui salga con la apariencia de blacktabbedPanne..me ayudas porfavor…
Su uso es como cualquier otra librería :/ en si, que error tienes al usarlo???? 🙂
lo que queremos saber es como usarlo en un proyecto estamos bien noobs XD, estoy aprendiendo a programar, en la paleta de propiedades no sale la opciones de modificacion, como hay que hacer para que aparesca, luego que agregue la libreria? saludos espero puedas ayudarme, megusto mucho el estilo de pesañas en horizontal muchisimas gracias, un video estaria genial, y ver como lo aplicas a un proyecto, o pasar el codigo del proyecto de ejemplo que biene con la libreria. saludos!
en netbeans, en la paleta haces clic derecho y ahi buscas añadir desde jar y sigues los pasos, si todo sale bien aparecerá como otro swing mas
saludos!!! buen tuto me a servido demasiado gracias.
una pregunta ¿ Que libro me recomendarías que venga mas sobre el tema de componentes gráficos en java? que me gustaría darles un toque personal a los programas que creo .
gracias..
SERIA BUENO QUE MUESTRES EN UN VIDEO LOS PASOS DESDE EL CREAR EL .JAR HASTA EL COMO UTILIZARLO ..
amigo me puedes dar un ejemplo de como colocar un icono en un tab la verdad no hayo la forma
Puedes explicar como usar la libreria en un proyecto………………..