title: Xamarin Forms - Change an image in a ListView depending on binding data
body: <p>We are trying to add functionality to a Xamarin Forms ListView where the image will change based on a particular value. The problem is that the image does not show, even if the value is the same as the model.</p>
  
  <p><strong>XAML Page:</strong></p>
  
  <p>.....</p>
  
  <pre><code>xmlns:images="clr-namespace:Cat;assembly=Cat"
  </code></pre>
  
  <p>....</p>
  
  <pre><code>&lt;Image Grid.Row="0" Grid.RowSpan="3" Grid.Column="1"
      Style="{DynamicResource ListItemImageStyle}"
      HorizontalOptions="EndAndExpand"
      VerticalOptions="Center"&gt;
  &lt;Image.Triggers&gt;
      &lt;DataTrigger TargetType="Image"
                     Binding="{Binding Status}"
                     Value="Urgent"&gt;
           &lt;Setter Property="Source" Value="{images:ImageResource Cat.about.png}" /&gt;
      &lt;/DataTrigger&gt;
      &lt;DataTrigger TargetType="Image"
                     Binding="{Binding Status}"
                     Value="B"&gt;
                     &lt;Setter Property="Source" Value="{images:ImageResource Cat.new.png}" /&gt;
                     &lt;/DataTrigger&gt;
  &lt;/Image.Triggers&gt;
  &lt;/Image&gt;
  </code></pre>
  
  <p><strong>ImageResourceExtension CS File</strong></p>
  
  <pre><code> [Preserve(AllMembers = true)]
   [ContentProperty("Source")]
  public class ImageResourceExtension : IMarkupExtension
  {
      public string Source { get; set; }
  
      public object ProvideValue(IServiceProvider serviceProvider)
      {
          if (Source == null)
              return null;
  
          // Do your translation lookup here, using whatever method you require
          var imageSource = ImageSource.FromResource(Source);
  
          return imageSource;
      }
  }
  </code></pre>
  
  <p>The image "about.png" is in the root of the same project.</p>
  
  <p>The data is bound and displayed correctly, only the image isn't displaying. </p>
  
  <p>I'm wondering if this is the best approach? </p>