Les images en SilverLight

Version imprimable

Bonjour

Je débute en SilverLight et je butte sur un truc qui doit être tout bête.
Mais avant qu'on me le balnce en pleine tête :
- mon ami GOOGLE ne m'a pas donné de réponse compréhensible par ma petite cervelle
- la FAQ n'a pas été trés aimable car elle ne m'a pas dit ce qe je voulais savoir
- les tutos que j'ai parcouru sont bien fait, sympa, mais ne contiennent pas l'information qu'il me manque (sauf un, amis ça marche pas !)

Maintenant ma question : le images, on les mets où ?

Dans mon projet j'ai ça comme code (c'est simple, je teste) :
Code:

1 2 3 4 5 6 7 8 9 <UserControl x:Class="MonHello.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300" Background="Azure"> <Grid x:Name="LayoutRoot" Background="Aqua"> <Image x:Name="img1" Source="img.gif"></Image> </Grid> </UserControl>
C'est censé me mettre une image toute seule.

Mon fichier Img.gif se trouve juste à côté du xap.
J'ai essayé de mettre des /, des ~ et de ..
Mais rien, que dalle, il veut pas comprendre. Ou alors, c'est moi qui suis pasé à côté du truc tout bête.

Pouvez vous m'aider ?

29/04/2009, 18h03
climero51

Si je dis pas de bêtise, si ton image 'img.gif' se trouve dans ton dossier clientBin, tu devrais la voir.
29/04/2009, 18h25
tomlev

Si tu définis l'image comme ressource dans le projet, elle est inclue dans le XAP

Sinon, si elle est dans le même répertoire, ça devrait marcher tout seul

Alors, à force de chercher j'ai déjà trouvé un détail qui tue : le SilverLight ne prends pas en compte les fichiers GIF !

Donc je suis passé à une image en PNG.

Lorsque je place mon image à côté du XAP, ça roule.
Mais si je mets mon image dans un répertoire de thème (par exemple) ben ça marche plus.

Voici mon code actuel :
Code:

1 2 3 4 5 6 7 8 9 <UserControl x:Class="MonHello.Page" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" Width="400" Height="300" Background="Azure"> <Grid x:Name="LayoutRoot" Background="Aqua"> <Image x:Name="img1" Stretch="Uniform" Source="/App_Themes/montheme/img.png" Height="50"></Image> </Grid> </UserControl>
Dans le projet web il y a un répertoire App_Themes qui contient un répertoire montheme et l'image est dedans. Lorsque je lance le projet, ben j'ai pas d'image et j'ai une erreur JSCript

Citation:

Sys.InvalidOperationException: ImageError error #4001 in control 'Xaml1': AG_E_NETWORK_ERROR

Je sens bien que ça parle de l'image, mais j'ai du mal à suivre.

Voyez vous le souci ?

29/04/2009, 18h56
The_badger_man

Il se base par rapport au dossier clientbin. Donc là il cherche un dossier App_Themes dans clientbin.

Si tu comprends l'anglais (même basic) tu trouveras ici un grand nombre de réponses: http://channel9.msdn.com/posts/mtaul...ite-Of-Origin/
30/04/2009, 09h13
zooffy

Merci pour ton aide.

Malgré mon niveau d'anglais trés faible, j'ai réussi à suivre la vidéo. Le gars à couvert tous les cas, sauf celui qui me concerne ! Dommage....

Mais si je je suis ce que tu dis sur al relativité du chemin, vu que j'ai mis un / il va chercher dans le répertoire, ce qui ne correspond pas aux règles élémentaire HTML, puisque la présence d'un / indique qu'il faut reprendre de la racine.

J'ai donc fait (par acquis de conscience) un essai sans le / et j'ai e même résultat.

ALors la question reste posée : comment fait on référence à une image qui se trouve dans le projet Web placée dans un autre répertoire que celui du XAP ?
30/04/2009, 10h36
Thomas Lebrun

Citation:

Envoyé par zooffy

ALors la question reste posée : comment fait on référence à une image qui se trouve dans le projet Web placée dans un autre répertoire que celui du XAP ?

/ correspond au repertoire ClicntBin donc si tu veux accéder à un répertoire autre, tu parcours l'arborescence:

../Images/Image.png => tu remontes le répertoire ClientBin, tu es donc à la racine du serveur Web, tu accèdes au répertoire Images et à l'image Image.png.

Dans ton cas, essaye ca:

Source="../App_Themes/montheme/img.png"

Salut Zooffy !

En fait les images que tu veux utiliser doivent se trouver soit dans le projet Silverlight (image.png), soit dans le répertoire ClientBin (/image.png) pour la simple et bonne raison que c'est le contenu qui est accessible directement depuis la machine cliente.

Ce qui se trouve dans le projet Web reste sur le serveur, pour contacter ce contenu, il faudra donc soit utiliser l'URL (http://tonsite.be/image.png), ce qui est assez Lourd ...

Ou alors un utilisant un WebClient je pense que c'est possible, perso je viens d'essayer mais je n'arrivais qu'a afficher mon image qui se trouvait dans le ClientBin, voici le code
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 void Page_Loaded(object sender, RoutedEventArgs e) { WebClient client = new WebClient(); client.OpenReadCompleted += new OpenReadCompletedEventHandler(client_OpenReadCompleted); client.OpenWriteAsync(new Uri("metrum.png", UriKind.Relative)); } void client_OpenReadCompleted(object sender, OpenReadCompletedEventArgs e) { try { BitmapImage img = new BitmapImage(); img.SetSource(e.Result); image1.Source = img; } catch (Exception) { MessageBox.Show("Erreur blablabla"); } }
Donc, je rappelle que je ne suis pas parvenu a sortir du ClientBin, il faut fournir une adresse relative par rapport au ClientBin, j'ai donc essayé ./ mais sans succès ...

Sinon, l'idéal a mon avis est que tu fasses un String avec l'url du site en global et que tu utilises pour récupérer tes images ...

Voilà, j'espère que j'aurais pu t'aider ...

30/04/2009, 10h58
zooffy

Citation:

Envoyé par Thomas Lebrun

/ correspond au repertoire ClicntBin donc si tu veux accéder à un répertoire autre, tu parcours l'arborescence:

Ben là je suis pas d'accord. / correspond à la racine du site, tout du moins en HTML. Ou alors, ça ait tellement longtemps que j'ai aps fait de HTML pur que j'ai oublié mes bases. Mais c'est pas grave.

Citation:

Envoyé par Thomas Lebrun

Source="../App_Themes/montheme/img.png"

Donc j'ai essayé ça, qui, malgré tout, me parait correct et ça marche pas. J'ai toujours le même message d'erreur JScript.

Alors est ce que, comme l'avance cyberbobby, SilverLight ne saurait pas gérer les images ailleurs que dans le répertoire ClientBin ?
D'autant plus que, comme je l'ai dit au sujet de la vidéo proposée par The_badger_man, le gars couvre toutes les possibilités d'image sauf celle que je souhaite utiliser, c'est peut être un signe.

Sur le bout de code que tu propose, cyberbobby, je vois deux soucis :
- c'est du C# et je suis pas sûr d'avoir capté toute la subtilité de la chose
- pour l'instant je voudrais faire apparaitre une seule image car j'apprend le SilverLight. Mais mon projet global fait intervenir un paquet d'image et je me vois mal utiliser cette méthode pour toute mes images, enfin, j'ai surtout du mal à voir comment je l'utilise.

En tout cas merci pour votre aide.
30/04/2009, 11h00
The_badger_man

