Le contrôle WebBrowser pour choisir des fichiers à télécharger sur WP7

Dans le monde Desktop, on trouve pléthore d’applications capables d’ouvrir des fichiers externes, que ce soient des fichiers textes, images, vidéo ou tous autres formats, par le biais d’une boite de dialogues se référant au système de fichier.

Dans nos applications Windows Phone nous ne disposons pas, pour des raisons de sécurité, d’un accès à ces fichiers (sauf les fichiers images avec le fameux PhotoChooserTask).
L’intégration de fichiers externes à l’applications doit donc initialement passer par Internet.
Il existe plusieurs types d’intégration possible par le Web qui vont de la plus simple (une uri du fichier à downloader dans une textbox) à la plus complexe (utiliser le SDK WindowsLive pour intégrer SkyDrive).

Nous allons voir ensemble une autre possibilité, très simple à mettre en place et permettant une grande liberté à l’utilisateur.

Quand le web nous sert de boite de dialogue

L’idée est de se servir d’un control WebBrowser comme d’un système de fichier.
Lorsque l’on est en train de naviguer vers un fichier dont l’extension nous convient, on arrête la naviguation pour le telecharger par nos propres moyens et ainsi pouvoir le récupérer dans notre application.

Un POC !

Afin de vérifier que notre concept fonctionne correctement ajoutons un control WebBrowser dans notre page.

<phone:WebBrowser x:Name="WebBrowser" Source="http://www.google.fr/m?site=images" />

On s’abonne ensuite à l’évènement de début de naviguation :

this.WebBrowser.Navigating += new EventHandler<NavigatingEventArgs>(WebBroser_Navigating);

On peut alors vérifier que l’extension de l’url en cours est bien de l’extension que nous recherchons (ici une image .jpg). Si c’est le cas on annule la navigation et on lance un WebClient contenant l’url en cours !

if (e.Uri.LocalPath.EndsWith(".jpg", StringComparison.InvariantCultureIgnoreCase) == true)
{
    // on annule la navigation
    e.Cancel = true;    


    // on commence le telechargement
    WebClient client = new WebClient();

    client.OpenReadCompleted += new OpenReadCompletedEventHandler(client_OpenReadCompleted);

    client.OpenReadAsync(e.Uri);
}

Une fois téléchargé le fichier (qui est ici une image) sera placé dans un BitmapImage afin d’être affiché dans une ListBox d’Image.

void client_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e)
{
    if (e.Error == null && e.Cancelled == false)
    {
        // on crée l'image
        BitmapImage image = new BitmapImage();

        image.SetSource(e.Result);

        // On ajoute l'image dans une collection bindée sur une ListBox
        this.imageSource.Add(image);
    }
}

L’exemple

Afin de vous donner un avant de gout de ce que cela peut donner, voici une petit vidéo explicative.
Elle présente un WebBrowser pointant vers le site google image et capable de recupérer les images téléchargeables coté Silverlight.

Conclusion

Cette méthode est intéressante dans le cas ou les extensions de fichiers sont peu courantes sur le Web. Par exemple pour des images (.jpg, .png) je me suis aperçu que la recherche de google image telechargeais plusieurs fois les même images. Il a fallut donc rajouté un filtre pour vérifier que l’url n’avait pas déjà été téléchargé. Pour des fichiers de type moins courant cela ne devrait en revanche pas poser de problème.

Le projet

Vous pouvez télécharger ici le projet complet de l’application.

Le projet : WebExplorer.rar

D’autre méthodes ?

Et vous ? Avez-vous vos propres façon d’intégrer des fichiers externes ?

leave your comment