[UWP & Telerik -How To] Utilizar controles de Entrada

julio 28, 2016 Christian Amado 0 Comentarios

Existen varios controles para ingreso de datos en el mundo Telerik. Mostraré unos cuantos aquí para tenerlos a mano si es que los lectores lo necesitan. Básicamente, la mayoría de los controles son extensiones de los existentes donde se busca mejorar la interfaz y funcionalidades.

En esta entrada trataremos sobre los controles DatePicker, TimePicker, NumericBox, AutoCompleteBox y Rating.

DatePicker

Este control permite únicamente seleccionar la fecha. Lo único que cambia es el diseño, que depende de la plataforma que estamos utilizando. Como cualquier control tercerizado debemos agregar las referencias pertinentes, en este caso:
  • Telerik.Core.dll
  • Telerik.UI.Xaml.Input.dll
  • Telerik.UI.Xaml.Primitives.dll
Para instanciarlo tenemos estas dos opciones: C#
var selectorFecha = new RadDatePicker();
XAML
<telerik:RadDatePicker />

TimePicker

Este control permite únicamente seleccionar una hora determinada. Lo único que cambia es el diseño, que depende de la plataforma que estamos utilizando. Como cualquier control tercerizado debemos agregar las referencias pertinentes, en este caso:
  • Telerik.Core.dll
  • Telerik.UI.Xaml.Input.dll
  • Telerik.UI.Xaml.Primitives.dll
Para instanciarlo tenemos estas dos opciones: C#
var selectorHora = new RadTimePicker();
XAML
<telerik:RadTimePicker />

NumericBox

Este control permite ingresar valores numéricos. Lo único que cambia es el diseño, que depende de la plataforma que estamos utilizando. Como cualquier control tercerizado debemos agregar las referencias pertinentes, en este caso:
  • Telerik.Core.dll
  • Telerik.UI.Xaml.Input.dll
  • Telerik.UI.Xaml.Primitives.dll
Para instanciarlo tenemos estas dos opciones: C#
var datoNumerico = new RadNumericBox();
XAML
<telerik:RadNumericBox />

AutoCompleteBox

Este control permite autocompletar el cuadro de texto con opciones definidas previamente. Lo único que cambia es el diseño, que depende de la plataforma que estamos utilizando. Como cualquier control tercerizado debemos agregar las referencias pertinentes, en este caso:
  • Telerik.Core.dll
  • Telerik.UI.Xaml.Input.dll
  • Telerik.UI.Xaml.Primitives.dll
En este caso, mediante C# vamos a crear la lista de elementos que nos servirán para realizar el autocompletado del control a medida que vamos escribiendo caracteres que coinciden con dichos elementos. Primero, debemos agregar la referencia a la librería necesaria:
xmlns:input="using:Telerik.UI.Xaml.Controls.Input"
Ahora, debemos agregar el control AutoCompleteBox a nuestro XAML:
<input:RadAutoCompleteBox x:Name="radAutoCompleteBox1" />
Mediante código C# ingresamos los elementos:
var sugerencias= new List();
for (int i = 0; i < 50; i++)
{
    sugerencias.Add("Elemento " + i);
}

this.radAutoCompleteBox1.ItemsSource = sugerencias;
Para ver si funciona, ejecutamos la aplicación y escribimos "el". En ese momento aparecerán los 49 elementos del 0 al 49.

Rating

Este control permite evaluar alguna opción definida por la aplicación. Lo único que cambia es el diseño, que depende de la plataforma que estamos utilizando. Como cualquier control tercerizado debemos agregar las referencias pertinentes, en este caso:
  • Telerik.Core.dll
  • Telerik.UI.Xaml.Input.dll
  • Telerik.UI.Xaml.Primitives.dll
Para instanciarlo tenemos estas dos opciones: C#
var votacion = new RadRating();
XAML
<input:RadRating AutoGeneratedItemsCount="5" />
Espero que este pequeño tutorial haya resultado útil. Esta entrada está basada en la descripción del producto.