AutoComplete TextBox en WPF

Hace algunos días, durante el desarrollo de un proyecto, me di cuenta que este es un control que debería sin duda, estar entre los controles de WPF, sin embargo, otra es la realidad.

Así que, en este post, crearemos un Autocomplete TextBox de una manera muy pero muy sencilla, de hecho, será un ComboBox el que utilizaremos para este fin:

1.- En primer lugar, he creado un ComboBox, al cual le he agregado algunos elementos del tipo TextBlock:

image

Con esto tendremos un ComboBox común y corriente:

image

2.- Lo único que debemos hacer, es cambiar 2 propiedades del ComboBox, a verdaderas, las cuales son “IsEditable” y “StaysOpenOnEdit”

image

image

3.- Ponerle un nombre al ComboBox  (En mi caso le he puesto miComboBox), y posteriormente agregar un evento del tipo GotFocus, con el siguiente código:

   1: private void miComboBox_GotFocus(object sender, System.Windows.RoutedEventArgs e)

   2: {

   3:     miComboBox.IsDropDownOpen = true;

   4: }

Esto nos servirá, para que la lista sea abierta cada vez que entremos en el ComboBox.

4.- Editar la copia del ComboBox

image

y eliminar el elemento ToggleButton:

image

image

5.- Todo listo, a probarlo!!!!

image

Wow, funciona de maravilla😀

En el siguiente post, mostraré cómo usarlo de una manera más práctica😉, hasta entonces, nos vemos.

Salu2

Héctor Uriel Pérez Rojas

7 comentarios sobre “AutoComplete TextBox en WPF

  1. Hey viejo como vamos,

    Qué bueno tu post, pero tengo un pequeño problema… necesito hacer justamente esto del auotcomplete pero no dispongo de Blend para hacerlo, sino de Visual 2008, así que desde la parte de “4.- Editar la copia del ComboBox” quedé completamente perdido porque no tengo idea de cómo hacerlo en el VS. Alguna idea o ayuda?

    Salu2 desde Colombia!!!

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s