StaticResource in Teleric Theme

11 posts, 0 answers
  1. Radek
    Radek avatar
    7 posts
    Member since:
    Apr 2011

    Posted 22 Apr 2011 Link to this post

    Hi all, 
    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>

  2. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 22 Apr 2011 Link to this post

    Hi Radek,

     
    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.



    Best wishes,
    Vanya Pavlova
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  3. UI for WPF is Visual Studio 2017 Ready
  4. Radek
    Radek avatar
    7 posts
    Member since:
    Apr 2011

    Posted 22 Apr 2011 Link to this post

    Thanks for reply, and sorry for my english.

    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




  5. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 22 Apr 2011 Link to this post

    Hello Radek,

     

    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.


    Greetings,
    Vanya Pavlova
    the Telerik team
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  6. Allen
    Allen avatar
    50 posts
    Member since:
    Mar 2011

    Posted 30 Jun 2011 Link to this post

    I have a related question.  I have successfully set the application theme as desired.  Then, in a control template Xaml, I wish to refer to this theme so the template incorporates the theme.  Taking the following example from your RadDataPager customization discussion:

    <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.

  7. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 01 Jul 2011 Link to this post

    Hello Allen,

     
    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
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  8. Allen
    Allen avatar
    50 posts
    Member since:
    Mar 2011

    Posted 01 Jul 2011 Link to this post

    I  understand that.  The example used that approach.  The problem is to figure out the active application theme and apply it, not create a static theme resource.  For example, theme in play is Office_Blue - fine.  User changes it to Vista - so the view needs to know that.  The StaticResource set to Office_Blue would be logically invalid.

    The problem lies with dynamic skinning....
  9. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 01 Jul 2011 Link to this post

    Hi Allen,

     

    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
    Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Public Issue Tracking system and vote to affect the priority of the items
  10. Anatoly Chekh
    Anatoly Chekh avatar
    86 posts
    Member since:
    Apr 2010

    Posted 23 Aug 2012 Link to this post

    Hello.

    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.
  11. Zdero Pero
    Zdero  Pero avatar
    4 posts
    Member since:
    Dec 2009

    Posted 03 Feb 2013 Link to this post

    Any news on this topic?
    Someone
    please answer.
  12. Zdero Pero
    Zdero  Pero avatar
    4 posts
    Member since:
    Dec 2009

    Posted 25 Feb 2013 Link to this post

    Why Telerik ignore this topic. Is it so difficult to answer?
Back to Top
UI for WPF is Visual Studio 2017 Ready