Telerik Tile Background binding - wpf

Question

I'm trying to bind the background of a Tile in a RadTileList, Tiles are created from a collection on the Itemsource of the RadTileList, so far I've tried changing the background on the border container in the Datatemplate, but it seems that the Tile background property is wining over that.
In the code above , I've tried to set the ItemContainerStyle and set the binding for the background, but nothing changes, I hope someone could help me.
Note: The color of the background is a string var so im using a converter, wich I tested independently
<telerik:RadTileList ItemsSource="{Binding Modulo.Modulos_Detail}" TileReorderMode="None"
ScrollViewer.HorizontalScrollBarVisibility="Visible">
<telerik:RadTileList.ItemContainerStyle>
<Style >
<Setter Property="telerik:Tile.TileType" Value="Quadruple" />
<Setter Property="telerik:Tile.Background" Value="{Binding .Color, Converter={StaticResource strHexColorConverter}}" />
</Style>
</telerik:RadTileList.ItemContainerStyle>
<telerik:RadTileList.ItemTemplate>
<DataTemplate>
<Border >
<Grid>
<Grid.RowDefinitions>
<RowDefinition Height="*" />
<RowDefinition Height="Auto" />
</Grid.RowDefinitions>
<Grid.ColumnDefinitions>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Image Grid.Row="0"
HorizontalAlignment="Stretch" VerticalAlignment="Stretch"
Source="{Binding .Imagenes.Imagen}" Stretch="Uniform"></Image>
<TextBlock Grid.Row="1" Padding="5"
Text="{Binding Descripcion}" FontSize="20" TextWrapping="Wrap"
VerticalAlignment="Bottom"/>
<!--<Image Source="{Binding .LockViewImage, Converter={StaticResource imgBitmapImageConverter}}" />-->
</Grid>
</Border>
</DataTemplate>
</telerik:RadTileList.ItemTemplate>

Answer 1

Create a seperate style with the Tile as target type. Then you only need to set the Background property. Optionally you could give the style a name and set it explicitly on the RadTileList.
<UserControl.Resources>
<ResourceDictionary>
<Style TargetType="telerik:Tile" BasedOn="{StaticResource TileStyle}">
<Setter Property="Background" Value="{StaticResource OmegaMainColorBrush}" />
</Style>
</ResourceDictionary>
</UserControl.Resources>

Answer 2

In my opinion you can use a Boolean Attached property in the telerik:Tile control style. If that property is True then you create the binding in code behind. The only one thing you should care about is that the Content of the Tile will hold the the object that the .Color is defined there.
Here is the code.
Style (put this into the Resource part)
<Style TargetType="telerik:Tile" BasedOn="{StaticResource {x:Type telerik:Tile}}">
<Setter Property="flowConfiguration:TileAttachedProperties.IsTyleTypeBound" Value="True"/>
</Setter>
The attached property code(with converters)
public class TileAttachedProperties
{
public static readonly DependencyProperty IsTyleTypeBoundProperty = DependencyProperty.RegisterAttached(
"IsTyleTypeBound",
typeof (bool),
typeof (TileAttachedProperties),
new PropertyMetadata(default(bool), IsTyleBoundPropertyChangedCallback));
private static void IsTyleBoundPropertyChangedCallback(DependencyObject sender, DependencyPropertyChangedEventArgs args)
{
var tile = sender as Tile;
var isBound = (bool) args.NewValue;
if(tile == null || isBound == false) return;
tile.Loaded += TileOnLoaded;
}
private static void TileOnLoaded(object sender, RoutedEventArgs routedEventArgs)
{
var tile = sender as Tile;
if (tile == null) return;
tile.Loaded -= TileOnLoaded;
var tileContent = tile.Content;
if (tileContent == null || tileContent is ItemTypeWrapper == false) return;
//here we create binding to define if the type of the Tile(single or double)
var tileTypeBinding = new Binding("IsDouble");
tileTypeBinding.Source = tileContent;
tileTypeBinding.UpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged;
tileTypeBinding.Converter = new Bool2TileTypeConverter();
tile.SetBinding(Tile.TileTypeProperty, tileTypeBinding);
//here we create binding to define the background of the tile
var tileBackgroundBinding = new Binding("IsDouble");
tileBackgroundBinding.Source = tileContent;
tileBackgroundBinding.UpdateSourceTrigger = UpdateSourceTrigger.PropertyChanged;
tileBackgroundBinding.Converter = new Bool2BackgroundConverter();
tile.SetBinding(Tile.BackgroundProperty, tileBackgroundBinding);
}
public static void SetIsTyleTypeBound(DependencyObject element, bool value)
{
element.SetValue(IsTyleTypeBoundProperty, value);
}
public static bool GetIsTyleTypeBound(DependencyObject element)
{
return (bool) element.GetValue(IsTyleTypeBoundProperty);
}
}
internal class Bool2BackgroundConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var isDouble = (bool)value;
return isDouble ? new SolidColorBrush(Color.FromArgb(255, 255, 0, 255)) : new SolidColorBrush(Color.FromArgb(255,0, 255, 255));
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
internal class Bool2TileTypeConverter : IValueConverter
{
public object Convert(object value, Type targetType, object parameter, CultureInfo culture)
{
var isDouble = (bool) value;
return isDouble ? TileType.Double : TileType.Single;
}
public object ConvertBack(object value, Type targetType, object parameter, CultureInfo culture)
{
throw new NotImplementedException();
}
}
How it looks like:
Regards,