开发者

How to change the color of the object based on binding value in Silverlight?

I need to change border background color based of the textblock text string value from the binding. I planned to use triggers but it is not supported in Silverlight. I am looking for any advice on how it is achievable in Silverlight. Thank you in advance!

XAML:

<data:DataGridTemplateColumn Header="Y Position" Width="100">
                <data:DataGridTemplateColumn.CellTemplate>
                    <DataTemplate>
                        <StackPanel Orientation="Horizontal">
                            <Border Background="Red" Width="10" Height="18" VerticalAlignment="Center" Margin="0,0,10,0" />
                            <TextBlock Text="{Binding Y}" VerticalAlignment="Center" />
                        </StackPanel>
                    </DataTemplate>
                </data:DataGridTemplateColumn.CellTemplate>
            </data:DataGridTemplateColumn>

ViewModel code:

public class MainPage_ViewModel : INotifyPropertyChanged 
{
    public 
    public MainPage_ViewModel()
    {
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 1, Y = 2 }));         
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 2, Y = 4 }));         
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 3, Y = 6 }));         
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 4, Y = 8 }));         
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 5, Y = 10 }));         
        coordinates.Add(new Coordinate_DataViewModel(new Coordinate_Model() { X = 6, Y = 12 }));
    }

    public ObservableCollection<Coordinate_DataViewModel> Coordinates     
    {         
        get { return coordinates; }         
        set          
        {             
            开发者_运维百科if (coordinates != value)             
            {                 
                coordinates = value;                 
                OnPropertyChanged("Coordinates");             
            }         
        }     
    }     
    private ObservableCollection<Coordinate_DataViewModel> coordinates = new ObservableCollection<Coordinate_DataViewModel>();      
    public event PropertyChangedEventHandler PropertyChanged;      

    public void OnPropertyChanged(string propertyName)     
    {         
        if (PropertyChanged != null)         
        {             
            PropertyChanged(this, new PropertyChangedEventArgs(propertyName));         
        }     
    }      

    public void DeleteCoordinate(Coordinate_DataViewModel dvmToDelete)     
    {         
        coordinates.Remove(dvmToDelete);     
    }

    public void UpdateCoordinate(Coordinate_DataViewModel dvmToDelete)
    {

    }
}

//Model
public class Coordinate_Model 
{     
    public double X;     
    public double Y; 
} 

//DataViewModel
public class Coordinate_DataViewModel 
{     
    public Coordinate_DataViewModel(Coordinate_Model model)     
    {         
        this.underlyingModel = model;     
    }     

    private Coordinate_Model underlyingModel;      
    public double X     
    {         
        get { return underlyingModel.X; }         
        set { underlyingModel.X = value; }     
    }      

    public double Y     
    {         
        get { return underlyingModel.Y; }         
        set { underlyingModel.Y = value; }     
    }      public string XYCoordinate     

    {         
        get { return "(" + X + "," + Y + ")"; }     
    } 
} 


I'm not really a fan of putting colors inside your viewmodel. In my opinion it is best to use a converter then like so:

public class CoordinateToColorConverter : IValueConverter
{
    #region IValueConverter Members

    public object Convert(object value, Type targetType, object parameter,
        System.Globalization.CultureInfo culture)
    {
        return new SolidColorBrush((int) value == 2 ? Colors.Red : Colors.Black);
    }

    public object ConvertBack(object value, Type targetType, object parameter,
        System.Globalization.CultureInfo culture)
    {
        throw new NotSupportedException();
    }

    #endregion
}

you can then define your binding like this:

                    <Border Background="{Binding Y, Converter={StaticResource CoordinateToColorConverter}}" Width="10" Height="18" VerticalAlignment="Center" Margin="0,0,10,0" />


I was having this discussion with someone else recently. I personally used the technique Luc Bos provided but there is another technique: RYODTS or Roll Your Own DataTemplateSelector.

This can be done with relative little effort. An example can be found on CodeProject.


if you're using an MVVM development model, then you would do something like:

<Border Background="{Binding BackgroundColor}" ...

...and create a Property in your ViewModel which provides the color brush you want. Then, all the decision logic about that border color can reside next to your data.

public double Y     
    {         
        get { return underlyingModel.Y; }         
        set { underlyingModel.Y = value; 
              // here, test underlyingModel.Y, and 
              // set backgroundColor private property, and 
              // raise the PropertyChanged event on "BackgroundColor" 
            }     
    }     

private Brush backgroundColor;
public Brush BackgroundColor { 
        get { return backgroundColor; }
        set { // whatever you want to do here, probably just  
              backgroundColor=value; 
              OnPropertyChanged("BackgroundColor")};
            }
        }
0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