Background for ComboBox

[Chris]

As you can tell I'm a SilverLight n00b. On your combo box the client wants the majority of the combo box to be white while the arrow section to initiate the drop down to be gray. Much like a regular HTML combo box. Here's a screenshot.

http://img5.imageshack.us/img5/6200/1142011110505am.png

We already have an existing them in place so I need to find out which properties I need to change to get this to work.

[Dani]

Hi Chris,

Please, find a attached a sample project with a modified RadComboBox. The resources which you need to change for the background and drop down icon are the following:

<SolidColorBrush x:Key="ButtonIconBackground_Normal" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="ButtonIconForeground_Normal" Color="#FF000000"/>
<ControlTemplate x:Key="ArrowTemplateNonEditableCombobox" TargetType="ContentControl">
            <Grid Margin="5 0">
                <Path x:Name="BackgroundIcon" Data="M0,0 L2,0 1,1 Z" Fill="{TemplateBinding Background}" Height="3" Margin="0 2 0 0" Stretch="Fill" Width="5"/>
                <Path x:Name="ForegroundIcon" Data="M0,0 L2,0 1,1 Z" Fill="{TemplateBinding Foreground}" Height="3" Margin="0 1 0 1" Stretch="Fill" Width="5"/>
            </Grid>
</ControlTemplate>
<SolidColorBrush x:Key="PickerPopupBackground" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="ButtonIconForeground_Disabled" Color="#FF8D8D8D"/>
<SolidColorBrush x:Key="ButtonIconBackground_Disabled" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="ButtonIconForeground_MouseOver" Color="#FF000000"/>
<SolidColorBrush x:Key="ButtonIconBackground_MouseOver" Color="#FFFFFFFF"/>
<SolidColorBrush x:Key="ButtonIconForeground_Pressed" Color="#FF000000"/>
<SolidColorBrush x:Key="ButtonIconBackground_Pressed" Color="#FFFFFFFF"/>
<LinearGradientBrush x:Key="ControlBackground_Normal" EndPoint="0.5,1" StartPoint="0.5,0">
            <GradientStop Color="#FFFFFFFF" Offset="0"/>
            <GradientStop Color="#FFDCDCDC" Offset="0.50"/>
            <GradientStop Color="#FFADADAD" Offset="0.50"/>
            <GradientStop Color="#FFD4D4D4" Offset="1"/>
</LinearGradientBrush>

You can experiement with these to accomplish the desired design.
What you need to keep in mind is that RadComboBox relies on a ButtonChrome for the brushes of all its states. That is why you will notice a ButtonChromeStyle alongside the RadComboBox style in the attached sample. The sample uses Blend generated XAML - you can easily work with it in Blend and find and modify resources in the Resources tab.

I hope this will help you customize RadComboBox as you wish.


Regards,
Dani
the Telerik team

[Boyan]

Hello Chris,

I believe you want the ComboBox to look like in this example: http://demos.telerik.com/silverlight/#ComboBox/Configurator. In order to do this you need to set its IsEnabled property to true.

Don't hesitate to contact us if you have other questions.

All the best,
Boyan
the Telerik team

[Chris]

Thanks for the help!