WPF ListBoxItems problem - wpf

Question

In wpf app I have binded Dictionary to listbox. I have own style on listbox.
Listbox item consit image and 3 texblocks.
Friend class is here:
public class FriendData
{
public string idUser { get; set; }
public string nick { get; set; }
public string sefNick { get; set; }
public string status { get; set; }
public string photo { get; set; }
public string sex { get; set; }
public string isFriend { get; set; }
public string blockQuote { get; set; }
public FriendData(string idUser, string nick, string sefNick, string status, string photo, string sex, string isFriend)
{
this.idUser = idUser;
this.nick = nick;
this.sefNick = sefNick;
this.status = status;
this.photo = photo;
this.sex = sex;
this.isFriend = isFriend;
}
}
ListBox style is here:
<Style x:Key="friendsListStyle" TargetType="{x:Type ListBox}">
<Setter Property="ItemTemplate">
<Setter.Value>
<DataTemplate>
<Grid Name="MainGrid">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="0.3*"></ColumnDefinition>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="60"></RowDefinition>
</Grid.RowDefinitions>
<Image Source="{Binding Value.photo}" Margin="4,4,4,2"/>
<Grid Name="SlaveGrid" Grid.Column="1">
<Grid.ColumnDefinitions>
<ColumnDefinition Width="*"></ColumnDefinition>
</Grid.ColumnDefinitions>
<Grid.RowDefinitions>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
<RowDefinition Height="*"></RowDefinition>
</Grid.RowDefinitions>
<TextBlock Name="tbName" Text="{Binding Value.nick}" Grid.Column="0" Grid.Row="0" Margin="2,2,2,2" FontSize="13" FontWeight="Medium"></TextBlock>
<TextBlock Name="tbBlockQuote" Text="{Binding Value.blockQuote}" Grid.Column="0" Grid.Row="1" Margin="2,2,2,2" FontSize="11" FontWeight="Normal" Foreground="DarkGray"></TextBlock>
<TextBlock Name="tbStatus" Text="{Binding Value.status}" Grid.Column="0" Grid.Row="2" Margin="2,2,2,2" FontSize="11" FontWeight="Normal"></TextBlock>
</Grid>
</Grid>
<DataTemplate.Triggers>
<!--<Trigger Property="IsMouseOver" Value="true">
<Setter Property="LayoutTransform" TargetName="MainGrid">
<Setter.Value>
<ScaleTransform ScaleX="1.35" ScaleY="1.35" />
</Setter.Value>
</Setter>
</Trigger>-->
</DataTemplate.Triggers>
</DataTemplate>
</Setter.Value>
</Setter>
</Style>
My first problem is, tbStatus is binded to property status of class Friend. Status can have only 3 values : 0,1,2. If status have value 0, I need set tbStatus.Text="Offline", if status have value 1, I need set tbStatus.Text="Online" and if status is 2 then must be tbStatus.Text="Just Log". Its possible this condition set from XAML in listBox style?
<TextBlock Name="tbStatus" Text="{Binding Value.status}" Grid.Column="0" Grid.Row="2" Margin="2,2,2,2" FontSize="11" FontWeight="Normal"></TextBlock>
My second problem is if status is 0, I need convert Image to grayscale. I have func wich make converting to grayscale. I would like set these condition in listBox style. Any advance?
Here is :
private void ConvertImageToGrayScaleImage(string uri)
{
Image grayImage = new Image();
BitmapImage bmpImage = new BitmapImage();
bmpImage.BeginInit();
bmpImage.UriSource = new Uri(uri);
bmpImage.EndInit();
FormatConvertedBitmap grayBitmap = new FormatConvertedBitmap();
grayBitmap.BeginInit();
grayBitmap.Source = bmpImage;
grayBitmap.DestinationFormat = PixelFormats.Gray8;
grayBitmap.EndInit();
grayImage.Source = grayBitmap;
LayoutRoot.Children.Add(grayImage);
}

Answer 1

In both cases, your best bet is to write an IValueConverter.
For instance, here is one for converting your text:
public class StatusToTextConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
int status = Int32.Parse(value.ToString());
switch (status)
{
case 0:
return "Offline";
case 1:
return "Online";
case 2:
return "Just Log";
}
return Binding.DoNothing;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
string status = value.ToString();
switch (status)
{
case "Offline":
return 0;
case "Online":
return 1;
case "Just Log":
return 2;
}
return Binding.DoNothing;
}
}
And your Text binding becomes (after adding the reference in an appropriate Resources section of your XAML):
<TextBlock Name="tbStatus"
Text="{Binding Value.status,
Converter={StaticResource statusToText}}"
Grid.Column="0"
Grid.Row="2"
Margin="2,2,2,2"
FontSize="11"
FontWeight="Normal"></TextBlock>
I'll leave the image converter to you, since this is basic stuff, and it would essentially be a repeat of this code.
Note that this is hard-coding values, which isn't really a Best Practice. You should probably be using enumerations, as well as resources (instead of hard-coded strings) if you ever plan to localize this app.