2016-08-05 6 views
0

ich die Kontaktklasse haben:Quelle auf binded boolean Ändern Sie das Bild anhand

public class Contact 
{ 
    public Contact(Contact contact) 
    { 
     this.Username = contact.Username; 
     this.GUID = contact.GUID; 
     this.Msg = contact.Msg; 
     this.Ring = contact.Ring; 
    } 

    public string Username { get; set; } 
    public Guid GUID { get; set; } 
    public bool Msg { get; set; } 
    public bool Ring { get; set; } 
} 

Dies ist die XAML ist:

 <ListView Grid.Row="1" Grid.Column="0" Name="ContactsListView" 
         IsItemClickEnabled="True" 
         ItemsSource="{x:Bind m_Client.Contacts}"> 
     <ListView.ItemTemplate> 
      <DataTemplate x:DataType="data:Contact"> 
       <StackPanel Orientation="Horizontal"> 
        <TextBlock Text="{x:Bind Username}" VerticalAlignment="Center" /> 
        // HERE SHOULD BE THE <Image> THAT SHOULD BE BOUND TO THE Msg PROPERTY 
       </StackPanel> 
      </DataTemplate> 
     </ListView.ItemTemplate> 
    </ListView> 

Was muss ich tun ist, dass, wenn die Nachricht boolean wahr ist, Die Bildquelle muss ein Bild sein, und wenn der Msg-Boolesche Wert falsch ist, wird die Bildquelle in das zweite Bild geändert.

EDIT: ich diese Klasse erstellt:

namespace ContactsListBinding.Models 
{ 
    public class MyImageConverter : IValueConverter 
    { 
     public object Convert(object value, Type targetType, object parameter, string language) 
     { 
      return (bool)value ? new BitmapImage(new Uri("ms-appx:///Assets/true.png")) : new BitmapImage(new Uri("ms-appx:///Assets/false.png")); 
     } 

     public object ConvertBack(object value, Type targetType, object parameter, string language) 
     { 
      throw new NotImplementedException(); 
     } 
    } 
} 

Dies ist die XAML:

<Page 
    x:Class="ContactsListBinding.MainPage" 
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:local="using:ContactsListBinding" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
    xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
    mc:Ignorable="d" 
    xmlns:data="using:ContactsListBinding.Models" 
    xmlns:namespace="ContactsListBinding.Models"> 

    <Page.Resources> 
     <data:MyImageConverter x:Key="MyImageConverter" /> 
    </Page.Resources> 

    <Grid Background="{ThemeResource ApplicationPageBackgroundThemeBrush}"> 
     <Grid.RowDefinitions> 
      <RowDefinition Height="Auto"/> 
      <RowDefinition Height="*" /> 
     </Grid.RowDefinitions> 
     <Button Grid.Row="0" Grid.Column="0" Name="AddContactButton" Content="Add Contact" Click="AddContactButton_Click" /> 
     <ListView Grid.Row="1" Grid.Column="0" Name="ContactsListView" 
          IsItemClickEnabled="True" 
          ItemsSource="{x:Bind m_Client.Contacts}"> 
      <ListView.ItemTemplate> 
       <DataTemplate x:DataType="data:Contact"> 
        <StackPanel Orientation="Horizontal"> 
         <TextBlock Text="{x:Bind Username}" VerticalAlignment="Center" /> 
         <Image Source="{x:Bind Msg, Converter={StaticResources MyImageConverter}}" /> 
        </StackPanel> 
       </DataTemplate> 
      </ListView.ItemTemplate> 
     </ListView> 
    </Grid> 
</Page> 

Was mache ich falsch hier?

+0

Erstellung Converter Implementierung IValueConverter die Quelle richtige Bild auf Basis eines Eingangs zurück (String Msg) und Bindung ImageSource = {x: Bind Msg, Converter = YourMsgToImageSourceConverter} sollte die Arbeit tun – RTDev

+0

Würde es Ihnen etwas ausmachen, mir ein Beispiel zu geben, wie soll ich das tun? – Stefan

+0

Ändern Sie Ihre Ressource in Daten: MyImageConverter und fügen Sie ein neues BitmapImage hinzu, wie ich es in meiner Antwort unten getan habe. Wo sind Ihre zwei Bilder, im Ordner "Assets" oder woanders? –

Antwort

1

erstellen Konverter:

public class MyImageConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, string language) 
    { 
     return (bool)value ? new BitmapImage(new Uri("trueImagePath")) : new BitmapImage(new Uri("falseImagePath")); 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, string language) 
    { 
     throw new NotImplementedException(); 
    } 
} 

Sie müssen auch Ressourcen zu Ihrer Seite hinzufügen:

<Page.Resources> 
    <namespace:MyImageConverter x:Key="MyImageConverter" /> 
</Page.Resources> 

Und als Bildsteuerung wie folgt hinzu:

<Image Source="{x:Bind Msg, Converter="{StaticResources MyImageConverter}"}" /> 
+0

Ich habe dies ' ' und Es heißt, Konverter wird in Windows Universal Project nicht unterstützt. – Stefan

+0

Ich benutze vielleicht nur einen internen Namen, versuche, für ex umzubenennen. zu MyImageConverter. ** EDIT ** Und auch Namespace muss hinzugefügt werden in Seitenelement wie xmlns: namespace = "yourNamespace" oder wenn es der gleiche Namespace wie Ihre Ansicht ist, verwenden Sie local: MyImageConverter –

+0

Stefan, ich hoffe, dass Sie den richtigen Bildpfad stattdessen setzen - 'trueImagePath 'und' falseImagePath' –

1

Sie sollten Ihre benutzerdefinierten Konverter schaffen, die IValueConverter Schnittstelle

public class MsgToImagePathCovnerter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, string language) 
    { 
     var imagePath = "ms-appx:///Assets/1.jpg"; 
     var msg = (bool)value; 
     if (msg) 
     { 
      imagePath = "ms-appx:///Assets/2.jpg"; 
     } 

     return imagePath; 
    } 

    public object ConvertBack(object value, Type targetType, object parameter, string language) 
    { 
     throw new NotImplementedException(); 
    } 
} 

declare in XAML implementiert:

<local:MsgToImagePathCovnerter x:Key="MsgToImagePathCovnerter"/> 

und verwenden in Ihrem DataTemplate:

 <DataTemplate x:DataType="data:Contact"> 
      <StackPanel Orientation="Horizontal"> 
       <TextBlock Text="{x:Bind Username}" VerticalAlignment="Center" /> 
       <Image Source="{x:Bind Msg, Converter={StaticResource MsgToImagePathCovnerter}"/> 
      </StackPanel> 
     </DataTemplate> 
+0

Wo genau sollte ich diese Zeile setzen: ''? – Stefan

+0

Beispiel,

Verwandte Themen