title: Better way to load image synchronously on Windows Phone?
body: <p>I'm new to do C# Windows Phone programming.</p>
  
  <p>In a nutshell, I am currently building an app that will:</p>
  
  <p>Load <code>image A</code></p>
  
  <p>Load <code>image B</code></p>
  
  <p>and then Load <code>image C</code></p>
  
  <p>then use these 3 images to do some post processing.</p>
  
  <p>My Image B and Image C are build as <code>Content</code> within the project.
  Image A is chosen from Gallery or taken via camera, or we can simply assume that Image A is load from Isolated Storage.</p>
  
  <p>I am experiencing a problem which I believe caused by asynchronous image loading.</p>
  
  <p>Here's my code:</p>
  
  <pre><code>...
  // I intend to load the 3 pictures by calling the method: LoadImage(int id) and LoadCImage();
  
              else if (ListBox.SelectedIndex == 0)
              {
                  Debug.WriteLine("Selected 0");
                  PhotoProcessor pp = new PhotoProcessor();
                  WriteableBitmap imageA = new WriteableBitmap(AImage);
                  WriteableBitmap imageB = LoadImage(0);
                  WriteableBitmap imageC = LoadCImage();
                  WriteableBitmap mix = pp.Mix(pp.CalcAverageColour(0), imageA, imageB, imageC);
                  resultPic.Source = mix;
              }
  ...
  </code></pre>
  
  <p>And:</p>
  
  <pre><code>private WriteableBitmap LoadImage(int id)
          {
              //String uriString = "/Assets/img0.jpg";            
              //BitmapImage img = new BitmapImage(new Uri(uriString, UriKind.Relative));
              BitmapImage img = new BitmapImage();
              img.CreateOptions = BitmapCreateOptions.None;
              //img.SetSource(Application.GetResourceStream(new Uri("/Assets/facetemplate0.jpg", UriKind.Relative)).Stream);
              img.UriSource = new Uri("/Assets/img" + id + ".jpg", UriKind.Relative);
  
              //img.UriSource = new Uri(uriString, UriKind.Relative);
              return new WriteableBitmap(img);
          }
  
          private WriteableBitmap LoadCImage()
          {
              //BitmapImage img = new BitmapImage(new Uri("/Assets/imgC.jpg", UriKind.Relative));
              BitmapImage bmp = new BitmapImage();
              bmp.CreateOptions = BitmapCreateOptions.None;
              //img.SetSource(Application.GetResourceStream(new Uri("/Assets/imgC.jpg", UriKind.Relative)).Stream);
              bmp.UriSource = new Uri("/Assets/imgC.jpg", UriKind.Relative);
              return new WriteableBitmap(bmp);
          }
  </code></pre>
  
  <p>Now my question is:</p>
  
  <p>When I'm trying to run this code, it will throw a Null Reference Exception, which is because of the function <code>mix</code> can't load Image A B and C (loading this images are asynchronously).</p>
  
  <p>I wonder if there's a way to let me sequentially load these images then let me to pass them to the <code>mix</code> function?</p>
  
  <p>What I've tried:</p>
  
  <ol>
  <li><p>By checking <a href="http://blogs.msdn.com/b/swick/archive/2011/04/07/image-tips-for-windows-phone-7.aspx" rel="nofollow">this great blog post</a>, I'm able to know that there do have some way to load the image synchronously, but as you can see throughout my code, I tried to use <code>SetSource(stream)</code> like the blogpost, but unfortunately I got the same Null Reference Exception.</p></li>
  <li><p>I've also thought about the <code>EventHandler</code> method, however I don't think its a good idea in this case. If I implement <code>EventHandler</code>, would it be something like(pseudo code):</p>
  
  <pre><code>imageA_Opened()
  {
  LoadImageB += imageB_Opened();
  }
  
  imageB_Opened()
  {
   LoadImageC += imageC_Opened();
  }
  
  imageC_Opened()
  {
  PhotoProcessor pp = new PhotoProcessor();
  pp.Mix(averageColour, A, B, C);
  }
  </code></pre></li>
  </ol>
  
  <p>Am I right?</p>