I want to do the following behavior in my program.
I have a GridView and below form, which is still visible. I need to change the background when the form gets focus. Standard background is gray, and if form get the focus to look the same(background) as the selected row in the DataGrid. It is not difficult, but if I change the main theme from SummerTheme to Office_SilverTheme, I have a complicated background to change.
My query is as follows.
Can I use this
<Setter Property="Background" Value="StaticResource GridViewRowSelectedBackground}" />
And call value in TelericTheme.
If I change the StyleManager.ApplicationTheme in the future, I will get right background.
Thank you for the tip.
My definition style in Themes/Generic.xaml
<
LinearGradientBrush
x:Key
=
"GridViewRowSelectedBackground"
EndPoint
=
"0.5,1"
StartPoint
=
"0.5,0"
>
<
GradientStop
Color
=
"#FFFFCA5D"
Offset
=
"1"
/>
<
GradientStop
Color
=
"#FFFFDC9C"
Offset
=
"0"
/>
</
LinearGradientBrush
>
<
Style
x:Key
=
"Form_Style"
TargetType
=
"Border"
>
<
Setter
Property
=
"BorderBrush"
Value
=
"White"
/>
<
Setter
Property
=
"BorderThickness"
Value
=
"2"
/>
<
Setter
Property
=
"Padding"
Value
=
"1"
/>
<
Setter
Property
=
"Margin"
Value
=
"1"
/>
<
Setter
Property
=
"CornerRadius"
Value
=
"5"
/>
<
Setter
Property
=
"Background"
Value
=
"{StaticResource Form_Background}"
/>
<
Style.Triggers
>
<
Trigger
Property
=
"IsKeyboardFocusWithin"
Value
=
"True"
>
<
Setter
Property
=
"Background"
Value
=
"{StaticResource GridViewRowSelectedBackground}"
/>
</
Trigger
>
</
Style.Triggers
>
</
Style
>
10 Answers, 1 is accepted
Thank you for contacting us!
May you please elaborate a little bit more on your scenario? Are you creating your custom theme based on the existing one or maybe I am missing something? I believe that the best option is to send us a small repro application in a new support ticket where we can see your exact project settings. Thus we would be able to provide you with an appropriate solution.
Vanya Pavlova
the Telerik team
The problem is that, i would like to use telerik backroud color from telerik theme with key GridViewRowSelectedBackground in my custom control.
I unzip "RadControls_for_WPF_2011_1_0315_Source.zip"
and in folder "Controls\GridView\GridView\themes\Office\Office_Blue\" is file "Resources.xaml"
In the file is definition for
<!--<LinearGradientBrush x:Key="GridViewRowSelectedBackground" EndPoint="0.5,1" StartPoint="0.5,0">
<GradientStop Color="#FFFFCA5D" Offset="1"/>
<GradientStop Color="#FFFFDC9C" Offset="0"/>
</LinearGradientBrush>--> "
My question is: May I us this key as StaticResource in my code.
This source is used Telerik in Selected Row In datagrid. If i use this key, I always use the correct background i my form.
If I use
StyleManager.ApplicationTheme = new SummerTheme();
or
StyleManager.ApplicationTheme = new Office_BlueTheme();
in my form will always be used background that uses Telerik in active row in the DataGrid.
This is maximum in my english language :)
Radek Bastinec
The resources used in any telerik theme are Theme specific. When you edit a template of any RadGridView's part you get the resources for Office_Black theme, which is the default one. Each time you edit any template it is against the default theme and it uses the default resources. If you need to change a particular brush in any other theme you need to copy the resources relative to this theme and finally apply this theme.
Let me try to explain this with an example:
You need to change the brush named GridViewBackground_Selected, which paints the background of the selected GridViewRow in Office_Silver theme, this background should use the specific color used in Office_Blue theme.
1. Edit the template of GridViewRow (mark the style either as implicit or explicit).
2. Change the default resources it uses to those specific for Office_Silver theme (you may get the theme specific style and its resources from the Themes folder of your personal installation package).
3. Copy only the brush named GridViewBackground_Selected for Office_Silver theme to the desired used in Office_Blue theme in an appropriate manner.
Please give it a try and let me know how it goes.
Vanya Pavlova
the Telerik team
<
ControlTemplate
x:Key
=
"DataPagerPresenterTemplate"
TargetType
=
"Telerik_Windows_Controls_Data_DataPager:DataPagerPresenter"
>
<
Border
BorderBrush
=
"{TemplateBinding BorderBrush}"
BorderThickness
=
"{TemplateBinding BorderThickness}"
Background
=
"{TemplateBinding Background}"
>
<
Grid
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
>
<
Grid.ColumnDefinitions
>
<
ColumnDefinition
Width
=
"*"
/>
<
ColumnDefinition
Width
=
"Auto"
/>
</
Grid.ColumnDefinitions
>
<
StackPanel
HorizontalAlignment
=
"{TemplateBinding HorizontalContentAlignment}"
Orientation
=
"Horizontal"
VerticalAlignment
=
"{TemplateBinding VerticalContentAlignment}"
>
<
telerik:RadButton
x:Name
=
"MoveToFirstPageButton"
Command
=
"telerik:RadDataPagerCommands.MoveToFirstPage"
Height
=
"18"
Margin
=
"2"
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
Visibility
=
"{Binding PagerControlsVisibility.MoveToFirstPageControlVisibility, RelativeSource={RelativeSource TemplatedParent}}"
Width
=
"18"
>
<
StackPanel
Orientation
=
"Horizontal"
>
<
Rectangle
Fill
=
"{StaticResource RadPager_Indicator}"
HorizontalAlignment
=
"Center"
Height
=
"7"
VerticalAlignment
=
"Center"
Width
=
"1"
/>
<
Path
Data
=
"M0,0 L3.5,3.5 0,7 Z"
Fill
=
"{StaticResource RadPager_Indicator}"
HorizontalAlignment
=
"Center"
Height
=
"7"
RenderTransformOrigin
=
"0.5, 0.5"
VerticalAlignment
=
"Center"
Width
=
"4"
>
<
Path.RenderTransform
>
<
TransformGroup
>
<
ScaleTransform
ScaleY
=
"1"
ScaleX
=
"-1"
/>
<
SkewTransform
AngleY
=
"0"
AngleX
=
"0"
/>
<
RotateTransform
Angle
=
"0"
/>
<
TranslateTransform
/>
</
TransformGroup
>
</
Path.RenderTransform
>
</
Path
>
</
StackPanel
>
</
telerik:RadButton
>
<
telerik:RadButton
x:Name
=
"MoveToPreviousPageButton"
Command
=
"telerik:RadDataPagerCommands.MoveToPreviousPage"
Height
=
"18"
Margin
=
"2"
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
Visibility
=
"{Binding PagerControlsVisibility.MoveToPreviousPageControlVisibility, RelativeSource={RelativeSource TemplatedParent}}"
Width
=
"18"
>
<
Path
Data
=
"M0,0 L3.5,3.5 0,7 Z"
Fill
=
"{StaticResource RadPager_Indicator}"
HorizontalAlignment
=
"Center"
Height
=
"7"
RenderTransformOrigin
=
"0.5, 0.5"
VerticalAlignment
=
"Center"
Width
=
"4"
>
<
Path.RenderTransform
>
<
TransformGroup
>
<
ScaleTransform
ScaleY
=
"1"
ScaleX
=
"-1"
/>
<
SkewTransform
AngleY
=
"0"
AngleX
=
"0"
/>
<
RotateTransform
Angle
=
"0"
/>
<
TranslateTransform
/>
</
TransformGroup
>
</
Path.RenderTransform
>
</
Path
>
</
telerik:RadButton
>
<
Border
BorderBrush
=
"{StaticResource RadPager_NumericPresenter_Border}"
BorderThickness
=
"1,0,0,0"
Background
=
"{StaticResource RadPager_NumericPresenter_Background}"
Height
=
"20"
Visibility
=
"{Binding PagerControlsVisibility.NumericElementsControlVisibility, RelativeSource={RelativeSource TemplatedParent}}"
VerticalAlignment
=
"Center"
>
<
Telerik_Windows_Controls_Data_DataPager:NumericElementsPresenter
AutoEllipsisMode
=
"{TemplateBinding AutoEllipsisMode}"
NumericButtonStyle
=
"{TemplateBinding NumericButtonStyle}"
NumericButtonCount
=
"{TemplateBinding NumericButtonCount}"
PageCount
=
"{TemplateBinding PageCount}"
PageIndex
=
"{TemplateBinding PageIndex}"
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
/>
</
Border
>
<
telerik:RadButton
x:Name
=
"MoveToNextPageButton"
Command
=
"telerik:RadDataPagerCommands.MoveToNextPage"
Height
=
"18"
Margin
=
"2"
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
Visibility
=
"{Binding PagerControlsVisibility.MoveToNextPageControlVisibility, RelativeSource={RelativeSource TemplatedParent}}"
Width
=
"18"
>
<
Path
Data
=
"M0,0 L3.5,3.5 0,7 Z"
Fill
=
"{StaticResource RadPager_Indicator}"
HorizontalAlignment
=
"Center"
Height
=
"7"
VerticalAlignment
=
"Center"
Width
=
"4"
/>
</
telerik:RadButton
>
<
telerik:RadButton
x:Name
=
"MoveToLastPageButton"
Command
=
"telerik:RadDataPagerCommands.MoveToLastPage"
Height
=
"18"
Margin
=
"2"
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
Visibility
=
"{Binding PagerControlsVisibility.MoveToLastPageControlVisibility, RelativeSource={RelativeSource TemplatedParent}}"
Width
=
"18"
>
<
StackPanel
Orientation
=
"Horizontal"
>
<
Path
Data
=
"M0,0 L3.5,3.5 0,7 Z"
Fill
=
"{StaticResource RadPager_Indicator}"
HorizontalAlignment
=
"Center"
Height
=
"7"
VerticalAlignment
=
"Center"
Width
=
"4"
/>
<
Rectangle
Fill
=
"{StaticResource RadPager_Indicator}"
HorizontalAlignment
=
"Center"
Height
=
"7"
VerticalAlignment
=
"Center"
Width
=
"1"
/>
</
StackPanel
>
</
telerik:RadButton
>
</
StackPanel
>
<
StackPanel
Grid.Column
=
"1"
Margin
=
"5,0"
Orientation
=
"Horizontal"
Visibility
=
"{Binding PagerControlsVisibility.TextControlVisibility, RelativeSource={RelativeSource TemplatedParent}}"
>
<
telerik:RadComboBox
ItemsSource
=
"{Binding RelativeSource={RelativeSource TemplatedParent}, Converter={StaticResource countConverter}}"
SelectedValue
=
"{Binding PageSize, RelativeSource={RelativeSource TemplatedParent}, Mode=TwoWay}"
x:Name
=
"radComboBox"
>
</
telerik:RadComboBox
>
<
Border
Background
=
"{StaticResource RadPager_Separator1}"
HorizontalAlignment
=
"Left"
Height
=
"18"
Margin
=
"5,0,0,0"
VerticalAlignment
=
"Center"
Width
=
"1"
/>
<
Border
Background
=
"{StaticResource RadPager_Separator2}"
HorizontalAlignment
=
"Left"
Height
=
"18"
Margin
=
"0,0,10,0"
VerticalAlignment
=
"Center"
Width
=
"1"
/>
<
TextBlock
Margin
=
"2,0"
telerik:LocalizationManager.ResourceKey
=
"RadDataPagerPage"
VerticalAlignment
=
"Center"
/>
<
Telerik_Windows_Controls_Data_DataPager:DataPagerTextBox
Command
=
"telerik:RadDataPagerCommands.MoveToPage"
Height
=
"20"
Margin
=
"2,0"
PageIndex
=
"{TemplateBinding PageIndex}"
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
VerticalAlignment
=
"Center"
Width
=
"48"
/>
<
TextBlock
Margin
=
"2,0"
telerik:LocalizationManager.ResourceKey
=
"RadDataPagerOf"
VerticalAlignment
=
"Center"
/>
<
TextBlock
Margin
=
"2,0"
Text
=
"{Binding PageCount, RelativeSource={RelativeSource TemplatedParent}}"
VerticalAlignment
=
"Center"
/>
</
StackPanel
>
</
Grid
>
</
Border
>
</
ControlTemplate
>
there are several references to
telerik:StyleManager.Theme
=
"{StaticResource Theme}"
where I want it to just use the current theme set for the application, which, the user may change at runtime by the way, but for which I force them to restart the application after setting a new theme.
"{StaticResource Theme}"
here needs to resolve to StyleManager.Application Theme
Do I need to declare the theme as a resource in app.xaml or somesuch?
Please advise. Thank you.
You may reference a particular theme, which is used as a resource as shown below:
<
telerik:Office_Blue
x:Key
=
"Theme"
/>
Then each part within RadDataPager's template will look for the resource with the specified key "Theme".
The same is valid for any Telerik control and its parts.
Greetings,
Vanya Pavlova
the Telerik team
The problem lies with dynamic skinning....
Indeed that is the way as our theming mechanism works. The styles used in our themes are theme specific. As you might know we ship our themes as separate projects and you may get the xaml files for any Telerik theme from the Themes folder of your personal installation. Telerik offers 8 themes and 8 styles for any RadControl/WPF/Silverlight. When you change the theme at runtime the Window's Content is visually rectreated and you are right that a style using a resource targeted at any theme will be logically invalid.
In our case you have a style targeted at RadDataPager and if you want to apply some changes based on any theme, for example Vista you may do the following:
<
Style
TargetType
=
"{x:Type RadDataPager}"
>
<
Setter
Property
=
"telerik:StyleManager.Theme"
Value
=
"Vista"
/>
......
</
Style
>
Then when you change the theme your changes will be handled correspondingly.
Kind regards,
Vanya Pavlova
the Telerik team
So the Radek's question is still open.
The question is very simple:
There is style with key "GridViewRowSelectedBackground" in the you theme. In diffenerent themes this style has different values. So we can't hardcoded it in own app.
The question is - is is possible to use this sttyle following way:
<Grid Background={StaticResources GridViewRowSelectedBackground} />
And then if we set black theme we get one background, if we set vista theme - we have anothe background etc.
Thanks, Anatoly Chekh.
Someone please answer.