Change style based on data

Question

Consider below XAML =>

        <fluent:Ribbon x:Name="MenuRibbon"
                       Title="title"
                       SnapsToDevicePixels="True">
        <fluent:RibbonTabItem x:Name="Home"
                                  Header="Home">
            <fluent:RibbonGroupBox Header="Project">
                <fluent:InRibbonGallery MinItemsInRow="3"
                                            MaxItemsInRow="6"
                                            Width="300"
                                            ItemWidth="64"
                                            ItemHeight="56"
                                            ItemsSource="{Binding Projects}">
                    <fluent:InRibbonGallery.ItemTemplate>
                        <DataTemplate>
                            <DockPanel>
                                <Border BorderBrush="{x:Null}"  Height="56">

                                    <TextBlock VerticalAlignment="Center" HorizontalAlignment="Center" DockPanel.Dock="Bottom"
                                               Text="{Binding Name}">
                                    </TextBlock>
                                </Border>
                            </DockPanel>
                        </DataTemplate>
                    </fluent:InRibbonGallery.ItemTemplate>
                </fluent:InRibbonGallery>
            </fluent:RibbonGroupBox>
        </fluent:RibbonTabItem>
    </fluent:Ribbon>

I've bind ObservableColleciton of Projects to InRibbonGallery , And there is an instance of project (ActiveProject) exist in ViewModel.
a TextBlock defined in DataTemplate to display Name of Project object.
How can I change color of TextBlock that contains Active Project ?
ViewModel :

public class ViewModel : ViewModelBase
{
    private ObservableCollection<Project> _projects;

    public ViewModel()
    {
        Projects = new ObservableCollection<Project>(new List<Project>
                                                         {
                                                             new Project {Id = "0", Name = "Project1"},
                                                             new Project {Id = "1", Name = "Project2"},
                                                             new Project {Id = "2", Name = "Project3"}
                                                         });
        Project = Projects[0];
    }

    public ObservableCollection<Project> Projects
    {
        get { return _projects; }
        set
        {
            _projects = value;
            RaisePropertyChanged(() => Projects);
        }
    }

    public Project Project { get; set; }
}

public class Project : ObservableObject
{
    private string _id;
    private string _name;

    public string Name

    {
        get { return _name; }
        set
        {
            _name = value;
            RaisePropertyChanged(() => Name);
        }
    }

    public string Id
    {
        get { return _id; }
        set
        {
            _id = value;
            RaisePropertyChanged(() => Id);
        }
    }
}

Project files located here .

Answer 1

You can do this by using a MultiBinding and a DataTrigger in combination for a better result.

so your xaml would look like:

<Window.Resources>
  <vm:ViewModel x:Key="ViewModel" />
  <vm:ActiveProjectCheckConverter x:Key="ActiveProjectCheckConverter" />
</Window.Resources>
...
<TextBlock HorizontalAlignment="Center"
            VerticalAlignment="Center"
            DockPanel.Dock="Bottom"
            Text="{Binding Name}">
  <TextBlock.Style>
    <Style TargetType="{x:Type TextBlock}">
      <Setter Property="Background"
              Value="Transparent" />
      <Style.Triggers>
        <DataTrigger Value="True">
          <DataTrigger.Binding>
            <MultiBinding Converter="{StaticResource ActiveProjectCheckConverter}">
              <Binding Path="Name" />
              <Binding Path="DataContext.ActiveProject.Name"
                        RelativeSource="{RelativeSource FindAncestor,
                                                        AncestorType={x:Type fluent:InRibbonGallery}}" />
            </MultiBinding>
          </DataTrigger.Binding>
          <Setter Property="Background">
            <Setter.Value>
              <LinearGradientBrush StartPoint="1,0">
                <GradientStop Offset="0.0"
                              Color="#00FFFFFF" />
                <GradientStop Offset="1.1"
                              Color="#FFFFFFFF" />
              </LinearGradientBrush>
            </Setter.Value>
          </Setter>
        </DataTrigger>
      </Style.Triggers>
    </Style>
  </TextBlock.Style>
</TextBlock>

and your converter:

public class ActiveProjectCheckConverter : IMultiValueConverter {
  public object Convert(object[] values, Type targetType, object parameter, CultureInfo culture) {
    string first = values[0] as string;
    string second = values[1] as string;
    return !string.IsNullOrEmpty(first) && !string.IsNullOrEmpty(second) && first == second;
  }

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

Now I did make one more change, your Project object in your ViewModel, if you want changes to that to reflect in the View you need to make that implement INPC itself. So I did update that and also renamed it to ActiveProject

private Project _activeProject;

public Project ActiveProject {
  get {
    return _activeProject;
  }
  set {
    if (value == _activeProject)
      return;
    _activeProject = value;
    RaisePropertyChanged(() => ActiveProject);
  }
}

Update

You can find the above updates at: Dropbox-Link