title: Xaml - how to use ImageSource from ViewModel
body: <p>I have an <code>ObservableCollection&lt;Item&gt;</code> and an <code>Item</code> contains both a file path and an <code>ImageSource</code> of some image from the disk.</p>
  
  <pre class="lang-cs prettyprint-override"><code>public ObservableCollection&lt;Item&gt; Items { get; set; } = new ObservableCollection&lt;MediaListItem&gt;();
  </code></pre>
  
  <pre class="lang-cs prettyprint-override"><code>public class Item
  {
      public string Image { get; set; } // Full path to the image
      public ImageSource ImageSource { get; set; }
  }
  </code></pre>
  
  <p>However, I am unable to access any of the two attributes and display an image via XAML.</p>
  
  <pre class="lang-xml prettyprint-override"><code>&lt;ListView ItemsSource="{Binding MediaList}"&gt;
      &lt;ListView.ItemTemplate&gt;
          &lt;DataTemplate&gt;
              &lt;ViewCell&gt;
                  &lt;StackLayout Padding="10"&gt;
                      &lt;Image Source="{Binding ImageSource}" VerticalOptions="Fill"&gt;&lt;/Image&gt;
                  &lt;/StackLayout&gt;
              &lt;/ViewCell&gt;
          &lt;/DataTemplate&gt;
      &lt;/ListView.ItemTemplate&gt;
  &lt;/ListView&gt;
  </code></pre>
  
  <p>Now I am confused because I am able to output the <code>string Image</code> via XAML through a label, but can't display an image from the path at all.</p>