Hola, hoy en el trabajo a mi amigo Manuel Ruh (el buen Rugue 😊) y a mí se nos presentó un problema con la estructura de una vista en Xamarin. Los pongo en contexto:
La aplicación tiene una vista en donde tiene un ScrollView como uno de los contenedores principales, el cual tiene una animación al hacer scroll o deslizar hacia arriba. Entonces, es necesario tener el ScrollView como un contenedor principal.
Dentro de este ScrollView tenemos varios controles, como contenedores, botones, labels, etc. Pero adicionalmente era necesario agregar un ListView, entonces nació el problema!
Por definición general no se puede o no es recomendable poner un ListView dentro de un ScrollView debido a que el control ListView tiene su propio ScrollView por defecto, esto no arroja ningún error de compilación, ni una excepción. Xamarin a manera de que no haya problemas al momento de hacer scroll en dos controles similares lo que hace es darle por defecto la altura máxima al ListView y esto hace que el ListView a pesar de tener dos elementos en la lista se vea demasiado grande ocupando mucho espacio en la pantalla del dispositivo.
Algo parecido a esta vista:
Esta no es la vista que usamos, pero teníamos ese mismo problema.
San Google lo hizo de nuevo!
La primera idea que se nos vino a la cabeza es crear un CustomRenderer en el cual podamos deshabilitar el scroll del ListView, tal vez eso podía solucionar el problema, pero no funcionó xdxd 😅😅
Luego nos pusimos a ver algo en Google de como podríamos deshabilitar el scroll y discutíamos sobre que Xamarin.Forms debería tener la forma de deshabilitar esta propiedad habiendo tanta gente que necesita este feature.
Afortunadamente, nos topamos con un pedido de algo similar a lo que nosotros necesitábamos, este pedido lo hizo *Jeremy Wesley*, curiosamente en el 2016 😱😱 y SORPRESIVAMENTE tenía una respuesta que se había hecho en Setiembre de este año, ESTE AÑO (2018)!!
Básicamente, la respuesta era que ya habían agregado esta característica en la versión 3.1.0 de Xamarin.Forms pero al control ScrollView.
Peeero le dejo una recomendación de usar un control llamado **RepeaterView** y dejó el enlace de la issue registrada en Github, la cual fue solucionada en un excelente Pull Request 😍😍😍
Te lo dejo aquí:
Bindable layouts
Encontrando la solución
Habíamos visto que el Pull Request se había integrado a la rama principal y la primera opción era actualizar Xamarin.Forms pero vimos que aún no había sido agregado al paquete publicado en nuget entonces quedó descartada esa opción.
Pero gracias a ese Pull Request nos dio la idea básica de crear un control personalizado que tenga las propiedades de ItemsSource e ItemTemplate.
El control personalizado a manera general extiende de StackLayout y tiene dos BindableProperties.
Estas dos BindableProperties son las mismas que tiene un ListView, esto hace pueda recibir una lista de objetos y poder renderizarlas conforme a lo que declaras en el ItemTemplate.
Desde XAML podemos llamarlo como si fuese un ListView pero con todas las propiedades de un StackLayout, cual es la ventaja de eso? Que puedes crear un ListView con scroll horizontal solo cambiando la propiedad Orientation.
Finalmente, en el dispositivo se ve así:
Conclusión:
Bueno, lo que vimos hoy fue un problema que sin saberlo le pasaba a varios y que venía siendo pedido como característica desde el año 2016. Que en sí era poner un ListView dentro de un ScrollView con la posibilidad de deshabilitar la función de Scroll. Vimos que esta será una característica que se agregará en la próxima versión de Xamarin.Forms (3.4), solo para terminar quiero hacer énfasis en lo bueno que es hacer contribuciones de código abierto, esto ayuda a que la plataforma se haga mas robusta y que muchos desarrolladores puedan usar las nuevas características.
Aquí tienes el repositorio oficial de Xamarin.Forms, puedes ver que es de código abierto, es decir, puedes ver, aprender y modificar el código tú mismo.
Nos leemos pronto 😉😉