10 de mayo de 2008

Crear Boton Personalizado (Parte 3 y Ultima)

Primera Parte
Segunda Parte
Bueno despues de varios dias mas o menos un semana disculpen que esta muy ocupado en mi trabajo ya le dire a mis amigos a ver si me ayudan a subir temas de programacion de los cuales ellos quieran hablar de ello y asi pues siempre tengamos algo nuevo

Ahora les traigo la ultima parte de como crear nuestro boton personalisado en esta tercera y ultima parte crearemos cuatro propiedades de tipo "image" a nuestro control y una que sera la etiqueta inteligente que se mostrara al selecionar el control y este sera el siguiente codigo para poder crear nuestro boton

como podemos notar las propiedades creadas son las siguiente
  • EtiquetaBoton--->propiedad para poner etiqueta etiligente
  • imgPrecionado-->propiedad image para mostrar al precionar el boton
  • imgencima------>propiedad image al selecionar el boton
  • imgnormal------>propiedad image en estado normal
  • imgDiseable---->propiedad image cuando el boton esta desahabilitado
Bueno como veran antes de cada propiedad creada se tiene dos lineas de codigo que son las siguientes:

[Category("Mis Propiedades")]
[Description("Etiqueta Inteligente a mostrar al Pasar el Mouse en el control")]

estas lineas se las pondremos ya que nos servira cuando nosotros incluyamos nuestro boton en donde lo querramos utilizar y nos mostrara la propiedad y la descripcion de esa propiedad y para que sirve, para entender esta parte le mostrare una imagen de donde sirve o donde se ve la utilidad de estas dos lineas de codigo:

image
como ven la primera linea nos crea una nueva categoria en las propiedades de nuestro control personalizado y la sugunda linea nos muestra o nos sirver para poner uan descripcion de nuestra propiedad creada

using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace MiBotonCambiante
{
public partial class BotonCambiante : Control
{
private Image press; //Imagen a mostrar cuando se ha precionado nuestro control
private Image over; //Imagen a mostrar cuando el puntero del mouse esta encima del control
private Image normal; //Imagen a mostrar cuando nuestro control esta en estado normal
private Image Desabilitado; //Imagen a mostrar cuando nuestro control esta deshabilitado
private ToolTip etiquetaInteligente=new ToolTip(); //Etiqueta a mostrar cuando esta selecionado el control
private string etiqueta="Etiqueta del boton";
#region agregar cuatro propiedades de tipo imagen a control

[Category("Mis Propiedades")]
[Description("Etiqueta Inteligente a mostrar al Pasar el Mouse en el control")]
public String EtiquetaBoton
{
get { return etiqueta; }
set { etiqueta = value; }
}
[Category("Mis Propiedades")]
[Description("Imagen A mostrar al Precionar el control")]
public Image imgPrecionado
{
get{return press;}
set{press = value;}
}
[Category("Mis Propiedades")]
[Description("Imagen cuando el mouse esta en el area del control")]
public Image imgencima
{
get{return over;}
set{over = value;}
}
[Category("Mis Propiedades")]
[Description("Imagen cuando el control estado en un estado normal")]
public Image imgnormal
{
get{return normal;}
set{normal = value;}
}
[Category("Mis Propiedades")]
[Description("Imagen a mostrar cuando el control esta desahabilitado")]
public Image imgDisable
{
get{return Desabilitado;}
set{Desabilitado = value;}
}
#endregion
public BotonCambiante()
{
InitializeComponent();
}

protected override void OnPaint(PaintEventArgs pe)
{
base.OnPaint(pe);
}
}
}



una ves creado nuestras propiedades de nuestro boton ahora sobreescribiremos los metodos el cual tendra nuestro control recordemos que nuestro control personalizado hereda las propiedades y todos los metodos del control "Button" asi que ahora lo que procederemos hacer es que nuestro boton funcione o que cambie las imagenes cuando se produsca cada evento
asi quedara cuando le modifiquemos o sobrescribamos los metodos y con esta parte terminaremos nuestro control les pondre el archivo de ejemplo para que ustedes puedan descargarlo y que vean todo lo que contiene


using System;
using System.Collections.Generic;
using System.ComponentModel;
using System.Data;
using System.Drawing;
using System.Linq;
using System.Text;
using System.Windows.Forms;

