Make more room for Group Header

11 posts, 0 answers
  1. Paul
    Paul avatar
    38 posts
    Member since:
    Feb 2014

    Posted 18 Feb 2014 Link to this post

    What is the best way to modify the styles or templates to allow exclusive room for the Group Headers vertically?  It seems that depending on the size of the window, the tiles expand to overlap the area that I would have expected to be reserved for the Group Header. 

    Thanks
    Paul
  2. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 21 Feb 2014 Link to this post

    Hello Paul,


    Thank you for contacting us!
    The default GroupTemplate of RadTileList is a Grid layout container with HorizontalAlignment, VerticalAlignment properties set to Stretch. You may predefine the group template with your own and set minimal (or fixed) height, that will be exclusively reserved for the group header, as shown below:

    <DataTemplate x:Key="groupTemplate">
            <TextBlock Text="Hello" MinHeight="50" ....>
        </DataTemplate>
    <telerik:RadTileList GroupTemplate="{StaticResource groupTemplate}" ....>


    Can you please give it a try and let us know how it goes? 


    Regards,
    Vanya Pavlova
    Telerik
  3. UI for WPF is Visual Studio 2017 Ready
  4. Paul
    Paul avatar
    38 posts
    Member since:
    Feb 2014

    Posted 21 Feb 2014 in reply to Vanya Pavlova Link to this post

    Yeah, no.  Doesn't seem to work for me.  I attached a screen shot and the xaml that I am using is below.

    You can see that the tile area is overlaying the Group Header area.  I am pretty sure I am doing what you showed with the GroupTemplate.  But I am sure I am missing something somewhere.

    <Window x:Class="Example2.MainWindow"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:telerik="http://schemas.telerik.com/2008/xaml/presentation"
    xmlns:telerikControls="clr-namespace:Telerik.Windows.Controls.Primitives;assembly=Telerik.Windows.Controls"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    Title="MainWindow"
    Height="350"
    Width="525">
    <Grid>
    <Grid.Resources>

    <DataTemplate x:Key="GroupTemplate">
    <Border BorderThickness="1"
    BorderBrush="Transparent"
    Margin="5"
    Padding="5"
    MinHeight="150">
    <StackPanel Orientation="Horizontal">
    <Rectangle Width="100"
    Height="100"
    Stroke="Black" StrokeThickness="1" VerticalAlignment="Center" />
    <TextBlock Text="{Binding}"
    Margin="5,0,0,5"
    FontSize="64"
    FontWeight="Bold" />
    </StackPanel>
    </Border>
    </DataTemplate>

    <telerik:TileGroup Header="Group 1 that will over flow into tile area"
    x:Key="group1" />

    <telerik:TileGroup Header="Group 2"
    x:Key="group2" />
    </Grid.Resources>

    <!-- Grouped Tile list, all in xaml -->
    <telerik:RadTileList Grid.Row="0"
    Grid.Column="1"
    Background="LawnGreen"
    ScrollViewer.HorizontalScrollBarVisibility="Auto"

    GroupTemplate="{StaticResource GroupTemplate}"
    Margin="10">
    <telerik:Tile Group="{StaticResource group1}" />
    <telerik:Tile Group="{StaticResource group1}" />
    <telerik:Tile Group="{StaticResource group1}" />

    <telerik:Tile Group="{StaticResource group2}" />
    <telerik:Tile Group="{StaticResource group2}" />
    <telerik:Tile Group="{StaticResource group2}" />
    <telerik:Tile Group="{StaticResource group2}" />
    <telerik:Tile Group="{StaticResource group2}" />
    <telerik:Tile Group="{StaticResource group2}" />
    <telerik:Tile Group="{StaticResource group2}" />
    </telerik:RadTileList>

    </Grid>
    </Window>

    Thanks
    Paul
  5. Paul
    Paul avatar
    38 posts
    Member since:
    Feb 2014

    Posted 21 Feb 2014 in reply to Vanya Pavlova Link to this post

    If you run the xaml that I sent, resize the window to see the effect.  If the window is large enough or there are not a large amount of tiles in the group, everything is ok.  If you add more tiles, and size the window down a bit, the tiles reposition over top of the group header.  It appears that the ItemsPresenter is overlaying the area where the Group header goes.  It appears that they are in the same cell in the grid in the layout. 
  6. Vanya Pavlova
    Admin
    Vanya Pavlova avatar
    2019 posts

    Posted 26 Feb 2014 Link to this post

    Hello Paul,



    Thank you for sharing this info with us! We spent some time to provide some tests with the snippet you provided. We can definitely confirm that this is not the desired behavior you should experience.  
    Rather unfortunately we cannot offer you an appropriate workaround at this stage. 


    We're currently planning to improve the experience of RadTileList in our future releases. 


    Please excuse us for any inconvenience caused!


    Regards,
    Vanya Pavlova
    Telerik
  7. Paul
    Paul avatar
    38 posts
    Member since:
    Feb 2014

    Posted 26 Feb 2014 in reply to Vanya Pavlova Link to this post

    Thank you for the follow up.  When Telerik is able to release a version that provides this capability, could you please let me know?

    thanks again
    Paul
  8. Dimitrina
    Admin
    Dimitrina avatar
    3769 posts

    Posted 28 Feb 2014 Link to this post

    Hi Paul,

    I am afraid we cannot commit to a specific date when we will release a stable version of the planned improvements. We are going to let you know once we have more information on the matter.

    Regards,
    Didie
    Telerik
  9. Paul
    Paul avatar
    38 posts
    Member since:
    Feb 2014

    Posted 28 Feb 2014 in reply to Dimitrina Link to this post

    Thanks, I understand.  I was just asking for a ping or quick post to this thread when and if Telerik does decide to release a version with the capability.

    Paul
  10. Muhammad Ummar
    Muhammad Ummar avatar
    26 posts
    Member since:
    Jul 2012

    Posted 30 May 2014 Link to this post

    Any update on this? I need to control the padding between Group header and Actual Tiles, but I there doesn't seems to be a way for this.
  11. Dimitrina
    Admin
    Dimitrina avatar
    3769 posts

    Posted 02 Jun 2014 Link to this post

    Hello Paul,

    We are still working on improving the grouping experience with RadTileList. 

    Regards,
    Didie
    Telerik
     
    Check out Telerik Analytics, the service which allows developers to discover app usage patterns, analyze user data, log exceptions, solve problems and profile application performance at run time. Watch the videos and start improving your app based on facts, not hunches.
     
  12. Maya
    Admin
    Maya avatar
    4062 posts

    Posted 27 Oct 2014 Link to this post

    Hi Muhammad,


    With Q3 2014 we introduced some changes to the way RadTileList behaves in grouped scenario. And now you can control the height of the group headers (through GroupHeaderHeight property), their visibility (through GroupHeaderVisibility property), the alignment of tile independently of the group header (throught VerticalTilesAlignment property). 
    Please check out this article for more details on those features.



    Regards,
    Maya
    Telerik
     

    Check out the Telerik Platform - the only platform that combines a rich set of UI tools with powerful cloud services to develop web, hybrid and native mobile apps.

     
Back to Top
UI for WPF is Visual Studio 2017 Ready