Change background color RadRibbonView, RadRibbonTab and RadRibbonGroup

9 posts, 2 answers
  1. Andre
    Andre avatar
    33 posts
    Member since:
    Feb 2013

    Posted 06 Jul 2013 Link to this post

    I saw that by default RadRibbonView color is black, but I need to move to another custom color and I'm not getting, even managed to change the color of RadRibbonView in general, but when I add a RadRibbonTab the color set to the main RadRibbonView is behind and superior color remains black, fasso change in the Background of the controls, but the look remains the same. How can I solve this.?


     <Grid>
            <telerik:RadRibbonView Margin="0,3">
                <telerik:RadRibbonView.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF0098C5" Offset="0"/>
                        <GradientStop Color="White" Offset="1"/>
                    </LinearGradientBrush>
                </telerik:RadRibbonView.Background>
                
                <telerik:RadRibbonTab Header="Tab 1">
                    <telerik:RadRibbonGroup>
                        <telerik:RadRibbonGroup.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FF0098C5" Offset="0"/>
                                <GradientStop Color="White" Offset="1"/>
                            </LinearGradientBrush>
                            </telerik:RadRibbonGroup.Background>
                        <telerik:RadRibbonButton Content="Teste">
                            
                        </telerik:RadRibbonButton>
                    </telerik:RadRibbonGroup>
                </telerik:RadRibbonTab>
            </telerik:RadRibbonView>
        </Grid>

    I changed the background color of each component, but only RadRibbonView was changed, but stayed behind the other

    graciously
    André
  2. Answer
    Dimitrina
    Admin
    Dimitrina avatar
    442 posts

    Posted 10 Jul 2013 Link to this post

    Hi, Andre

    The background  which you want to change is the Title component of the RadRibbonView control. 
    Plaese see the following code 

    <telerik:RadRibbonView Margin="0,3" TitleBarBackground="Red">
                <telerik:RadRibbonView.Background>
                    <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                        <GradientStop Color="#FF0098C5" Offset="0"/>
                        <GradientStop Color="White" Offset="1"/>
                    </LinearGradientBrush>
                </telerik:RadRibbonView.Background>
                <telerik:RadRibbonTab Header="Tab 1">
                    <telerik:RadRibbonGroup>
                        <telerik:RadRibbonGroup.Background>
                            <LinearGradientBrush EndPoint="0.5,1" StartPoint="0.5,0">
                                <GradientStop Color="#FF0098C5" Offset="0"/>
                                <GradientStop Color="White" Offset="1"/>
                            </LinearGradientBrush>
                        </telerik:RadRibbonGroup.Background>
                        <telerik:RadRibbonButton Content="Teste">
                        </telerik:RadRibbonButton>
                    </telerik:RadRibbonGroup>
                </telerik:RadRibbonTab>
            </telerik:RadRibbonView>

    If you have further questions please do not hesitate to contact us.

    I hope this will help you.

    Regards,
    Dimitrina
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Andre
    Andre avatar
    33 posts
    Member since:
    Feb 2013

    Posted 10 Jul 2013 Link to this post

    No, I do not want to change the background color of the title, what I want is to set a color for my entire menu is independent of adding new tab, group, button and other controls.

    the problem is to define a background RadRibbonView far so good, but when a new adicino RadRibbonTab the background of RadRibbonTab covers the entire background set for RadRibbonView.

    graciously
    André
  5. Dimitrina
    Admin
    Dimitrina avatar
    442 posts

    Posted 11 Jul 2013 Link to this post

    Hi, Andre

    Can you send us a screenshot of the RibbonView control and mark the element which background you want to change.

    Thank you in advance.

    Regards,
    Dimitrina
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  6. Andre
    Andre avatar
    33 posts
    Member since:
    Feb 2013

    Posted 11 Jul 2013 Link to this post

    Ok, here are the pictures you requested, summarizing our menu control in our system is all blue light independent of adding new Tabs and Groups.
    Descupas by encomodo, but it is now adiquimos your product shortly, however we have read your help, but still gets a twinge of doubt perhaps not this property Fassa this type of function, but we do not know each other.
    OBS. If you are not understanding my English is my original language is Portuguese.

    graciously
    André
  7. Answer
    Kiril Vandov
    Admin
    Kiril Vandov avatar
    324 posts

    Posted 16 Jul 2013 Link to this post

    Hello Andre,

    If I understand correctly you want the Background applied to the RadRibbonView to be also applied to all of its children. You could do that by using our TransparentTheme and apply it to the RadRibbonView. Doing so will make the RadRibbonView and all of its children transparent. However the RadRibbonGroup background will not be changed to transparent, that is why you will need to change its Background property using implicit styles, like follows:

    xmlns:telerikRibbonViewPrimitives="clr-namespace:Telerik.Windows.Controls.RibbonView.Primitives;assembly=Telerik.Windows.Controls.RibbonView"
    ...
    <Style TargetType="telerikRibbonViewPrimitives:GroupChrome">
        <Setter Property="Background" Value="Transparent" />
    </Style>
    I have attached a sample project demonstrating this approach for your convenience. 

    I hope this information helps, please let us know if this works for you.

    Kind regards,
    Kiril Vandov
    Telerik
    TRY TELERIK'S NEWEST PRODUCT - EQATEC APPLICATION ANALYTICS for WPF.
    Learn what features your users use (or don't use) in your application. Know your audience. Target it better. Develop wisely.
    Sign up for Free application insights >>
  8. Andre
    Andre avatar
    33 posts
    Member since:
    Feb 2013

    Posted 16 Jul 2013 Link to this post

    That's right you needed.
    Thank you very much!

    Graciously
    André
  9. Sergey
    Sergey avatar
    9 posts
    Member since:
    Sep 2016

    Posted 03 Oct Link to this post

    Hi, Why I cannot just set a Background property? It has no effect. If I use a solution from this topic then my RadRibbonGroup just dissappear
  10. Kiril Vandov
    Admin
    Kiril Vandov avatar
    324 posts

    Posted 06 Oct Link to this post

    Hello Sergey,

    The attached project demonstrates how you can change the Background of the RadRibbonGroup's. With the current implemnetation of the RadRibbonGroup's and the parts they consist of the GroupChrome is the one responsible for the Background.
    As for why the groups disappear, my guess is that you are using NoXaml binaries when you use NoXaml binaries you need to BasedOn all custom styles to their original one's otherwise the properties such s Template(responsible for the visualization) will not be set and will not show the control. In this case you need to BasedOn the custom style to BasedOn={StaticResource GroupChromeStyle}.

    I hope this information helps.

    Kind regards,
    Kiril Vandov
    Telerik by Progress

    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