Machen WPF-Bild laden, async

Ich würde gerne laden Gravatar-Bilder und legen Sie Sie aus dem code hinter einem WPF-Bild-Kontrolle.
Also der code sieht aus wie

imgGravatar.Source = GetGravatarImage(email);

Wo GetGravatarImage aussieht:

BitmapImage bi = new BitmapImage();
bi.BeginInit();
bi.UriSource = new Uri( GravatarImage.GetURL( "http://www.gravatar.com/avatar.php?gravatar_id=" + email) , UriKind.Absolute );
bi.EndInit();
return bi;

Leider sperrt die GUI, wenn die Netzwerkverbindung langsam ist. Gibt es eine Möglichkeit zum zuweisen der Bild-Quelle und lassen Sie es laden Sie das Bild im hintergrund ohne Blockierung der UI?

Dank!

InformationsquelleAutor user1130329 | 2013-04-16

22

Ich schlage vor, Sie verwenden eine Verbindliche, auf Ihre imgGravatar von XAML. Set IsAsync=true auf es und WPF automatisch nutzen, ein thread aus dem threadpool, ziehen Sie Ihr Bild. Könnten Sie Kapseln die Lösung von Logik in IValueConverter und einfach binden Sie die E-Mail als Quelle

in XAML:
```
<Window.Resouces>
    <local:ImgConverter x:Key="imgConverter" />
</Window.Resource>

...


<Image x:Name="imgGravatar" 
       Source="{Binding Path=Email, 
                        Converter={StaticResource imgConverter}, 
                        IsAsync=true}" />
```
Code:
```
public class ImgConverter : IValueConverter
{
    public override object Convert(object value, ...)
    {
        if (value != null)
        {
             BitmapImage bi = new BitmapImage();
             bi.BeginInit();
             bi.UriSource = new Uri( 
                 GravatarImage.GetURL(
                     "http://www.gravatar.com/avatar.php?gravatar_id=" + 
                      value.ToString()) , UriKind.Absolute 
                 );
             bi.EndInit();
             return bi;                
        }
        else
        {
            return null;
        }

    }
}
```
- BitmapImage auch ein Konstruktor mit dem Uri-parameter, die würde speichern Sie die BeginInit/EndInit Anrufe.
- +1 habe es nicht wissen, netten Hinweis. Ich habe gerade kopiert den code aus dem Autor und denke auch nicht, wie die Optimierung der eigentlichen herunterladen, stattdessen konzentrierte ich mich auf die Lösung der UI-block-Problem auf elegante Weise (und natürlich ist es blockiert, wenn der code nicht async). Ich denke, für wiederholte Verwendung, könnte der Konverter die auch den vollständigen url aus der Bindung an mehr wiederverwendbare, anstelle der E-Mail. Ich mag nicht mit ThreadPool weil Sie zu bewältigen haben, ist der Versand die ganze Zeit. Dies macht es nicht elegant genug, um mich für eine Reine MVVM-Anwendung.
- Können Sie eine Erklärung geben, warum die Schaffung eines BitmapImage blockieren würden, wenn Sie nicht asynchron aufgerufen wird. Warum dann nicht die IsDownloading Eigentum und DownloadCompleted Veranstaltung. Wenn Sie einfach ein Bild-Steuerelement Source Eigenschaft im XAML-Code auf eine URL, die sich auf ein großes Bild auf der web-UI nicht blockieren. Stattdessen WPF downloads das Bild im hintergrund und zeigt, dass es, sobald der download abgeschlossen ist.
- Und ich bin mir ziemlich sicher, dass diese durchgeführt wird, von BitmapImage, als (von MSDN) "BitmapImage in Erster Linie existiert, um zu unterstützen, Extensible Application Markup Language (XAML) - syntax und stellt zusätzliche Eigenschaften für das laden von Bitmaps, die nicht definiert sind durch BitmapSource".
- Ich getestet, um ein bisschen mit einem riesigen Bild (14MB) und Sie sind absolut richtig. Das herunterladen wird automatisch durchgeführt, indem BitmapImage auf einem hintergrund-thread. Das UI hängt nur im moment des Ladens der Bild-Daten in der UI. Sorry für die Verwirrung. Der Download startet nach der BitmapImage zugeordnet ist als Source und nicht mit BeginInit(). Also im Grunde original-code aus, in dem der Autor arbeiten. Also vielleicht hat es etwas todo mit der Menge der Bilder, die er verwendet auf seiner Benutzeroberfläche.
- Nur kam hier wieder, und (aus bisherigen Erfahrungen) ich muss hinzufügen, dass, obwohl Sie eingestellt IsAsync auf true binden, dies beeinflusst nur, wie die Eigenschaft getter aufgerufen wird, aber nicht die Bindung Konverter. Der Konverter ist immer noch im UI-thread aufgerufen. Es tut sich einfach nicht blockieren der UI-thread, da BitmapImage nicht.
- Das ist genial! Gibt es auch eine LoadEvenFaster=True Einstellung ist nicht standardmäßig auf true gesetzt?
InformationsquelleAutor JanW

Ich kann nicht sehen, warum der code-block der Benutzeroberfläche, als BitmapImage unterstützt das herunterladen von Bild-Daten im hintergrund. Das ist, warum es hat eine IsDownloading Eigenschaft und eine DownloadCompleted Veranstaltung.

Jedenfalls der folgende code zeigt eine einfache Möglichkeit zum herunterladen und erstellen Sie das Bild komplett in einem separaten thread (von der ThreadPool). Es verwendet eine WebClient Instanz zum download des gesamten Bild-Puffer vor der Erstellung eines BitmapImage aus, dass die Puffer. Nach dem BitmapImage wird erstellt, er ruft Einfrieren zugänglich zu machen aus dem UI-thread. Schließlich weist das Bild-Steuerelement ist Source Eigenschaft in der UI-thread durch eine Dispatcher.BeginInvoke nennen.

ThreadPool.QueueUserWorkItem(
    o =>
    {
        var url = GravatarImage.GetURL(
           "http://www.gravatar.com/avatar.php?gravatar_id=" + email);
        var webClient = new WebClient();
        var buffer = webClient.DownloadData(url);
        var bitmapImage = new BitmapImage();

        using (var stream = new MemoryStream(buffer))
        {
            bitmapImage.BeginInit();
            bitmapImage.CacheOption = BitmapCacheOption.OnLoad;
            bitmapImage.StreamSource = stream;
            bitmapImage.EndInit();
            bitmapImage.Freeze();
        }

        Dispatcher.BeginInvoke((Action)(() => image.Source = bitmapImage));
    });

EDIT: heute würden Sie nur verwenden Sie asynchrone Methoden:

var url = GravatarImage.GetURL(
    "http://www.gravatar.com/avatar.php?gravatar_id=" + email);
var httpClient = new HttpClient();
var responseStream = await httpClient.GetStreamAsync(url);
var bitmapImage = new BitmapImage();

using (var memoryStream = new MemoryStream())
{
    await responseStream.CopyToAsync(memoryStream);

    bitmapImage.BeginInit();
    bitmapImage.CacheOption = BitmapCacheOption.OnLoad;
    bitmapImage.StreamSource = memoryStream;
    bitmapImage.EndInit();
    bitmapImage.Freeze();
}

image.Source = bitmapImage;

InformationsquelleAutor Clemens

Schreibe einen Kommentar

Du musst angemeldet sein, um einen Kommentar abzugeben.