Saltar al contenido
Menú
El blog de Kañaz
  • Inicio
  • Acerca de
  • Github
  • Youtube
  • LinkedIn
  • Twitter
El blog de Kañaz

Manejo de fechas con DataBinding y StringFormat en XAML

Publicada el 18 junio, 201220 junio, 2012
Twittear

La indiscutible ventaja que el enlazado de datos (data binding) nos presenta en XAML es inobjetable. No cuestiono que esta sea la mejor característica que este lenguaje nos da, pero por razones quizá de falta de práctica o de costumbre, la utilizamos muy poco, tanto que en muchas ocasiones preferimos hacerlo por medio del code behind en lugar de utilizar esta opción.

En este artículo pretendo únicamente dar una de las muchas formas que podemos utilizar y aprovechar el enlazado de datos. En este caso lo usaremos para convertir una fecha en diferentes formatos sin tener que escribir una sola línea en el code behind.

Para ello, crea en una nueva solución y coloca un DatePicker en un lado de tu aplicación y una caja de texto a un lado suyo.

InterfazCalendario

Ahora, por el XAML, vas a verlo de la siguiente forma.

<Grid Margin="0" Background="White">
        <sdk:DatePicker x:Name="calendario" Height="26" Margin="8,8,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="178"/>
        <TextBlock Height="17" Margin="204,12,0,0" TextWrapping="Wrap" Text="Fecha elegida:" VerticalAlignment="Top" HorizontalAlignment="Left" Width="90"/>
        <TextBox x:Name="fechaElegida" Height="25" Margin="0,8,8,0" TextWrapping="Wrap" VerticalAlignment="Top" HorizontalAlignment="Right" Width="286" Text="{Binding Path=SelectedDate, ElementName=calendario}" />
    </Grid>

<Grid Margin="0" Background="White"> <sdk:DatePicker x:Name="calendario" Height="26" Margin="8,8,0,0" VerticalAlignment="Top" HorizontalAlignment="Left" Width="178"/> <TextBlock Height="17" Margin="204,12,0,0" TextWrapping="Wrap" Text="Fecha elegida:" VerticalAlignment="Top" HorizontalAlignment="Left" Width="90"/> <TextBox x:Name="fechaElegida" Height="25" Margin="0,8,8,0" TextWrapping="Wrap" VerticalAlignment="Top" HorizontalAlignment="Right" Width="286" Text="{Binding Path=SelectedDate, ElementName=calendario}" /> </Grid>

Como puedes ver, la propiedad Text de tu caja de texto esta enlazada a la propiedad SelectedDate de tu control de nombre calendario. El resultado, si ejecutas tu aplicación es el siguiente al haber elegido una fecha en tu calendario. ResultadoCalendario Dentro de la sentencia que enlaza los datos en tu propiedad Text, puedes escribir el siguiente complemento.

Text="{Binding SelectedDate, ElementName=calendario, StringFormat=\{0:d\}}"

Text="{Binding SelectedDate, ElementName=calendario, StringFormat=\{0:d\}}"

El resultado de esta sentencia es el siguiente.

SegundoResultado

¿Notas las diferencia? No debiste mas que darle formato a tu enlazado de datos para que pudieras colodar la fecha con el orden que tu quieras. Pero hay muchas formas mas, para ser franco no se si sean todas pero te presento las que conozco para que las puedas utilizar. La de abajo es una aplicación Silverlight, que puedes usar al gusto que tu quieras. Espero que te sirva.

Install Microsoft Silverlight

Puedes descargar el código fuente de este simulador aquí.

Deja una respuesta Cancelar la respuesta

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

Busca en este sitio

MI perfil de Github

Github profile

Sígueme en Twitter

Seguir a @aminespinoza
©2023 El blog de Kañaz | Funciona con SuperbThemes y WordPress