DropDownList Color Picker

Quien no ha necesitado alguna vez poder echar mano de algún control para poder mostrar los colores del sistema y que los usuarios puedan personalizar su entorno.


Pues hoy vamos a retocar la presentación de un DropdonwList para mostrar el color de fondo con el color del registro.


Nuestro control se mostrara tal que así:


 



Para realizar esto solo necesitaremos un método.




private void CargarColores( DropDownList ddl )


    {


        int index = -1;


        if (ddl.SelectedIndex > 0)


            index = ddl.SelectedIndex;

 

        //Inicializamos los colores y mostramos el mensaje de seleccionar color.


        ddl.Items.Clear();


        ddl.Items.Add(“Color…”);

 

        foreach (int pos in Enum.GetValues(typeof(System.Drawing.KnownColor)))


        {


            string strnColor = Enum.GetName(typeof(System.Drawing.KnownColor), pos);


            System.Drawing.Color color = System.Drawing.Color.FromName(strnColor);

 

            if (!color.IsSystemColor)


            {


                ListItem item = new ListItem(color.Name, pos.ToString());


                item.Attributes.CssStyle.Add(HtmlTextWriterStyle.BackgroundColor, color.Name);


                ddl.Items.Add(item);


            }


        }

 

        //Si tenia indice lo seleccionamos.


        if (index > 0)


            ddl.SelectedIndex = index;


    }


Para obtener los colores del sistema contamos con la enumeración System.Drawing.KnownColor el cual lo recorreremos para obtener un objeto System.Drawing.Color  y poderlo utilizar para generar los items del Dropdownlist .


foreach (int pos in Enum.GetValues(typeof(System.Drawing.KnownColor)))


Para que solo nos muestre los colores compatibles y no los de los controles del sistema  if (!color.IsSystemColor).


Finalmente crearemos el Item y le añadiremos el estilo adecuado para mostrar el color de fondo.


item.Attributes.CssStyle.Add(HtmlTextWriterStyle.BackgroundColor, color.Name);


Para que podáis jugar un poco con la pruebas he creado un proyecto que podréis descargar.



 


Proyecto:   DropDownList Color Picker


Espero que sea de utilidad.


CrossPosting to http://lonetcamp.com


 

6 comentarios en “DropDownList Color Picker”

  1. Gracias José A. Fernández 😉

    Muy bueno ese control, en este tip no nos costaría mucho extender el control DropDownList y añadirle esta utilidad para reutilizarlo en nuestros proyectos.

    Saludos.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *