Warum wird mein externes Bild nicht in meine Silverlight-Seite geladen?

Question

Um dies so einfach wie möglich zu machen, habe ich eine neue Silverlight 4 Application erstellt und der Testwebsite einen Ordner Images hinzugefügt, der automatisch erstellt wird, wenn die Anwendung generiert wird. Ich stelle das gleiche Bild ein, nennen wir es "imageName.png" im ClientBin-Ordner und im Bilder-Ordner. Nun, alles funktioniert gut, wenn ich nur das Bild in ClientBin verwenden XAML wie folgt aus:

<Grid x:Name="LayoutRoot" Background="White"> 
    <StackPanel> 
     <Image Source="imageName.png" Width="16" Height="16"/> 
     <TextBox Text="Hello" /> 
    </StackPanel> 
</Grid> 

Aber das Bild nicht geladen, wenn ich versuche, das Bild in den Bildern wie diesem Ordner zuzugreifen:

<Grid x:Name="LayoutRoot" Background="White"> 
    <StackPanel> 
     <Image Source="../Images/imageName.png" Width="16" Height="16"/> 
     <TextBox Text="Hello" /> 
    </StackPanel> 
</Grid> 

Ich bekomme keine Fehler, aber das Bild ist einfach nicht da. Kann mir jemand sagen, was vor sich geht? Alles, was ich gefunden habe, scheint darauf hinzudeuten, dass dies funktionieren sollte.

Answer 1

Das Problem hier ist, dass der Ordner, der den Xap und den oberen Inhalt in der Xap selbst enthält, als die Wurzel des Pfades betrachtet wird. Daher entspricht der Pfad "/" dem obersten Inhalt in Xap und dem Ordner, in dem sich der Xap befindet (normalerweise ClientBin). Jeder Versuch, einen übergeordneten Pfad hinter dem Stamm zu verwenden, führt zu einem Silverlight-Netzwerkfehler.

Jeglicher Inhalt außerhalb des Ordners, in dem sich Xap befindet, kann nur mit einem absoluten Uri aufgerufen werden.

Dann müssen Sie die relative Adresse, die einen übergeordneten Pfad enthält, in eine absolute Adresse konvertieren, bevor Sie sie an die Image.Source-Eigenschaft übergeben. Vorzugsweise würden wir es vermeiden wollen, die absolute Basisadresse in den Quellcode zu codieren.

Wir können die aktuelle erwerben die absolute Url für die Xap mit der BaseAddress Eigenschaft des WebClient Objekts. Daraus können wir die gewünschte absolute Adresse zusammensetzen, indem wir sie mit der relativen Adresse kombinieren, selbst wenn sie einen übergeordneten Pfad enthält.

kann ein Wert Konverter machen dies einfacher in XAML: -

public class WebRelativeConverter : IValueConverter 
{ 
    public Uri Base { get; set; } 

    public WebRelativeConverter() 
    { 
     Base = new Uri((new WebClient()).BaseAddress, UriKind.Absolute); 
    } 

    public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     Uri result = null; 

     if (value is Uri) 
     { 
      result = new Uri(Base, (Uri)value); 
     } 
     else if (value != null) 
     { 
      result = new Uri(Base, value.ToString()); 
     } 
     return result; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture) 
    { 
     throw new NotImplementedException(); 
    } 
} 

nun ein fester Wert in XAML würde wie folgt aussehen: -

<Grid x:Name="LayoutRoot" Background="White"> 
    <Grid.Resources> 
     <local:WebRelativeConverter x:Key="wrc" /> 
    </Grid.Resources> 
    <StackPanel> 
     <Image DataContext="../Images/imageName.png" Source="{Binding Converter={StaticResource wrc}}" Width="16" Height="16"/> 
     <TextBox Text="Hello" /> 
    </StackPanel> 
</Grid> 

Nun, wenn Sie tatsächlich die Quelle wurden die Bindung an eine Uri oder String-Eigenschaft eines Objekts müssen Sie nur den Konverter hinzufügen, und es sollte funktionieren.