Buenas Taringueros. En Este, mi primer Post Les Traigo Un Pequeño Tutorial De Como Hacer Unos Botones Redondeado, Dinámicos y bastante llamativos en NetBeans con la ayuda de photo shop.
El resultado sera algo como esto:
Comencemos...
PASO 1
lo primero sera hacer los botones para ello abrimos el Ps y creamos un documento de 150x150
colocamos unas guías con la ayuda del mouse para que quede de esta manera:
--- al final del post dejare el link de las imágenes utilizadas en este tutorial ---
PASO 2
buscamos la imagen "fondo" para ello archivo/colocar/... seleccionamos la imagen ....y le damos en aplicar
presionamos Ctrl+G para crear un grupo
PASO 3
desde los iconos de abajo creamos una capa de tono/saturacion...
colocamos una luminosidad de -100
ocultamos esta capa. La utilizaremos mas adelante
quedara de la siguiente manera
repetimos el procedimiento del PASO 2 pero esta ves con la imagen "circulo" quedara de la siguente manera
PASO 4
seleccionamos la capa "fondo"
y hacemos el mismo procedimiento del PASO 2 pero con la imagen "icono1"
PASO 5
lo siguiente sera crear una nueva capa y presionar Ctrl+Alt+Shif+E esto creara una nueva imagen combinando las anteriores, ocultamos la "capa 1" que acabamos de crear (debe estar fuera del grupo)
PASO 6
habilitamos la capa de tono/saturacion que creamos en el PASO 3 y repetimos el procedimiento del PASO 5 el resultado sera esto:
presionamos Ctrl+J para duplicar la imagen, luego presionamos Ctrl+T para transformación libre.
Presionando Alt+Shif vamos hacer la imagen mas pequeña con la ayuda del botón izquierdo del mouse.
Ocultamos la "capa 1", "capa 2" el "Grupo 1" y procedemos a guardar la imagen en formato .png
ocultamos la "capa 2 copia" repetimos el procedimiento con la capa 1 y la capa 2
Con esto terminamos la parte del Ps ahora vamos con NetBeans 7.4
-------------------------------------------------------------------------------------------------------------------------
Abrimos el programa y creamos un nuevo proyecto en java "New Project" le pueden colocar el nombre de su preferencia
creamos un nuevo formulario para ello "New JFrameForm"
colocamos un botón
nos vamos a propiedades
border = (no border)
borderPainted = deshabilitado
contentAreaFiled = deshabilitado
cursor = cursor de mano
horizontalTextPosition = CENTER
iconTextGap = -4
verticalAlingnment = BOTTOM
verticalTextPosition = BOTTOM
luego simplemente duplicamos este boton
------------------------------------------------------------
Ahora procedemos a cargar las imágenes que creamos anteriormente con la ayuda del Ps
copiamos las imagenes y las pegamos en nuestro nuevo proyecto
nos vamos a propiedades del botón
en icon seleccionamos la imagen que se mostrara al ejecutar el programa
PressedIcon seleccionamos la imagen que se mostrara cuando el boton este presionado
rolloverIcon colocamos la imagen que se mostrara al pasar el mouse sobre él.
Link de los materiales utilizados en este tutotial:
El resultado sera algo como esto:
Comencemos...
PASO 1
lo primero sera hacer los botones para ello abrimos el Ps y creamos un documento de 150x150
colocamos unas guías con la ayuda del mouse para que quede de esta manera:
--- al final del post dejare el link de las imágenes utilizadas en este tutorial ---
PASO 2
buscamos la imagen "fondo" para ello archivo/colocar/... seleccionamos la imagen ....y le damos en aplicar
presionamos Ctrl+G para crear un grupo
PASO 3
desde los iconos de abajo creamos una capa de tono/saturacion...
colocamos una luminosidad de -100
ocultamos esta capa. La utilizaremos mas adelante
quedara de la siguiente manera
repetimos el procedimiento del PASO 2 pero esta ves con la imagen "circulo" quedara de la siguente manera
PASO 4
seleccionamos la capa "fondo"
y hacemos el mismo procedimiento del PASO 2 pero con la imagen "icono1"
PASO 5
lo siguiente sera crear una nueva capa y presionar Ctrl+Alt+Shif+E esto creara una nueva imagen combinando las anteriores, ocultamos la "capa 1" que acabamos de crear (debe estar fuera del grupo)
PASO 6
habilitamos la capa de tono/saturacion que creamos en el PASO 3 y repetimos el procedimiento del PASO 5 el resultado sera esto:
presionamos Ctrl+J para duplicar la imagen, luego presionamos Ctrl+T para transformación libre.
Presionando Alt+Shif vamos hacer la imagen mas pequeña con la ayuda del botón izquierdo del mouse.
Ocultamos la "capa 1", "capa 2" el "Grupo 1" y procedemos a guardar la imagen en formato .png
ocultamos la "capa 2 copia" repetimos el procedimiento con la capa 1 y la capa 2
Con esto terminamos la parte del Ps ahora vamos con NetBeans 7.4
-------------------------------------------------------------------------------------------------------------------------
Abrimos el programa y creamos un nuevo proyecto en java "New Project" le pueden colocar el nombre de su preferencia
creamos un nuevo formulario para ello "New JFrameForm"
colocamos un botón
nos vamos a propiedades
border = (no border)
borderPainted = deshabilitado
contentAreaFiled = deshabilitado
cursor = cursor de mano
horizontalTextPosition = CENTER
iconTextGap = -4
verticalAlingnment = BOTTOM
verticalTextPosition = BOTTOM
luego simplemente duplicamos este boton
------------------------------------------------------------
Ahora procedemos a cargar las imágenes que creamos anteriormente con la ayuda del Ps
copiamos las imagenes y las pegamos en nuestro nuevo proyecto
nos vamos a propiedades del botón
en icon seleccionamos la imagen que se mostrara al ejecutar el programa
PressedIcon seleccionamos la imagen que se mostrara cuando el boton este presionado
rolloverIcon colocamos la imagen que se mostrara al pasar el mouse sobre él.
Link de los materiales utilizados en este tutotial: