Sigueme en Facebook Sigueme en Twitter Sigueme en Instagram Sigueme en Youtube
JC Mouse Bolivia
Index / Java / Formulario de autenticación circular

Formulario de autenticación circular

Autor jc mouse martes, enero 5, 2016

En este tutorial crearemos un formulario de logueo de forma circular usando el lenguaje java y el IDE de Netbeans.

Necesitamos

  • IDE Netbeans 7 o superior
  • Java 7 o superior

Tiempo: 15 Minutos

Paso 1: Crea un nuevo proyecto

Paso 2: Añade al proyecto:

  • Un JFrame que se llamara CircleFrame
  • Una clase llamada CirclePanel

proyecto circular

Paso 3: Abre la clase CirclePanel y pega el siguiente código:

import java.awt.BasicStroke;
import java.awt.Color;
import java.awt.Cursor;
import java.awt.Dimension;
import java.awt.Graphics;
import java.awt.Graphics2D;
import java.awt.Point;
import java.awt.RenderingHints;
import java.awt.event.MouseEvent;
import java.awt.event.MouseListener;
import java.awt.event.MouseMotionListener;
import java.awt.geom.Ellipse2D;
import javax.swing.JFrame;
import javax.swing.JPanel;
/**
* @web https://www.jc-mouse.net/
* @author Mouse
*/
public class CirclePanel extends JPanel implements MouseListener,MouseMotionListener{private final Dimension d = new Dimension(400,400);
private Point initialClick;
private JFrame parent;/**
* Constructor de clase
*/
public CirclePanel(){
super();
CirclePanel.this.setSize(d);
CirclePanel.this.setPreferredSize(d);
CirclePanel.this.setVisible(true);
CirclePanel.this.addMouseListener(CirclePanel.this);
CirclePanel.this.addMouseMotionListener(CirclePanel.this);
}@Override
public void paintComponent(Graphics g){
Graphics2D g2 =(Graphics2D) g;
g2.setRenderingHint(RenderingHints.KEY_ANTIALIASING,RenderingHints.VALUE_ANTIALIAS_ON);

//fondo
g2.setStroke(new BasicStroke( 0f) );
g2.setColor( new Color(228,228,228) );
g2.fill( new Ellipse2D.Double(0, 0 , getWidth(), getHeight() ) );

g2.setColor( new Color(240,240,240) );
g2.fill( new Ellipse2D.Double(10, 10 , getWidth()-20, getHeight()-20 ) );

//borde
g2.setStroke(new BasicStroke( 1f) );
g2.setColor( new Color(174,174,174) );
g2.draw( new Ellipse2D.Double(0, 0 , getWidth()-1, getHeight()-1 ) );
g2.draw( new Ellipse2D.Double(10, 10 , getWidth()-21, getHeight()-21 ) );
}

@Override
public void mouseClicked(MouseEvent e) {}

@Override
public void mousePressed(MouseEvent e) {
setCursor(new Cursor(Cursor.MOVE_CURSOR));
initialClick = e.getPoint();
getComponentAt(initialClick);
}

@Override
public void mouseReleased(MouseEvent e) {
setCursor(new Cursor(Cursor.DEFAULT_CURSOR));
}

@Override
public void mouseEntered(MouseEvent e) {}

@Override
public void mouseExited(MouseEvent e) {}

@Override
public void mouseDragged(MouseEvent e) {
//obtiene posicion de la ventana
int thisX = parent.getLocation().x;
int thisY = parent.getLocation().y;

//determina el desplazamiento
int xMoved = (thisX + e.getX()) – (thisX + initialClick.x);
int yMoved = (thisY + e.getY()) – (thisY + initialClick.y);

//mueve la ventana a su nueva posicion
int X = thisX + xMoved;
int Y = thisY + yMoved;
parent.setLocation(X, Y);
}

@Override
public void mouseMoved(MouseEvent e) {}

public void setParent(JFrame parent) {
this.parent = parent;
}
}//End:class

Paso 4: Clic derecho sobre el proyecto y presiona “Clean and Build” o “Limpiar y Construir”

Paso 5: Abre en modo diseño el JFrame CircleFrame y arrastra hacia el la clase CirclePanel, ya podrás visualizar la forma circular del panel, aún pude verse el fondo del JFrame, eso lo eliminaremos a continuación.

JFrame personalizado

 Paso 6: Abre el JFrame CircleFrame en modo código y reemplaza el constructor de clase con las siguientes lineas

public CircleFrame() {
CircleFrame.this.setUndecorated(true);
initComponents();
CircleFrame.this.setLocationRelativeTo(null);
CircleFrame.this.setBackground(new Color(0,0,0,0));
CircleFrame.this.setVisible(true);
CircleFrame.this.circlePanel1.setParent(CircleFrame.this);
}

Lo que hacemos es quitar los bordes al JFrame con Undecorated, si o si debe declararse antes del initComponents, a continuación centramos en pantalla y asignamos un fondo transparente, finalmente pasamos como parámetro en el CirclePanel al JFrame.

Nuestro JFrame circular ya esta listo, puedes comenzar a insertar los restantes objetos, alinearlos y ejecutar el proyecto

autenticacion

Proyecto JFrame Circular

Descargar

Requiere: Java 7 o superior

Enjoy!

Tags

Si te ha gustado podrías compartirlo o dejar un comentario. ¡Muchas gracias!
Autor: JC Mouse

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! :)

También Te Podría Interesar

Generar reportes con origen de datos JSON

Generar reportes con origen de datos JSON

JSON es un formato de texto ligero para el intercambio de datos ampliamente usado en los Servicios Web. En este post uti...

Crear imagen dinamicamente y agregar a un objeto swing

Crear imagen dinamicamente y agregar a un objeto swing

Si bien se puede hacer uso de archivos de imagen (jpg, png, bmp, etc) en las aplicaciones java, también este te permite...

Compartir imagen desde android – Share Image

Compartir imagen desde android – Share Image

En este post crearemos una aplicación android que nos permitirá compartir una imagen con Facebook, whatsapp, bluetooth,...

Bandera en Alto

Bandera en Alto

EL 6 de agosto de cada año se recuerda una de las fechas más importantes de la historia boliviana, porque el 6 de Agosto...

Espirógrafo online

Espirógrafo online

El espirógrafo es una herramienta para generar diseños geométricos conocidos como hipotrocoides (es la curva plana que d...

Ejemplo Cliente-Servidor en Android

Ejemplo Cliente-Servidor en Android

Continuando con estos post de Cliente/Servidor, en esta oportunidad realizaremos un ejemplo usando un dispositivo móvil...

Comparte lo que sabes

Categorias

Últimas entradas

En un post anterior conocimos una herramienta Open Source con un conjunto de herramientas para el trabajo con imágenes e...

ImageMagick es un software de código abierto multiplataforma que contiene una serie de herramientas para leer, mostrar,...

OCR (Optical Character Recognition) en español, Reconociminto Optico de Caracteres, es el proceso por el cual  se extrae...

La misión espacial de la NASA, el Mars  2020 Rover Mission esta proyectada para lanzarse en julio de 2020 y su llegada s...

Android Bolivia

MAUS