TileViewHeaderItem background

9 posts, 0 answers
  1. Andrew
    Andrew avatar
    26 posts
    Member since:
    Sep 2011

    Posted 27 Feb 2012 Link to this post

    I saw this post: http://www.telerik.com/community/forums/wpf/tileview/tileview-item-header-background.aspx but it really seems overkill for such a simple property change. Is there a better(easier) way to just set the background bush for the header? For certain tiles that need to reflect a change I want to set the header background to a custom linear brush. I tried using a custom template but it only changed it for the text area and not the whole header item. I also tried the example attached in the other forum post but it didn't look correct, maybe cause we're using the metro theme?

    Anyway, is there a solution I've overlooked?

    Robert
  2. Kiril Stanoev
    Admin
    Kiril Stanoev avatar
    1511 posts

    Posted 29 Feb 2012 Link to this post

    Hi Robert,

    To modify just the header background you don't have to edit the whole ControlTemplate. All you have to do is set the HeaderStyle property:

    <Window x:Class="TileViewTest.MainWindow" xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
            xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" xmlns:System="clr-namespace:System;assembly=mscorlib"
            xmlns:telerikNavigation="clr-namespace:Telerik.Windows.Controls.TileView;assembly=Telerik.Windows.Controls.Navigation"
            Title="Window1" Width="800" Height="500">
        <Window.Resources>
            <Style x:Key="TileViewItemHeaderStyle1" TargetType="{x:Type telerikNavigation:TileViewItemHeader}">
                <Setter Property="Background">
                    <Setter.Value>
                        <LinearGradientBrush StartPoint="0,0" EndPoint="1,1">
                            <GradientStop Color="Yellow" Offset="0.0" />
                            <GradientStop Color="Red" Offset="0.25" />
                            <GradientStop Color="Blue" Offset="0.75" />
                            <GradientStop Color="LimeGreen" Offset="1.0" />
                        </LinearGradientBrush>
                    </Setter.Value>
                </Setter>
            </Style>
        </Window.Resources>
        <Grid>
            <telerik:RadTileView x:Name="cardsTileView" HeaderStyle="{StaticResource TileViewItemHeaderStyle1}"
                    MinimizedColumnWidth="200">
                <telerik:RadTileViewItem Header="Tile One" />
                <telerik:RadTileViewItem Header="Tile Two" />
                <telerik:RadTileViewItem Header="Tile Three" />
            </telerik:RadTileView>
        </Grid>
    </Window>




    Give it a try and let me know how it works for you.

    All the best,
    Kiril Stanoev
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  3. UI for WPF is Visual Studio 2017 Ready
  4. Andrew
    Andrew avatar
    26 posts
    Member since:
    Sep 2011

    Posted 29 Feb 2012 Link to this post

    Still doesn't work. If I bind the ItemsSource then it uses the standard style however it I do exactly what you did and not use a bound ItemsSource then it changes the style.

    Robert
  5. Zarko
    Admin
    Zarko avatar
    755 posts

    Posted 29 Feb 2012 Link to this post

    Hello,
    Could you please send us some code snippets or a project that reproduces this issue because I wasn't able to recreate it? I've attached the sample project that I used for testing (in it the TileView's ItemsSource is bound) so you could take a look at it and tell us what you're doing differently. Also could you please tell us the exact version of your dlls and if you're using .Net 3.5 or .Net 4.0?
    We are looking forward to hearing from you.

    Greetings,
    Zarko
    the Telerik team
    Sharpen your .NET Ninja skills! Attend Q1 webinar week and get a chance to win a license! Book your seat now >>
  6. Andrew
    Andrew avatar
    26 posts
    Member since:
    Sep 2011

    Posted 29 Feb 2012 Link to this post

    Submitted a ticket (517653) with my test project.

    Robert
  7. Dave Navarro
    Dave Navarro avatar
    150 posts
    Member since:
    Jul 2005

    Posted 03 Sep 2012 Link to this post

    Hello Kiril Stanoev,

    Just a quick note to say thanks for the post!

    Your solution works as advertised and I LOVE the colors!!!

    Many thanks!

    ~ Dave
  8. Goran
    Goran avatar
    77 posts
    Member since:
    Feb 2011

    Posted 13 Sep 2012 Link to this post

    Hi,

    what about style selector? I have a requirement to display different background for header based on item type.

    Regards,
    Goran
  9. Goran
    Goran avatar
    77 posts
    Member since:
    Feb 2011

    Posted 13 Sep 2012 Link to this post

    I have found the way around to use ItemContainerStyleSelector, and then in each RadTileViewItem style to set HeaderStyle. I hope I am not overlooking something simple.

    Regards,
    Goran
  10. Tina Stancheva
    Admin
    Tina Stancheva avatar
    3298 posts

    Posted 18 Sep 2012 Link to this post

    Hello Goran,

    The ItemContainerStyleSelector approach is the right way to go in your scenario. Let us know if you encounter any issues or if you have more questions.

    Regards,
    Tina Stancheva
    the Telerik team

    Time to cast your vote for Telerik! Tell DevPro Connections and Windows IT Pro why Telerik is your choice. Telerik is nominated in a total of 25 categories.

Back to Top
UI for WPF is Visual Studio 2017 Ready