WP7：更改轉換器的邊框背景

Question

我正在用轉換器瘋狂。我知道在必要時我必須用它來改變我的價值觀的「退出價值」，但我不知道如何正確使用我的案例。

我有我的簡單MVVM（僅限3個字段）和我的主窗口以及我的項目列表。第一項是根據函數計算的，可以顯示YES或NOT，其他值直接綁定。

這是行之有效的，但我需要改變背景和前景顏色取決於我在第一個計算字段中的YES或NOT值。例如：

YES (must be blue) - ITEM 1 
NO (must be grey) - ITEM 2 
YES (must be blue) - ITEM 3 

雖然在我的數據庫內的值是（在這種情況下，計算的是彈性模量）：

2 - ITEM 1 
3 - ITEM 2 
4 - ITEM 3 

我的列表框碼是這樣的：

<phone:PhoneApplicationPage 
x:Class="Pasti.MainPage" 
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
xmlns:phone="clr-namespace:Microsoft.Phone.Controls;assembly=Microsoft.Phone" 
xmlns:shell="clr-namespace:Microsoft.Phone.Shell;assembly=Microsoft.Phone" 
xmlns:d="http://schemas.microsoft.com/expression/blend/2008" 
xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006" 
mc:Ignorable="d" d:DesignWidth="480" d:DesignHeight="768" 
FontFamily="{StaticResource PhoneFontFamilyNormal}" 
FontSize="{StaticResource PhoneFontSizeNormal}" 
Foreground="{StaticResource PhoneForegroundBrush}" 
SupportedOrientations="Portrait" Orientation="Portrait" 
shell:SystemTray.IsVisible="True"> 

<Grid x:Name="LayoutRoot" Background="Transparent"> 
    <Grid.RowDefinitions> 
     <RowDefinition Height="Auto"/> 
     <RowDefinition Height="*"/> 
    </Grid.RowDefinitions> 

    <StackPanel x:Name="TitlePanel" Grid.Row="0" Margin="12,17,0,28"> 
     <TextBlock Text="My App" Style="{StaticResource PhoneTextNormalStyle}" /> 
     <TextBlock Text="My List" Style="{StaticResource PhoneTextTitle1Style}" /> 
    </StackPanel> 

<ListBox x:Name="lstPills" Grid.Row="1" ItemsSource="{Binding AllItems}"> 
    <ListBox.ItemTemplate> 
     <DataTemplate> 
      <Grid HorizontalAlignment="Stretch" Width="440"> 
       <Grid.ColumnDefinitions> 
        <ColumnDefinition Width="90" /> 
        <ColumnDefinition Width="*" /> 
       </Grid.ColumnDefinitions> 
       <Border Background="HERE MUST GO THE CONVERTER, I SUPOSE"> 
        <TextBlock Text="{Binding IsPair, Mode=TwoWay}"/> 
       </Border> 
       <TextBlock 
        Text="{Binding Name}" 
        FontSize="{StaticResource PhoneFontSizeLarge}" 
        Grid.Column="1" 
        VerticalAlignment="Center"/> 
      </Grid> 
     </DataTemplate> 
    </ListBox.ItemTemplate> 
</ListBox> 
</Grid> 
</phone:PhoneApplicationPage> 

而本頁的CS代碼爲：

public partial class MainPage : PhoneApplicationPage 
{ 
    // Constructor 
    public MainPage() 
    { 
     InitializeComponent(); 

     // Set the page DataContext property to the ViewModel. 
     this.DataContext = App.ViewModel; 
    } 
} 

計算出的字段，我已將此添加到模型（_myNumber認爲我必須檢查值）：

// Define a custom field based on some database values 
    // Get is calculated, while set will force it to refresh by Notifying 
    public string IsPair 
    { 
     get 
     { 
      return _myNumber % 2 == 0 ? "YES" : "NO"; 
     } 
     set 
     { 
      NotifyPropertyChanged("IsPair"); 
     } 
    } 

注：因爲我不知道其他的方式來強制列表刷新，我把一套屬性只能通知和雙向模式，而我只是在我想重新計算時做一個IsPair = ""。如果還有其他方法可以做到這一點，將會受到歡迎。

所以，有了這個信息，我怎麼能做一個轉換器，基於我的IsPair值，將邊框的Background屬性設置爲藍色或灰色？我看到很多的轉換器例子，但仍然沒有明確指出這一點。

我想我必須把這樣的事情在MainPage.cs，下MainPage類：

// Converter for the YES-NO column on the list 
public class IsPairConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     if (MY_CALCULATED_VALUE == "YES") 
      return "Blue"; 

     return "Grey"; 
    } 

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

但如何讓MY_CALCULATED_VALUE，以及如何設置轉換器在邊境的Background值？

Answer 1

太近了！

首先，結合後臺IsPair和使用轉換器：

<Border Background="{Binding IsPair, Converter={StaticResource IsPairConverter}}"> 
    <TextBlock Text="{Binding IsPair, Mode=TwoWay}"/> 
</Border> 

在你的轉換器，創建取決於值刷：

public class IsPairConverter : IValueConverter 
{ 
    public object Convert(object value, Type targetType, object parameter, CultureInfo culture) 
    { 
     // You might want to add additional checks for type safety 
     var calculatedValue = (string)value; 

     var color = calculatedValue == "YES" ? Colors.Blue : Colors.Gray; 

     return new SolidColorBrush { Color = color }; 
    } 

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

大功告成。

---

如果要計算值只有一次，而不是每IsPair被調用時，你可以計算在MyNumber二傳手並將其分配給IsPair：

private int myNumber; 

public string IsPair { get; protected set; } 

protected int MyNumber 
{ 
    get 
    { 
     return this.myNumber; 
    } 

    set 
    { 
     this.myNumber = value; 
     this.IsPair = value % 2 == 0 ? "YES" : "NO"; 
     this.NotifyPropertyChanged("IsPair"); 
    } 
}