Using RadTileView in RadRibbonView Backstage

5 posts, 0 answers
  1. Harald
    Harald avatar
    54 posts
    Member since:
    Oct 2013

    Posted 22 Oct Link to this post

    When I use a RadTileView control in a RadRibbonBackstageItem, the RadTileViewItems run right out off the visible area. This Code works in a normal application window. How can I solve this?
  2. Harald
    Harald avatar
    54 posts
    Member since:
    Oct 2013

    Posted 22 Oct Link to this post

    01.<telerik:RadRibbonBackstageItem x:Name="BackstageItemDashboard"
    02.                                Header="Übersicht" IsSelectable="True" IsDefault="True">
    03.    <Grid x:Name="UserDashboard">
    04.        <Grid.ColumnDefinitions>
    05.            <ColumnDefinition></ColumnDefinition>
    06.        </Grid.ColumnDefinitions>
    07.        <Grid.RowDefinitions>
    08.            <RowDefinition></RowDefinition>
    09.        </Grid.RowDefinitions>
    10.        <telerik:RadTileView x:Name="TileView" Grid.Column="0" Grid.Row="0" Margin="10"
    11.                             Background="{telerik:MaterialResource ResourceKey=MarkerInvertedBrush}"
    12.                             BorderBrush="{telerik:MaterialResource ResourceKey=ComplementaryBrush}"
    13.                             BorderThickness="1"
    14.                             MinimizedItemsPosition="Right">
    15.            <telerik:RadTileViewItem Header="Test 1" Margin="3" Width="300" Height="300"></telerik:RadTileViewItem>
    16.            <telerik:RadTileViewItem Header="Test 2" Margin="3" Width="300" Height="300"></telerik:RadTileViewItem>
    17.            <telerik:RadTileViewItem Header="Test 3" Margin="3" Width="300" Height="300"></telerik:RadTileViewItem>
    18.            <telerik:RadTileViewItem Header="Test 4" Margin="3" Width="300" Height="300"></telerik:RadTileViewItem>
    19.        </telerik:RadTileView>
    20.    </Grid>
    21.</telerik:RadRibbonBackstageItem>
  3. Martin Ivanov
    Admin
    Martin Ivanov avatar
    1477 posts

    Posted 25 Oct Link to this post

    Hello Harald,

    I tested your code, but I am not sure what you mean by saying that the tileview is running outside of the visible area. Can you send me a picture showing the issue?

    Regards,
    Martin Ivanov
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
  4. Harald
    Harald avatar
    54 posts
    Member since:
    Oct 2013

    Posted 25 Oct in reply to Martin Ivanov Link to this post

    At the start everything looks good. After I have maximized an item, the items are positioned right outside the window. So I need to scroll to see the items.
  5. Dinko
    Admin
    Dinko avatar
    463 posts

    Posted 30 Oct Link to this post

    Hello Harald,

    You're experiencing this strange behavior because by default the RibbonBackStage has a ScrollViewer around its content. This means that the RadTileView will be measured with infinity (because of the ScrollViewer) and this is the default behavior of the TileView when it doesn't have size and it's measured with infinity. What I can suggest you is to extract and edit the default template of the backstage. There is an Editing Control Templates help article in our documentation which describes how you can extract the default template of the controls. In your case, in the extracted template you can remove the ScrollViewer. 

    I have prepared sample project which demonstrates this approach.

    Regards,
    Dinko
    Progress Telerik
    Want to extend the target reach of your WPF applications, leveraging iOS, Android, and UWP? Try UI for Xamarin, a suite of polished and feature-rich components for the Xamarin framework, which allow you to write beautiful native mobile apps using a single shared C# codebase.
Back to Top