Crear Menu Con JRibbon - Flamingo

BLC Crear Men con JRibbon - Leccin 001 | Pgina 1
Crear Men con JRibbon

BLC
INTRODUCCIN

Muchos de nosotros hemos utilizado el Microsoft Office a partir de su versin 2007 y a
veces nos ha entrado el bichito, de cmo podemos darle una apariencia similar a nuestro
programa.
Personalmente en mis inicios lo haca con JTabbedPane para las pestaas, JPanel para
los grupos, y bueno, dentro JButton (botones) y JLabel (etiquetas), an as no dejaba de
ser super dificil el diseo.
Hoy aprenderemos como hacer una cinta de opciones al mejor estilo de Microsoft Office
pero en nuestras aplicaciones Java usando el componente JRibbon.
JRibbon es un componente avanzado de Java, para aplicaciones de escritorio, que se
encuentra en la librera Flamingo, creado por Kirill Grouchnikov.


LO QUE UTILIZAREMOS EN ESTE TUTORIAL
Windows 7 Home Premium de 64 bits.
JDK 7
Netbeans 8.0
Libreras JAR (clic para descargar desde MEGA):
flamingo- 7.2.jar
substance- 7.2.jar
laf- plugin- 7.2.jar
laf- widget- 7.2.jar
trident- 7.2.jar
EMPEZAMOS
Abrimos nuestro IDE Netbeans 8.0, y creamos un proyecto del tipo Aplicacin Java.


Una vez tengamos el proyecto vaco vamos a agregar las libreras necesarias para que
podamos usar las clases que nos proporciona flamingo.
Para ello haremos clic derecho en Libraries y luego seleccionaremos la opcin Add
JAR/Folder.

Buscamos las libreras que hemos descargado y seguidamente hacemos clic en Open.

Seguidamente definimos nuestra estructura de paquetes (esto puede variar dependiendo
de sus gustos) y crear una clase llamada FramePrincipal. java


FramePrincipal. java heredar de JRibbonFrame y le crearemos un constructor por
defecto, tambin le crearemos un mtodo main para que se pueda ejecutar.
// La clase FramePrincipal heredar de JRibbonFrame
public class FramePrincipal extends JRibbonFrame {
// Crearemos un constructor por defecto
public FramePrincipal() {
// Le asignaremos algunas propiedades a nuestra ventana
this.setTitle("Tutorial JRibbon");
this.setDefaultCloseOperation(EXIT_ON_CLOSE);
this.setSize(800, 400);
this.setLocationRelativeTo(null);
// [Siguiendo con el constructor]
}

public static void main(String[] args) {
new FramePrincipal().setVisible(true);
}
}
Corremos nuestro programa y quedar de la siguiente manera:


No es la gran cosa, pero seguiremos avanzando, ahora crearemos algunos JRibbonBand
(Grupo) para posteriormente agregarlos a un JRibbonTask (Pestaa).

// Creamos un grupo que ser para el portapapeles
JRibbonBand rbbPortapapeles = new JRibbonBand("Portapapeles", null);

// Crearemos los botones de comando Pegar, Cortar, Copiar y Pegar Formato
JCommandButton btnPegar = new JCommandButton("Pegar", null);
JCommandButton btnCortar = new JCommandButton("Cortar", null);
JCommandButton btnCopiar = new JCommandButton("Copiar", null);
JCommandButton btnPegarFormato = new JCommandButton("Pegar Formato", null);

// Luego agregaremos cada botn a nuestro JRibbonBand y le asignaremos una
// prioridad con respecto al grupo que puede ser TOP, MEDIUM y LOW
// Al botn PEGAR le asignaremos la prioridad TOP porque queremos que sobresalte
// de los dems botones.
rbbPortapapeles.addCommandButton(btnPegar, RibbonElementPriority.TOP);
// A los dems botones por ser secundarios se asignaremos la prioridad MEDIUM
rbbPortapapeles.addCommandButton(btnCortar, RibbonElementPriority.MEDIUM);
rbbPortapapeles.addCommandButton(btnCopiar, RibbonElementPriority.MEDIUM);
rbbPortapapeles.addCommandButton(btnPegarFormato, RibbonElementPriority.MEDIUM);
// Ahora nos queda asignarle las polticas de cambio de tamao
rbbPortapapeles.setResizePolicies((List) Arrays.asList(
new CoreRibbonResizePolicies.Mirror(rbbPortapapeles.getControlPanel()),
new IconRibbonBandResizePolicy(rbbPortapapeles.getControlPanel())
));
// Posteriormente crearemos un JRibbonTask que ser nuestra pestaa INICIO
RibbonTask rbtInicio = new RibbonTask("Inicio", rbbPortapapeles);
// Y lo agregaremos a la cinta de opciones
this.getRibbon().addTask(rbtInicio);

