Comunidad de diseño web y desarrollo en internet online

Cargar datos a aplicaciones en Windows Phone 7

Esta es la primera entrega del tutorial sobre como consumir datos en Windows Phone 7. En este tutorial aprenderemos a usar:

  • Web Services
  • Rest
  • OData

Recomendamos que leas el Tutorial de desarrollo de aplicaciones para Windows Phone 7 antes de empezar.


En Windows Phone 7 no existe una base de datos como en compact framework, existen algunas no oficiales como Sterling aunque al final lo que utilizan por debajo es IsolatedStorage. No se si Microsoft en futuras versiones nos ofrecerá esta posibilidad pero en mi opinión no creo que sea una característica por la que debemos rasgarnos las vestiduras aunque necesaria si Microsoft quiere que Windows Phone tenga éxito en el ámbito empresarial, aunque ahora mismola única manera de obtener datos y manejarlos es a través de servicios. En este articulo vamos a ver varios tipos de acceso a datos.

El primer tipo que voy a explicar es como acceder a través de un servicio SOAP, para ello vamos a utilizar el servicio Translator de Bing con lo que creamos nuestro proyecto para WindowsPhone y como siempre utilizando MVVM


Para utilizar la API de Bing debemos de hacer referencia la servicio http://api.microsofttranslator.com/V2/Soap.svc, para ello en “References” pulsamos botón derecho del ratón y en el menu "Add service reference", añadimos la url anterior.

Nos va a generar la referencia al servicio web de Bing


Vamos a crear un modelo con las propiedades Code y Name de los lenguajes

Código :

namespace BingTranslatorMVVM.Model
{
public class Language
{
public string Code { get; set; }
public string Name { get; set; } 
}
}

Ahora en nuestra ViewModel vamos a utilizar el servicio web que hemos referenciado de Bing para ello añadimos el using

Código :

using BingTranslatorMVVM.BingTranslatorService;

Creamos la instancia de la clase LanguageServiceClient que expone el servicio web y llamamos al método para traernos los lenguajes, debemos recordar que al igual que en Silverlight las llamadas a los servicios web son asíncronas. El código para realizar las llamadas para recoger los lenguajes sería

Código :

private void GetLanguages()
{
LanguageServiceClient proxy = new LanguageServiceClient();
proxy.GetLanguagesForTranslateAsync(APPID);
proxy.GetLanguagesForTranslateCompleted += new System.EventHandler<GetLanguagesForTranslateCompletedEventArgs>(proxy_GetLanguagesForTranslateCompleted);
}

void proxy_GetLanguagesForTranslateCompleted(object sender, GetLanguagesForTranslateCompletedEventArgs e)
{

_codes = e.Result.ToList();
LanguageServiceClient proxy = new LanguageServiceClient();
proxy.GetLanguageNamesCompleted += new System.EventHandler<GetLanguageNamesCompletedEventArgs>(proxy_GetLanguageNamesCompleted);
proxy.GetLanguageNamesAsync(APPID, "en", e.Result);
}

void proxy_GetLanguageNamesCompleted(object sender, GetLanguageNamesCompletedEventArgs e)
{
_names = e.Result.ToList();
LoadLanguages();
}

private void LoadLanguages()
{
for (int index = 0; index < _codes.Count; index++)
{
_languages.Add(new Language
{
Code = _codes[index],
Name = _names[index]
});
}
}

Como podéis observar hemos tenido que llamar a dos métodos del web service para recuperar los lenguajes que nos da bing para la traducción.

El XAML nos quedaría

Código :

<Grid x:Name="ContentGrid"
Grid.Row="1">
<StackPanel Orientation="Vertical">
<StackPanel Orientation="Horizontal" HorizontalAlignment="Center">
<StackPanel Orientation="Vertical">
<TextBlock TextAlignment="Center">From</TextBlock>
<ListBox Name="lbxFrom" Height="140" ItemsSource="{Binding Languages}" Margin="0,3,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" FontSize="20" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
<StackPanel Orientation="Vertical" Margin="5,0,0,0">
<TextBlock Margin="10,0,0,0" TextAlignment="Center">To</TextBlock>
<ListBox Name="lbxTo" Height="140" ItemsSource="{Binding Languages}" Margin="0,3,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" FontSize="20" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>
</StackPanel>
</StackPanel>
<TextBox Name="txtInput" Text="{Binding LanguageFrom}" Height="180" />
<Button Name="btnTranslate" Content="Translate"/>
<TextBox Name="txtOutput" Text="{Binding LanguageTo}" Height="180" />
</StackPanel>
</Grid>
</Grid>

Me gustaría antes de seguir adelante que os fijaseis en los controles ListBox, en Windows Phone no existe la propiedad SelectedValuePath para indicar la propiedad que contiene el código del item de cada fila.

Si ejecutamos la aplicación tendríamos por el momento


Ahora debemos de recoger los idiomas que seleccione el usuario, para saber el item seleccionado utilizando el patrón MVVM es muy sencillo en nuestra ViewModel crearemos una propiedad del tipo que hacemos binding y la enlazamos mediante DataBinding a la propiedad SelectedItem.

Código :

 private Language _languageFromSelected;
public Language LanguageFromSelected
{
get { return _languageFromSelected; }

set
{
_languageFromSelected = value;
RaisePropertyChanged("LanguageFromSelected");
}
}

El código XAML

Código :

<ListBox Name="lbxFrom" Height="140" ItemsSource="{Binding Languages}" SelectedItem="{Binding LanguageFromSelected, Mode=TwoWay}" Margin="0,3,0,0">
<ListBox.ItemTemplate>
<DataTemplate>
<TextBlock Text="{Binding Name}" FontSize="20" />
</DataTemplate>
</ListBox.ItemTemplate>
</ListBox>

Una vez que sabemos los idiomas a traducir solo tenemos que llamar al método de traducción con los parámetros correctos.

Código :

 private void Translate()
{
LanguageServiceClient proxy = new LanguageServiceClient();
proxy.TranslateCompleted += new System.EventHandler<TranslateCompletedEventArgs>(proxy_TranslateCompleted);
proxy.TranslateAsync(APPID, LanguageFrom, LanguageFromSelected.Code, LanguageToSelected.Code); 
}

void proxy_TranslateCompleted(object sender, TranslateCompletedEventArgs e)
{
LanguageTo = e.Result;
}

Ejecutamos nuestra aplicación y ya tenemos nuestro traductor


Os dejo el código, os recuerdo si queréis ejecutarlo debéis de crear vuestra key en Bing Developer Center

http://cid-8f5827db042e87d3.office.live.com/browse.aspx/Blog/BingTranslatorMVVM

¿Sabes SQL? ¿No-SQL? Aprende MySQL, PostgreSQL, MongoDB, Redis y más con el Curso Profesional de Bases de Datos que empieza el martes, en vivo.

Publica tu comentario

o puedes...

¿Estás registrado en Cristalab y quieres
publicar tu URL y avatar?

¿No estás registrado aún pero quieres hacerlo antes de publicar tu comentario?

Registrate