Monday, May 27, 2013

Day 19: Retrieving Image from SQL Server CE problem


Last night was able to manage a couple of things:
  • Windows Phone Silverlight Toolkit resolved by worry of an alternative to Combo box. This toolkit provides a control called the ListPicker, which more or less acts the same way as a conventional drop down menu.
  • Managed to get the 3D Image Carousel control rendering on my Mobile Application project.
  • Got the DataContext classes for the tables of the SQL Server CE DB auto generated from the SQL Server CE Server Explorer.
The existing 3D Image Carousel control code expects a URL of Images from the local storage and renders the images on the screen. But my need was to load the images from the DB. So I had to do some changes to the existing code:
This is the existing code:

 // dependency property  
     public static DependencyProperty ListImagesCarouselProperty =  
     DependencyProperty.Register("ListImagesCarousel", typeof(List<string>), typeof(Carousel3D), new PropertyMetadata(null));  
     public List<string> ListImagesCarousel  
     {  
       get  
       {  
         return (List<string>)GetValue(ListImagesCarouselProperty);  
       }  
       set  
       {  
         SetValue(ListImagesCarouselProperty, value);  
         // set visibility to Visible -> this shows up all controls on UI  
         gridMainCarousel.Visibility = System.Windows.Visibility.Visible;  
         AddImagesToCarousel();  
         // set position to center of images  
         SetIndex(_images.Count / 2);  
         Start();  
       }  
     }  
  // Add images to Canvas  
     private void AddImagesToCarousel()  
     {  
       if (ListImagesCarousel != null && ListImagesCarousel.Count > 0)  
       {  
         for (int i = 0; i < ListImagesCarousel.Count; i++)  
         {  
           // get the image url  
           string url = ListImagesCarousel[i];  
           Image image = new Image();  
           image.Source = new BitmapImage(new Uri(url, UriKind.RelativeOrAbsolute));  
           // TAG is used as an identifier for images  
           image.Tag = i.ToString();  
           // event Tapped to find selected image  
           image.Tap += image_Tap;  
           // add and set image position  
           LayoutRoot.Children.Add(image);  
           SetPosImage(image, i);  
           _images.Add(image);  
         }  
       }  
     }  

MSDN describes the Dependency Property as:

Dependency properties and the WPF property system extend property functionality by providing a type that backs a property, as an alternative implementation to the standard pattern of backing the property with a private field.
The first line would change as:
 public static DependencyProperty ListImagesCarouselProperty =    
   DependencyProperty.Register("ListImagesCarousel", typeof(List<Image>), typeof(Carousel3D), new PropertyMetadata(null));    

The remaining code in the Carousel control class was changed as highlighted in color.


   public List<Image> ListImagesCarousel   
    {   
     get   
     {   
      return (List<Image>)GetValue(ListImagesCarouselProperty);   
     }   
     set   
     {   
      SetValue(ListImagesCarouselProperty, value);   
      // set visibility to Visible -> this shows up all controls on UI   
      gridMainCarousel.Visibility = System.Windows.Visibility.Visible;   
      AddImagesToCarousel();   
      // set position to center of images   
      SetIndex(_images.Count / 2);   
      Start();   
     }   
    }   
  // Add images to Canvas   
    private void AddImagesToCarousel()   
    {   
     if (ListImagesCarousel != null && ListImagesCarousel.Count > 0)   
     {   
      for (int i = 0; i < ListImagesCarousel.Count; i++)   
      {   
       // get the image url   
       //string url = ListImagesCarousel[i];   
       Image image = new Image();   
       //image.Source = new BitmapImage(new Uri(url, UriKind.RelativeOrAbsolute));  
       image = ListImagesCarousel[i];  
       // TAG is used as an identifier for images   
       image.Tag = i.ToString();   
       // event Tapped to find selected image   
       image.Tap += image_Tap;   
       // add and set image position   
       LayoutRoot.Children.Add(image);   
       SetPosImage(image, i);   
       _images.Add(image);   
      }   
     }   
    }  

All this was fine, and I used a separate business logic class to retrieve the menu images using LINQ. The images are returned as a System.Data.Linq.Binary type from the auto generated data-context class. But there was a problem mapping it to a System.Windows.Controls.Image data type, as the Image type used in the above code is actually the fore mentioned type. Hope to find a solution for it tonight.

No comments:

Post a Comment