namespace MiBotonCambiante
{
public partial class BotonCambiante : Control
{
private Image press; //Imagen a mostrar cuando se ha precionado nuestro control
private Image over; //Imagen a mostrar cuando el puntero del mouse esta encima del control
private Image normal; //Imagen a mostrar cuando nuestro control esta en estado normal
private Image Desabilitado; //Imagen a mostrar cuando nuestro control esta deshabilitado
private ToolTip etiquetaInteligente=new ToolTip(); //Etiqueta a mostrar cuando esta selecionado el control
private string etiqueta="Etiqueta del boton";
#region agregar cuatro propiedades de tipo imagen a control

[Category("Mis Propiedades")]
[Description("Etiqueta Inteligente a mostrar al Pasar el Mouse en el control")]
public String EtiquetaBoton
{
get { return etiqueta; }
set { etiqueta = value; }
}
[Category("Mis Propiedades")]
[Description("Imagen A mostrar al Precionar el control")]
public Image imgPrecionado
{
get{return press;}
set{press = value;}
}
[Category("Mis Propiedades")]
[Description("Imagen cuando el mouse esta en el area del control")]
public Image imgencima
{
get{return over;}
set{over = value;}
}
[Category("Mis Propiedades")]
[Description("Imagen cuando el control estado en un estado normal")]
public Image imgnormal
{
get{return normal;}
set{normal = value;}
}
[Category("Mis Propiedades")]
[Description("Imagen a mostrar cuando el control esta desahabilitado")]
public Image imgDisable
{
get{return Desabilitado;}
set{Desabilitado = value;}
}
#endregion
public BotonCambiante()
{
InitializeComponent();
}

protected override void OnPaint(PaintEventArgs pe)
{
base.OnPaint(pe);
}
public override Image BackgroundImage
{
get
{
return base.BackgroundImage;
}
set
{
base.BackgroundImage = value;
}
}    
protected override void OnClick(EventArgs e)
{
//sobreescribir el metodo
//para que cuando se de clik
//sobre el control cambie de imagen
base.Image = imgPrecionado;
base.OnClick(e);
}    
protected override void OnMouseHover(EventArgs e)
{

//sobreescribir el metodo
//para que cuando el puntero del
//mouse pase sobre el control
//la imagen cambie y tambien
//se muestre nuestra propiedad
//creada de etiqueta inteligente
base.Image = imgencima;
etiquetaInteligente.SetToolTip(this, EtiquetaBoton);
base.OnMouseHover(e);
}
protected override void OnMouseLeave(EventArgs e)
{
/*sobrescribimos el metodo cuando
* el puntero del mouse deja el
* control y nuestro control
* regresa a tener la imagen que
* tendra en estado normal
*/
base.Image = imgnormal;
base.OnMouseLeave(e);
}
protected override void OnMouseDown(MouseEventArgs mevent)
{
base.Image = imgPrecionado;
base.OnMouseDown(mevent);
}
protected override void OnCreateControl()
{
//esta se ha modificado por
//conveniencia y para especificar
//algunas caracteristicas por default
//que tendra el control
base.OnCreateControl();
base.Image = imgnormal;
base.FlatStyle = FlatStyle.Flat;
base.FlatAppearance.MouseDownBackColor = Color.Transparent;
base.FlatAppearance.MouseOverBackColor = Color.Transparent;
base.FlatAppearance.BorderSize = 0;
//base.Text = "NombreBoton";
base.TextAlign = ContentAlignment.BottomCenter;
base.ImageAlign = ContentAlignment.TopCenter;
//base.Height = 40;
//base.Width = 40;
}
protected override void OnEnabledChanged(EventArgs e)
{
/*sobrescribimos el metodo
* cuando nuestro control
* esta en estado desactivado
* es decir cuando la propiedad
* enable=false y cambie de imagen
* a mostrar y cuando la propiedad
* en cuestion se true la imagen
* a mostrar se la del estado normal
*/
base.OnEnabledChanged(e);
if (base.Enabled)
base.Image = imgnormal;
else
base.Image = imgDisable;

}
}
}


Descargar archivo ENLACE CORREGIDO SALUDOS 17/01/2013

15 comentarios:

Anónimo dijo...

oye man esta muy cool y todo el rollo
nose si me puedas ayudar ocupo crear un boton pero que se le pueda agregar texto
te dejo mi correo es sicum@hot...

JONYLBCD dijo...

Claro solo dime como o donde quieres que tenga el texto

Userscode dijo...

excelente me sirvió para mi proyecto

JONYLBCD dijo...

QUE BUENO que les alla sido de utilidad este ejemplo muy pronto estare metiendole con todo a mi blog espero que sigan visitan para ver que hay de nuevo

Unknown dijo...

Hola que tal es muy bueno tu blog no se si podrías pasar el código por que cuando uso base.Image me aparece error y me gustaría revisar el designer me harías un gran favor mi correo es pcastrocazares@gmail.com gracias.

JONYLBCD dijo...

@pablo ya he corregido el enlace checalo y dime si te fue de ayuda solo que te sugiero que cheques tus espacios de nombre y si tienes los correctos (using)y que tu clase herede de Button(public partial class botoncambiante : Button) saludos

Unknown dijo...

Muchas gracias me sirvió mucho.

Anónimo dijo...

Buenísimo. Muchas gracias por el post.

Lo de menos es como hacerte un botón, me has abierto el mundo a la personalización de controles

Muchas gracias de nuevo :D

Anónimo dijo...

Muchas gracias por el post, al igual solicitando de tu ayuda, actualmente estoy desarrollando un aplicacion y necesito que mis botones mustren una etiqueta, indicando para que son los botones sin embargo vieno tu codigo no entiendo como asocialr las propiedades a mis boton es, te agradecere la ayuda brindada al igaul de se posible proporcionarme el proyecto completo. mi correo es tmarco19@hotmail.com

JONYLBCD dijo...

Pues expongan su duda especifica y yo veo como les ayudo les doy gracias por visitar la web y aqui estoy para servirles

Anónimo dijo...

hola que tal crees que puedas volver a subir el archivo porque ya no se puede descargar gracias.

JONYLBCD dijo...

ok te mandare el archivo .cs ahora corrijo el enlace

Anónimo dijo...

Un tutorial unico muchas Gracias por el aporte hermano

Anónimo dijo...

Hola que tal!
agradezco mucho tus explicaciones, pero podrias explicarme como implemento el control creado al proyecto? no hallo la forma, ademas cuando compilo la solucion me sale error en los eventos OnmouseHover y OnMouseLeave, y dicen: "no se encontró ningun miembro adecuado que invalidadr"
gracias de antemano

JONYLBCD dijo...

ANONIMO te podria ayudar pero necesito que me contactes con mi cuenta de gmail o con la de jonylbcd@hotmail.com

Social Icons