Tu peux mettre l'url absolue de l'image (http://www.monsite/Images/monimage.jpg)

Ou alors dans le code, pour accéder à un rep Image se trouvant à la racine du site:

Code:

public static string URL_REP_IMAGES = string.Format("{0}/../../Images", Application.Current.Host.Source);

Application.Current.Host.Source te donnes l'url absolue du xap.
30/04/2009, 11h04
The_badger_man

Citation:

Envoyé par zooffy

Ben là je suis pas d'accord. / correspond à la racine du site, tout du moins en HTML. Ou alors, ça ait tellement longtemps que j'ai aps fait de HTML pur que j'ai oublié mes bases. Mais c'est pas grave.

Oui mais une appli Silverlight s'execute coté client, ça n'est pas comme un site web qui s'execute sur le serveur. Le root pour une appli Silverlight c'est son fichier xap.
30/04/2009, 11h15
zooffy

Ok The_badger_man, maintenant je comprends mieux.

Mais alors pourquoi le ../App_Themes/montheme/img.png ne fonctionne pas ?
Ensuite, ta ligne de définition de l'URL de l'image me parait être une bone idée, peut être plus légère que la procédure de cyberbobby (qui est une bonne idée aussi). J'ai tout de même deux soucis avec (nu epu les mêmes que la procédure de cyberbobby) :
- c'est du C# et je maitrise pas, amis avec un traducteur en ligne je devrais m'en sortir
- mais surtout : je la mets où dans le code ? J'ai pas trouvé d'équivalent du page_init

Donc, si je récapitule : il faut que je gère mes chemins d'image avec une procédure qui va me le calculer à chaque fois. Mon souci est que je gère plusieurs sites sur le même système et donc j'ai plusieurs thèmes. Est ce que j'ai un moyen d'aller dans la base de données à partir de SilverLight (j'ai pas encore vu cet aspect dans les tuto que j'ai regardé).
Et, est ce que j'ai la possibilité d'appeller une classe externe qui se trouverait dans le projet web. Parce que là, l'idée c'est de faire une procédure qui va me retourner l'URL de l'image calculée en fonction de paramettre.

Pour faire un calcul de mon URL je dois prendre le DNS du site (facile) et ensuite aller dans la base de données chercher le nom du répertoire dans App_Themes qui concerne le site dans le quel je suis.

Merci pour votre ade.
30/04/2009, 11h23
cyberbobby
Pour ce qui est de là ou du dois mettre le code, tu as un événement Loaded donc, dans ton constructeur tu t'abonnes (comme dans mon exemple) :
Code:

1 2 Loaded += new RoutedEventHandler(Page_Loaded);
Et dans le handler, tu charges tes images ... Evidemment, c'est du C# encore et toujours. T'es en VB toi ?
Code:

1 2 3 4 5 void Page_Loaded(object sender, RoutedEventArgs e) { ... }
Il est possible de contacter une base de données assez facilement, tu dois créer un Service WCF ou WebService qui tournera sur le serveur pour y accéder (chercher sur WCF et Silverlight).

Pour accéder a une classe du projet Web, ca m'étonnerait que ce soit possible, tu peux par contre accéder a une classe du WebService ...
(je ne sais pas si ca te dépanne, pour ce qui est du reste, The_badger_man répondra mieux que moi ...)
30/04/2009, 11h35
zooffy

Oui, je suis en VB et je sais, c'est moins bien que C#, mais je fais du basic depuis tout petit, alors....
Et quand je dis tout petit, j'ai commencé à 11 ans, en 6° avec un TRS 80 (en 1981), donc du coup, j'ai du mal à passer au C#. Mais je me soigne !

Bon, je comprends pas bien l'histoire de l'abonnement, mais j'ai trouvé l'évènement Loaded dans la Page côté CoeBehind.

Maintenant je me bastonne avec le BitmapImage. Visiblement c'est pas automatique, il lui faut certainement un Imports.

Mais je reste à préférer un chemin direct qui pointe sur le répertoire dans le site Web.
30/04/2009, 11h37
The_badger_man

On s'égare un peu là.

Peux-tu rappeler exactement ce que tu souhaites faire (pas techniquement mais fonctionnellement). Parcequ'au début c'était simplement l'url d'une image d'un rep sur le site maitenant il y a un calcul en fonction de paramètres, l'appel à une classe du projet web. La solution technique risque de varier énormément.
30/04/2009, 11h45
cyberbobby

Oui, Clic droit, résoudre et Visual t'ajoute gentillement :

Code:

using System.Windows.Media.Imaging;

Oui, je te l'accorde, on s'égare car j'ai ouvert des pistes au cas où je ne pourrais pas faire ce que voulais au départ.

Donc, récapitulatif : je voudrais accéder à des images qui sont dans le projet web dans un répertoire /App_Themes/montheme.
Mon AXP se trouve lui dans /ClientBin
Lorsque je fais :
Code:

1 2 3 4 <Image x:Name="img1" Stretch="Uniform" Source="App_Themes/montheme/img.png"></Image> <Image x:Name="img1" Stretch="Uniform" Source="/App_Themes/montheme/img.png"></Image> <Image x:Name="img1" Stretch="Uniform" Source="../App_Themes/montheme/img.png"></Image>
Aucun ne fontionne et me retourne un message d'erreur

Citation:

Sys.InvalidOperationException: ImageError error #4001 in control 'Xaml1': AG_E_NETWORK_ERROR

Voilà, avec ça on est au clair.

En supposant que le dossier ClientBin contenant le xap se trouve à la racine du site (config par defaut lors de la création d'une appli SL), en C# tu peux faire ceci (la version VB ne doit être bien différente):
Code:

1 2 3 4 5 6 7 8 9 10 11 // Recupération de l'url absolue du rep des images // ex: http://localhost:10194/App_Themes/Theme1 string urlRep = string.Format("{0}/../../App_Themes/Theme1", Application.Current.Host.Source); // url absolue de l'image // ex: http://localhost:10194/App_Themes/Theme1/Creek.jpg string urlImage = string.Format("{0}/{1}", urlRep, "Creek.jpg"); // affichage de l'image image.Source = new BitmapImage(new Uri(urlImage, UriKind.Absolute));
Tu peux mettre urlRep dans une classe Config par exemple afin d'y avoir toujours accés te de le construire qu'un seule fois.

Merci, ça marche Nickel.

Donc, cela implqiue bien qu'il n'est pas possible de faire référence à une image ailleurs que dans le répertoire /ClientBin, nous sommes bien d'accord là dessus ?

Pour info aux autres novice et autres accroc du VB voici le code que j'ai mis dans la procédure Page_Loaded
Code:

1 2 3 4 5 6 7 8 9 10 11 12 13 14 Private Sub Page_Loaded(ByVal sender As Object, ByVal e As System.Windows.RoutedEventArgs) Handles Me.Loaded ' Recupération de l'url absolue du rep des images ' ex: http://localhost:10194/App_Themes/montheme Dim urlRep As String = String.Format("{0}/../../App_Themes/montheme", Application.Current.Host.Source) ' url absolue de l'image ' ex: http://localhost:10194/App_Themes/montheme/img.png Dim urlImage As String = String.Format("{0}/{1}", urlRep, "img.png") ' affichage de l'image img1.Source = New BitmapImage(New Uri(urlImage, UriKind.Absolute)) End Sub
Et ne pas oublié le Imports : Imports System.Windows.Media.Imaging

Dans l'attente de la confirmation à ma dernière question, je boucle le sujet. Je me débrouillerais pour dynamiser ce principe de calcul d'URL pour ne aps répeter le code à chaque fois.

Merci à tous.

07/03/2011, 02h51
l'ost23

merci
c'est au moins le enieme probléme que vous m'aidez à resoudre.
alors puisse le dieu de la machine vous garder dans ses bonnes graces ^^.:ccool: