Acerca de Infosama
jueves, 25 de agosto de 2011
Eventos del Ratón. Tutorial
Hola a todos/as!
Traigo conmigo un pequeño vídeo tutorial en el cual muestro como usar los eventos MouseHover, MouseLeave, MouseDown y MouseUp de un botón en una aplicación realizada con Visual Studio 2010.
Imagen del proyecto:
Como podéis observar tenemos tres botones:
Cada botón tiene cuatro eventos:
Lo primero que aconsejo hacer es importar la imágenes que vayáis a usar, en el vídeo tutorial se muestra como importarlos.
Yo he usado tres imágenes para cada botón, las he hecho con PhotoShop, también se explica breve mente en el vídeo.
Estos son los nombre de los recursos que yo he usado, podéis usar 9 imágenes vuestras utilizando los nombres que yo os pongo, o cambiando ese trozo de código por el de vuestra imagen, son 3 para cada botón en total 9 imágenes tenéis que tener:
OJO, en el evento MouseLeave uso la misma imagen que en el estado normal.
Una vez explicado esto comienzo, con la explicación. Abrimos el proyecto, añadimos nuestras 9 imágenes
A los tres Botones le damos la propiedad:
Cargamos los 3 recursos por defecto, osea como serán cuando no suceda nada. elegimos el boton, vamos a propiedades y en la propiedad BackGroundImage, damos a buscar y los seleccionamos de los recursos que hemos importado (las 9 imágenes) o lo importamos en este momento
Una vez dicho esto ya tenemos los controles preparados para recibir código, para no tener que explicar textual mente todo el código os dejo unas capturas del mismo, ya que en el apartado de Vídeo Tutoriales tenéis el vídeo tutorial, un ejemplo ejecutable y el código fuente.
(*) Incluye el código fuente, las imágenes usadas y una aplicación ya generada para ejecutar y probrar, requiere Net FrameWork 4 para funcionar.
Código del botón 1 y FormLoad, form load ocurre cuando se inicia la aplicación.
Código del botón 2:
Código del botón 3:
Gracias por Confiar en Infosama Technology.
Traigo conmigo un pequeño vídeo tutorial en el cual muestro como usar los eventos MouseHover, MouseLeave, MouseDown y MouseUp de un botón en una aplicación realizada con Visual Studio 2010.
Imagen del proyecto:
Como podéis observar tenemos tres botones:
- Rojo - Button1
- Azul - Button2
- Lila - Button3
Cada botón tiene cuatro eventos:
- MouseHover, ocurre al pasar por encima del botón
- MouseLeave, ocurre al salir del botón.
- MouseDown, ocurre cuando hacemos clic
- MouseUp, ocurre cuando dejamos el clic.
Lo primero que aconsejo hacer es importar la imágenes que vayáis a usar, en el vídeo tutorial se muestra como importarlos.
Yo he usado tres imágenes para cada botón, las he hecho con PhotoShop, también se explica breve mente en el vídeo.
Estos son los nombre de los recursos que yo he usado, podéis usar 9 imágenes vuestras utilizando los nombres que yo os pongo, o cambiando ese trozo de código por el de vuestra imagen, son 3 para cada botón en total 9 imágenes tenéis que tener:
- Normal - Botón azul en estado normal
- Over - Botón azul al pasar por encima
- Down - Boton azul con efecto bisel al hacer clic
- Normal_1 - Botón rojo en estado normal
- Over_1 - Botón rojo al pasar por encima
- Down_1 - Boton rojo con efecto bisel al hacer clic
- Normal_2 - Botón Lila en estado normal
- Over_2 - Botón Lila al pasar por encima
- Down_2 - Boton Lila con efecto bisel al hacer clic
OJO, en el evento MouseLeave uso la misma imagen que en el estado normal.
Una vez explicado esto comienzo, con la explicación. Abrimos el proyecto, añadimos nuestras 9 imágenes
A los tres Botones le damos la propiedad:
- FlatStyle en Flat
- FlatAparence / Border Color, le damos el color de borde, 1 rojo, 2 Azul y 3 Lila.
- Size, le cambiamos el tamaño a 100;30.
- BackGroundImageLayout en Strecth
Cargamos los 3 recursos por defecto, osea como serán cuando no suceda nada. elegimos el boton, vamos a propiedades y en la propiedad BackGroundImage, damos a buscar y los seleccionamos de los recursos que hemos importado (las 9 imágenes) o lo importamos en este momento
- Imagen en Button1 = Normal.png
- Imagen enButton2 = Normal_1.png
- Imagen enButton3 = Normal_2.png
Una vez dicho esto ya tenemos los controles preparados para recibir código, para no tener que explicar textual mente todo el código os dejo unas capturas del mismo, ya que en el apartado de Vídeo Tutoriales tenéis el vídeo tutorial, un ejemplo ejecutable y el código fuente.
(*) Incluye el código fuente, las imágenes usadas y una aplicación ya generada para ejecutar y probrar, requiere Net FrameWork 4 para funcionar.
Código fuente.
Hecho en Visual Studio 2010, pero es compatible con otras versiones.
Código del botón 1 y FormLoad, form load ocurre cuando se inicia la aplicación.
Código del botón 2:
Código del botón 3:
Gracias por Confiar en Infosama Technology.
Suscribirse a:
Enviar comentarios (Atom)
0 comentarios:
Publicar un comentario