[Tips and Tricks] Windows Phone 8. LongListSelector SelectedItem no bindable.

Introducción

Si en Windows Phone entramos al Hub People podemos ver que para acceder a un contacto de nuestro listado disponemos aparte de hacer scroll como en una lista común, de una serie de cuadrados con la letra inicial de los nombres que vienen a continuación.

Si pulsamos en uno de esos cuadrados aparece un listado con todas las letras del abecedario. Si seleccionamos uno de esos cuadrados nos posiciona en la sección que comienza por la letra que hemos pulsado.

Es ideal para interfaces que van a mostrar una gran colección de elementos. Facilitamos al usuario el acceso directo a la zona que desea.

Para quienes hayan probado el Toolkit de Windows Phone, el control LongListSelector les será un viejo conocido. Efectivamente el control estaba previamente incorporado dentro del conjunto del controles del Toolkit. Ahora, en Windows Phone 8, lo tenemos incluido dentro del propio SDK.

El problema

El control arrastra un pequeño problema que ya estaba presente en su versión del Windows Phone Toolkit. No cuenta con un objeto de tipo DependencyObject para la propiedad SelectedItem.

¿Cómo nos afecta?

La propiedad SelectedItem nos indica el elemento seleccionado. Es sin duda una de las propiedades más importantes del control. Sin embargo, no podemos hacer Binding con dicha propiedad. Nos rompe una correcta implementación del patrón MVVM por ejemplo.

La solución

¿Tiene solución el problema?. Por supuesto. Ya hemos mencionado que el control no cuenta con un objeto de tipo DependencyObject para la propiedad SelectedItem. Vamos a crear una clase que deriva del control LongListSelector incluido dentro del namespace Microsoft.Phone.Controls. Creamos una propiedad de dependencia (DependencyProperty) junto a un método para controlar los cambios de selección en el control. Y lo más importante creamos una nueva propiedad SelectedItem que reemplazará la propiedad que utilizamos del control:

public class LongListSelector : Microsoft.Phone.Controls.LongListSelector
    {
        public LongListSelector()
        {
            SelectionChanged += LongListSelector_SelectionChanged;
        }

        void LongListSelector_SelectionChanged(object sender, SelectionChangedEventArgs e)
        {
            SelectedItem = base.SelectedItem;
        }

        public static readonly DependencyProperty SelectedItemProperty =
            DependencyProperty.Register(
                "SelectedItem",
                typeof(object),
                typeof(LongListSelector),
                new PropertyMetadata(null, OnSelectedItemChanged)
            );

        private static void OnSelectedItemChanged(DependencyObject d, DependencyPropertyChangedEventArgs e)
        {
            var selector = (LongListSelector)d;
            selector.SelectedItem = e.NewValue;
        }

        public new object SelectedItem
        {
            get { return GetValue(SelectedItemProperty); }
            set { SetValue(SelectedItemProperty, value); }
        }
    }

Más información

• MSDN: LongListSelector control design guidelines for Windows Phone