IsReadOnly Mask Issue

6 posts, 0 answers
  1. crazy05
    crazy05 avatar
    72 posts
    Member since:
    Sep 2014

    Posted 22 Mar Link to this post

    Hello,

    When we make RadCombobox IsReadonly="True", the value inside is not looking good. It masks the value.

    How can we remove the mask or make more transparent to make the value visible more bright ?

    Please guide me,

  2. Masha
    Admin
    Masha avatar
    355 posts

    Posted 23 Mar Link to this post

    Hello Ram,

    Unfortunately, currently, the only possible solution to have different look for IsReadOnly or Disabled state is to set custom style per every control, modify its control template and change the value in its ReadOnly / Disabled visual state.

    I've created a demo project where is demonstrated how to do this for RadComboBox. Please note the project uses implicit styles approach and NoXaml binaries.

    I hope this helps.

    Regards,
    Masha
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  3. UI for WPF is Visual Studio 2017 Ready
  4. crazy05
    crazy05 avatar
    72 posts
    Member since:
    Sep 2014

    Posted 23 Mar in reply to Masha Link to this post

    Hello Masha,

    I downloaded your project and did not see any styles for control template. Can you please post the code here.?

  5. Masha
    Admin
    Masha avatar
    355 posts

    Posted 23 Mar Link to this post

    Hello Ram,

    Can you check inside the Resources folder, the file is called CommonStyles.xaml. Also it is merged in App.xaml file among other resource dictionaries. This way you will keep styles in separated resource dictionaries.

    Please let me know do you find the styles? If you still have problems I'll paste them in this forum post.


    Regards,
    Masha
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
  6. crazy05
    crazy05 avatar
    72 posts
    Member since:
    Sep 2014

    Posted 23 Mar Link to this post

    Hello Masha,

    I checked that and I understand that is the straight forward solution. I am using two themes, Visual Studio and Expression Dark themes and user can change it by their interests. In this case, it wont work I guess.

    I tried to change to bold and fore color but still it is not working because It was masked on top of the control. All I need to do is more transparent for that mask. How can I reduce transparency ?

    It is difficult for me to download the zip files in my office. Can you please keep the solution here ?

  7. Masha
    Admin
    Masha avatar
    355 posts

    Posted 24 Mar Link to this post

    Hello Ram,

    When you switch themes run-time you need to have two separate resource dictionaries with custom styles for each theme and merge the corresponding resource dictionary when the theme is changed. You need to merge resource dictionaries in code behind as follow:

    if (button.Content.ToString() == "VisualStudio2013")
        {
            Application.Current.Resources.MergedDictionaries.Clear();
            VisualStudio2013Palette.LoadPreset(VisualStudio2013Palette.ColorVariation.Dark);
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/Telerik.Windows.Themes.VisualStudio2013;component/Themes/System.Windows.xaml", UriKind.RelativeOrAbsolute)
            });
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/Telerik.Windows.Themes.VisualStudio2013;component/Themes/Telerik.Windows.Controls.xaml", UriKind.RelativeOrAbsolute)
            });
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/Telerik.Windows.Themes.VisualStudio2013;component/Themes/Telerik.Windows.Controls.Input.xaml", UriKind.RelativeOrAbsolute)
            });
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/IsReadOnlyDemoProject;component/Resources/CommonStylesVisualStudio2013.xaml", UriKind.RelativeOrAbsolute)
            });
           
        }
        else
        {
            Application.Current.Resources.MergedDictionaries.Clear();
            
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/Telerik.Windows.Themes.Expression_Dark;component/Themes/System.Windows.xaml", UriKind.RelativeOrAbsolute)
            });
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/Telerik.Windows.Themes.Expression_Dark;component/Themes/Telerik.Windows.Controls.xaml", UriKind.RelativeOrAbsolute)
            });
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/Telerik.Windows.Themes.Expression_Dark;component/Themes/Telerik.Windows.Controls.Input.xaml", UriKind.RelativeOrAbsolute)
            });
            Application.Current.Resources.MergedDictionaries.Add(new ResourceDictionary()
            {
                Source = new Uri("/IsReadOnlyDemoProject;component/Resources/CommonStylesExpressionDark.xaml", UriKind.RelativeOrAbsolute)
            });
        }

    You can find below the  NonEditable and EditableComboBox control template for VisualStudio2013 theme, which you need to place in a separate resource dictionary. Inside it you need play with the VisualState named Disabled in order to modify the transparency of the control. Also you need to apply the desired modification in both resource dictionaries : For ExpressionDark and VisualStudio2103 themes.

    <SolidColorBrush x:Key="DisabledForegroundColor" Color="red" />
     
    <ControlTemplate x:Key="NonEditableComboToggleButtonControlTemplate" TargetType="telerik:RadToggleButton">
        <Grid Background="Transparent">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal"/>
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ToggleButtonBackground" Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=MouseOverBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ToggleButtonBackground" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=AccentBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=MarkerBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Pressed">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ToggleButtonBackground" Storyboard.TargetProperty="Background">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=AccentDarkBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=SelectedBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=SelectedBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownIcon" Storyboard.TargetProperty="Fill">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=BasicBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="ToggleButtonBackground" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=ComplementaryBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
     
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource DisabledForegroundColor}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="Content" Storyboard.TargetProperty="Opacity" To="0.8"/>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Content" Storyboard.TargetProperty="FontWeight">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <FontWeight>Bold</FontWeight>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Unfocused"/>
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="FocusVisual">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="CheckedStates">
                    <VisualState x:Name="Unchecked"/>
                    <VisualState x:Name="Checked">
                        <Storyboard>
                            <DoubleAnimation Duration="0" To="1" Storyboard.TargetProperty="(UIElement.Opacity)" Storyboard.TargetName="ToggleButtonBackgroundChecked"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Indeterminate"/>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Border x:Name="ToggleButtonBackground"
                    Grid.ColumnSpan="2"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Background="{TemplateBinding Background}"/>
            <Border x:Name="ToggleButtonBackgroundChecked"
                    Grid.ColumnSpan="2"
                    Opacity="0"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=AccentBrush}"/>
            <Border x:Name="FocusVisual" Grid.ColumnSpan="2" Visibility="Collapsed" BorderThickness="1" BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=AccentMainBrush}"/>
            <Path x:Name="DropDownIcon"
                    Grid.Column="1"
                    Data="M0,0 L6,0 L3,4 z"
                    Stretch="Fill"
                    Fill="{telerik:VisualStudio2013Resource ResourceKey=StrongBrush}"
                    Width="6"
                    Height="4"
                    Margin="5 0"/>
            <ContentControl x:Name="Content"
                    IsTabStop="False"
                    Grid.Column="0"
                    Foreground="{TemplateBinding Foreground}"
                    Margin="{TemplateBinding Padding}"
                    Content="{TemplateBinding Content}"
                    ContentTemplate="{TemplateBinding ContentTemplate}"
                    HorizontalAlignment="{TemplateBinding HorizontalContentAlignment}"
                    VerticalAlignment="{TemplateBinding VerticalContentAlignment}"/>
        </Grid>
    </ControlTemplate>
    <Style x:Key="NonEditableComboToggleButtonStyle" TargetType="telerik:RadToggleButton">
        <Setter Property="HorizontalContentAlignment" Value="Stretch"/>
        <Setter Property="VerticalContentAlignment" Value="Center"/>
        <Setter Property="IsTabStop" Value="True"/>
        <Setter Property="Template" Value="{StaticResource NonEditableComboToggleButtonControlTemplate}"/>
    </Style>
     
    <ControlTemplate x:Key="EditableComboBox" TargetType="telerik:RadComboBox">
        <Grid x:Name="VisualRoot">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_DropDownButton" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{telerik:VisualStudio2013Resource ResourceKey=ComplementaryBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <!--<DoubleAnimation Duration="0" Storyboard.TargetName="Background" Storyboard.TargetProperty="Opacity" To="0.8"/>-->
                            <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledBorder" Storyboard.TargetProperty="Opacity" To="1"/>
                            <!--<ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{telerik:VisualStudio2013Resource ResourceKey=BasicBrush}"/>
                            </ObjectAnimationUsingKeyFrames>-->
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="Foreground">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{StaticResource DisabledForegroundColor}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="Opacity" To="0.8"/>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_EditableTextBox" Storyboard.TargetProperty="FontWeight">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <FontWeight>Bold</FontWeight>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Normal"/>
                    <VisualState x:Name="MouseOver">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="DropDownOpenBorder" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{telerik:VisualStudio2013Resource ResourceKey=AccentBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_DropDownButton" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0" Value="{telerik:VisualStudio2013Resource ResourceKey=AccentBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="DropDownOpenBorder" Storyboard.TargetProperty="Opacity" To="1"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="DropDownOpen">
                        <Storyboard>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="FocusBorder" Storyboard.TargetProperty="Opacity" To="0"/>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="DropDownOpenBorder" Storyboard.TargetProperty="Opacity" To="1"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="FocusBorder">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unfocused"/>
                </VisualStateGroup>
                <VisualStateGroup x:Name="WatermarkStates">
                    <VisualState x:Name="WatermarkVisible">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="Watermark" Storyboard.TargetProperty="Visibility">
                                <DiscreteObjectKeyFrame KeyTime="0:0:0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="WatermarkInvisible"/>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Grid.ColumnDefinitions>
                <ColumnDefinition Width="*"/>
                <ColumnDefinition Width="Auto"/>
            </Grid.ColumnDefinitions>
            <Border x:Name="Background" Grid.ColumnSpan="2" IsHitTestVisible="False" Background="{TemplateBinding Background}"/>
            <Border x:Name="ReadOnly"
                    Grid.ColumnSpan="2"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    BorderThickness="1"
                    Background="{telerik:VisualStudio2013Resource ResourceKey=AlternativeBrush}"
                    Visibility="{Binding IsReadOnly, RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource BooleanToVisibilityConverter}}"/>
            <Border x:Name="DisabledBorder"
                    Grid.ColumnSpan="2"
                    Opacity="0"
                    IsHitTestVisible="False"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=ComplementaryBrush}"/>
            <TextBox x:Name="PART_EditableTextBox"
                    Grid.Column="0"
                    Margin="1 1 0 1"
                    VerticalAlignment="Stretch"
                    Padding="{TemplateBinding Padding}"
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                    IsReadOnly="{TemplateBinding IsReadOnly}"
                    VerticalContentAlignment="Center"
                    Style="{StaticResource ComboBoxTextBoxStyle}"
                    CaretBrush="#FF808080">
                <TextBox.Template>
                    <ControlTemplate TargetType="TextBox">
                        <Grid>
                            <ScrollViewer
                                    Padding="{TemplateBinding Padding}"
                                    BorderBrush="{TemplateBinding BorderBrush}"
                                    BorderThickness="{TemplateBinding BorderThickness}"
                                    Background="{TemplateBinding Background}"
                                    IsTabStop="False"
                                    VerticalScrollBarVisibility="Auto"
                                    x:Name="PART_ContentHost"
                                    VerticalContentAlignment="Stretch"/>
                        </Grid>
                    </ControlTemplate>
                </TextBox.Template>
            </TextBox>
            <telerik:RadToggleButton x:Name="PART_DropDownButton"
                    Grid.Column="1"
                    IsTabStop="False"
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                    Style="{StaticResource EditableComboToggleButtonStyle}"
                    Background="{Binding Background, ElementName=PART_EditableTextBox}"/>
            <Border x:Name="Border" Grid.ColumnSpan="2" IsHitTestVisible="False" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}"/>
            <Border x:Name="DropDownOpenBorder"
                    Grid.ColumnSpan="2"
                    IsHitTestVisible="False"
                    BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=AccentMainBrush}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Opacity="0"/>
            <Border x:Name="FocusBorder"
                    Visibility="Collapsed"
                    Grid.ColumnSpan="2"
                    IsHitTestVisible="False"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=AccentMainBrush}"/>
            <TextBlock x:Name="Watermark"
                    Text="{TemplateBinding EmptyText}"
                    IsHitTestVisible="False"
                    Padding="{TemplateBinding Padding}"
                    VerticalAlignment="Center"
                    HorizontalAlignment="Left"
                    Visibility="Collapsed"
                    Margin="4 0 0 0"
                    Foreground="{telerik:VisualStudio2013Resource ResourceKey=StrongBrush}"/>
            <Popup x:Name="PART_Popup" VerticalOffset="0">
                <Grid x:Name="PopupRoot">
                    <Grid Opacity="0.3">
                        <Rectangle Margin="1 1 -1 -1" Opacity="0.05" Stroke="Black" StrokeThickness="1" RadiusX="4" RadiusY="3"/>
                        <Rectangle Margin="1 1 0 0" Opacity="0.1" Stroke="Black" StrokeThickness="1" RadiusX="3" RadiusY="2"/>
                        <Rectangle Margin="2 2 1 1" Fill="Black" RadiusX="2" RadiusY="1" Opacity="0.3" StrokeThickness="1"/>
                    </Grid>
                    <Border
                            BorderThickness="{TemplateBinding BorderThickness}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            MinWidth="{TemplateBinding MinDropDownWidth}"
                            MaxHeight="{TemplateBinding MaxDropDownHeight}"
                            x:Name="PART_ResizeBorder"
                            Background="{telerik:VisualStudio2013Resource ResourceKey=AlternativeBrush}"
                            Margin="0 0 2 2">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <telerik:RadButton x:Name="PART_ClearButton"
                                    Grid.Row="0"
                                    Margin="-1 -1 -1 0"
                                    FontSize="{TemplateBinding FontSize}"
                                    FontFamily="{TemplateBinding FontFamily}"
                                    Visibility="{TemplateBinding ClearSelectionButtonVisibility}"
                                    Content="{TemplateBinding ClearSelectionButtonContent}"/>
                            <ScrollViewer x:Name="PART_ScrollViewer"
                                    Grid.Row="1"
                                    BorderThickness="0"
                                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                    Foreground="{TemplateBinding Foreground}"
                                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                    CanContentScroll="{TemplateBinding ScrollViewer.CanContentScroll}"
                                    Padding="0 1 0 0">
                                <ItemsPresenter/>
                            </ScrollViewer>
                        </Grid>
                    </Border>
                </Grid>
            </Popup>
        </Grid>
    </ControlTemplate>
    <ControlTemplate x:Key="NonEditableComboBox" TargetType="telerik:RadComboBox">
        <Grid x:Name="VisualRoot">
            <VisualStateManager.VisualStateGroups>
                <VisualStateGroup x:Name="CommonStates">
                    <VisualState x:Name="Normal"/>
                    <VisualState x:Name="MouseOver"/>
                    <VisualState x:Name="Disabled">
                        <Storyboard>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="BackgroundBorder" Storyboard.TargetProperty="Opacity" To="0"/>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="DisabledBorder" Storyboard.TargetProperty="Opacity" To="1"/>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="DropDownOpen">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="PART_DropDownButton" Storyboard.TargetProperty="BorderThickness" Duration="0">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Thickness>1</Thickness>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetName="FocusBorder" Storyboard.TargetProperty="BorderBrush">
                                <DiscreteObjectKeyFrame KeyTime="0" Value="{telerik:VisualStudio2013Resource ResourceKey=AccentDarkBrush}"/>
                            </ObjectAnimationUsingKeyFrames>
                            <DoubleAnimation Duration="0" Storyboard.TargetName="FocusBorder" Storyboard.TargetProperty="Opacity" To="1"/>
                        </Storyboard>
                    </VisualState>
                </VisualStateGroup>
                <VisualStateGroup x:Name="FocusStates">
                    <VisualState x:Name="Focused">
                        <Storyboard>
                            <ObjectAnimationUsingKeyFrames Storyboard.TargetProperty="(UIElement.Visibility)" Storyboard.TargetName="FocusBorder">
                                <DiscreteObjectKeyFrame KeyTime="0">
                                    <DiscreteObjectKeyFrame.Value>
                                        <Visibility>Visible</Visibility>
                                    </DiscreteObjectKeyFrame.Value>
                                </DiscreteObjectKeyFrame>
                            </ObjectAnimationUsingKeyFrames>
                        </Storyboard>
                    </VisualState>
                    <VisualState x:Name="Unfocused"/>
                </VisualStateGroup>
            </VisualStateManager.VisualStateGroups>
            <Border x:Name="BackgroundBorder" IsHitTestVisible="False" Background="{TemplateBinding Background}"/>
            <Border x:Name="DisabledBorder" IsHitTestVisible="False" Opacity="0" Background="{telerik:VisualStudio2013Resource ResourceKey=AlternativeBrush}"/>
            <telerik:RadToggleButton x:Name="PART_DropDownButton"
                    IsTabStop="False"
                    Padding="{TemplateBinding Padding}"
                    Content="{TemplateBinding SelectionBoxItem}"
                    ContentTemplate="{TemplateBinding SelectionBoxItemTemplate}"
                    VerticalContentAlignment="{TemplateBinding VerticalContentAlignment}"
                    HorizontalContentAlignment="{TemplateBinding HorizontalContentAlignment}"
                    Style="{StaticResource NonEditableComboToggleButtonStyle}"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    BorderBrush="{TemplateBinding BorderBrush}"
                    Background="{x:Null}"
                    FontFamily="{TemplateBinding FontFamily}"
                    FontSize="{TemplateBinding FontSize}"/>
            <Border x:Name="FocusBorder"
                    IsHitTestVisible="False"
                    BorderThickness="{TemplateBinding BorderThickness}"
                    Visibility="Collapsed"
                    Background="Transparent"
                    BorderBrush="{telerik:VisualStudio2013Resource ResourceKey=AccentMainBrush}"/>
            <Popup x:Name="PART_Popup" VerticalOffset="0">
                <Grid x:Name="PopupRoot">
                    <Grid Opacity="0.3">
                        <Rectangle Margin="1 1 -1 -1" Opacity="0.05" Stroke="Black" StrokeThickness="1" RadiusX="4" RadiusY="3"/>
                        <Rectangle Margin="1 1 0 0" Opacity="0.1" Stroke="Black" StrokeThickness="1" RadiusX="3" RadiusY="2"/>
                        <Rectangle Margin="2 2 1 1" Fill="Black" RadiusX="2" RadiusY="1" Opacity="0.3" StrokeThickness="1"/>
                    </Grid>
                    <Border
                            BorderThickness="{TemplateBinding BorderThickness}"
                            BorderBrush="{TemplateBinding BorderBrush}"
                            MinWidth="{TemplateBinding MinDropDownWidth}"
                            MaxHeight="{TemplateBinding MaxDropDownHeight}"
                            x:Name="PART_ResizeBorder"
                            Margin="0 0 2 2"
                            Background="{telerik:VisualStudio2013Resource ResourceKey=AlternativeBrush}">
                        <Grid>
                            <Grid.RowDefinitions>
                                <RowDefinition Height="Auto"/>
                                <RowDefinition Height="*"/>
                            </Grid.RowDefinitions>
                            <telerik:RadButton x:Name="PART_ClearButton"
                                    Grid.Row="0"
                                    Margin="-1 -1 -1 0"
                                    FontSize="{TemplateBinding FontSize}"
                                    FontFamily="{TemplateBinding FontFamily}"
                                    Visibility="{TemplateBinding ClearSelectionButtonVisibility}"
                                    Content="{TemplateBinding ClearSelectionButtonContent}"/>
                            <ScrollViewer x:Name="PART_ScrollViewer"
                                    Grid.Row="1"
                                    BorderThickness="0"
                                    VerticalScrollBarVisibility="{TemplateBinding ScrollViewer.VerticalScrollBarVisibility}"
                                    HorizontalScrollBarVisibility="{TemplateBinding ScrollViewer.HorizontalScrollBarVisibility}"
                                    Foreground="{TemplateBinding Foreground}"
                                    CanContentScroll="{TemplateBinding ScrollViewer.CanContentScroll}"
                                    Padding="0 1 0 0">
                                <ItemsPresenter/>
                            </ScrollViewer>
                        </Grid>
                    </Border>
                </Grid>
            </Popup>
        </Grid>
    </ControlTemplate>
     
    <Style TargetType="telerik:RadComboBox" BasedOn="{StaticResource RadComboBoxStyle}">
        <Setter Property="EditableTemplate" Value="{StaticResource EditableComboBox}"/>
        <Setter Property="NonEditableTemplate" Value="{StaticResource NonEditableComboBox}"/>
    </Style>

    I hope it helps.

    Regards,
    Masha
    Telerik
    Do you need help with upgrading your AJAX, WPF or WinForms project? Check the Telerik API Analyzer and share your thoughts.
Back to Top
UI for WPF is Visual Studio 2017 Ready