Windows Phone 8: LongListMultiSelector динамическая группа Header Color

Question

В настоящее время я использую LongListMultiSelector из WPToolkit, и я пытаюсь изменить цвет каждого GroupHeader в зависимости от ключа GroupHeader (имя отображается).

В настоящее время в моем списке показаны товары, сгруппированные по рыночным именам, например: Target и Wal-mart.

Я использую этот шаблон заголовка

        <!--GroupHeaderTemplate-->
    <DataTemplate x:Key="GroupHeaderTemplate">
        <Border Background="Transparent" Margin="0,0,0,10">
            <StackPanel Background="Transparent" HorizontalAlignment="Stretch">
                <TextBlock Text="{Binding Key}" Foreground="#FF1B3A70" FontSize="48"  FontFamily="{StaticResource PhoneFontFamilySemiLight}" HorizontalAlignment="Left" VerticalAlignment="Top"/>
                <Rectangle Fill="{Binding HeaderColor}" Height="3"/><!--Fill="#FF5876AA"-->
            </StackPanel>
        </Border>
    </DataTemplate>

и что я хочу сделать, это изменить цвет заливки прямоугольника и цвет переднего плана.

Например, у Wal-mart может быть синий прямоугольник, а у Target - красный.

Заранее спасибо!

Answer 1

Создайте конвертер значений, возвращающий цвет по заданному ключу заголовка группы. Свяжите свойства Rectangle Fill и TextBlock Foreground с "Ключом" и используйте конвертер. Там будет что-то вроде:

<DataTemplate x:Key="GroupHeaderTemplate">
    <Border Background="Transparent" Margin="0,0,0,10">
        <StackPanel Background="Transparent" HorizontalAlignment="Stretch">
            <TextBlock Text="{Binding Key}" Foreground="{Binding Key, Converter={StaticResource MY_FOREGROUND_CONVERTER}}" FontSize="48"  FontFamily="{StaticResource PhoneFontFamilySemiLight}" HorizontalAlignment="Left" VerticalAlignment="Top"/>
            <Rectangle Fill="{Binding Key, Converter={StaticResource MY_FILL_CONVERTER}}" Height="3"/>
        </StackPanel>
    </Border>
</DataTemplate>