Hasta ac correremos nuestro programa tendramos la siguiente ventana


Ahora agregaremos una carpeta llamada imgenes a nuestro proyecto el cual contendr
las imgenes para nuestros iconos, si no desean buscar iconos por su cuenta los pueden
descargar desde haciendo clic aqu.

Y modificaremos nuestro cdigo

// Creamos un grupo que ser para el portapapeles
JRibbonBand rbbPortapapeles = new JRibbonBand("Portapapeles", null);

// Agregaremos el siguiente codigo para obtener nuestro icono con 40 de alto por
// 40 de ancho para el boton pegar
ImageWrapperResizableIcon iconPegar = ImageWrapperResizableIcon.getIcon(
getClass().getResource("/pe/blc/tutoriales/flamingo/imagenes/pegar.png"),
new Dimension(40, 40));
JCommandButton btnPegar = new JCommandButton("Pegar", iconPegar);

ImageWrapperResizableIcon iconCortar = ImageWrapperResizableIcon.getIcon(
getClass().getResource("/pe/blc/tutoriales/flamingo/imagenes/cortar.png",
JCommandButton btnCortar = new JCommandButton("Cortar", iconCortar);

ImageWrapperResizableIcon iconCopiar = ImageWrapperResizableIcon.getIcon(
getClass().getResource("/pe/blc/tutoriales/flamingo/imagenes/copiar.png",
JCommandButton btnCopiar = new JCommandButton("Copiar", iconCopiar);

ImageWrapperResizableIcon iconPegarFormato = ImageWrapperResizableIcon.getIcon(
getClass().getResource(
"/pe/blc/tutoriales/flamingo/imagenes/pegar_formato.png",
JCommandButton btnPegarFormato = new JCommandButton("Pegar Formato",
iconPegarFormato);


Ntese que para los botones Cortar, Copiar y Pegar Formato las dimensiones del icono
cambian por 16 por 16 para cuestiones estticas.
Si ejecutamos el programa tendramos algo como esto:

Si hacemos clic en algn botn pues simplemente no har nada entonces agregaremos un
ActionListener al botn pegar:
...
JCommandButton btnPegar = new JCommandButton("Pegar", null);
btnPegar.addActionListener(new ActionListener() {
@Override
public void actionPerformed(ActionEvent e) {
JOptionPane.showMessageDialog(rootPane,
"Hiciste clic en el botn pegar");
}
});
...

Si corremos el programa hasta este punto tendramos lo siguiente:


Ahora para darle un toque especial, modificaremos el mtodo main y agregaremos el
LookAndFeel de Substance para hacerlo ms parecido a Microsoft Office 2007.
...
public static void main(String[] args) {
try {
UIManager.setLookAndFeel(
new SubstanceOfficeBlue2007LookAndFeel());
} catch (Exception e) { }

new FramePrincipal().setVisible(true);
}
...

Y as pueden ir agregando ms botones, ms grupos y pestaas, no se queden solo con
este tutorial, investiguen ms sobre este poderoso componente que nuestro amigo Kirill
ha creado para nosotros, sin ms que decir me despido de ustedes y espero haber ayudado
en su reto de aprender un poco ms cada da. Muchas gracias.

Para descargar el proyecto hacer clic aqu.

Crear Menu Con JRibbon - Flamingo

Cargado por

Copyright:

Formatos disponibles

Crear Menu Con JRibbon - Flamingo

Cargado por

Información del documento

Derechos de autor

Formatos disponibles

Compartir este documento

Compartir o incrustar documentos

Opciones para compartir

¿Le pareció útil este documento?

¿Este contenido es inapropiado?

Copyright:

Formatos disponibles

Crear Menu Con JRibbon - Flamingo

Cargado por

Copyright:

Formatos disponibles

BLC Crear Men con JRibbon - Leccin 001 | Pgina 1

Crear Men con JRibbon

También podría gustarte