This is a migrated thread and some comments may be shown as answers.

Using RadTileView in RadRibbonView Backstage

6 Answers 22 Views
RibbonView and RibbonWindow
This is a migrated thread and some comments may be shown as answers.
Harald
Top achievements
Rank 1
Harald asked on 22 Oct 2017, 01:22 PM
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?

6 Answers, 1 is accepted

Sort by
0
Harald
Top achievements
Rank 1
answered on 22 Oct 2017, 01:35 PM
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>
0
Martin Ivanov
Telerik team
answered on 25 Oct 2017, 10:38 AM
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.
0
Harald
Top achievements
Rank 1
answered on 26 Oct 2017, 04:40 AM
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.
0
Dinko
Telerik team
answered on 30 Oct 2017, 02:14 PM
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 you to write beautiful native mobile apps using a single shared C# codebase.
0
Harald
Top achievements
Rank 1
answered on 26 Dec 2017, 11:55 AM
I use the material theme. Which scrollviewer should I remove here?
0
Sia
Telerik team
answered on 28 Dec 2017, 09:45 AM
Hello again,

If you use our Material theme, then you will need to extract the relevant styles, templates and resources from the Themes folder in your installation. There you can find a folder per every theme that we have. Please find the same project attached after updating it to work with our Material theme.

Please note that there are two different folders - Themes (with styles corresponding to StyleManager) and Themes.Implicit (with styles corresponding to implicit styles). I recommend to you to use implicit styles if possible, because that way it won't be necessary to copy all static resources in your application. However this will lead to some extra effort to update your project to reference NoXAML binaries and merge all needed resources in the App.xaml.

Regards,
Sia
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.
Tags
RibbonView and RibbonWindow
Asked by
Harald
Top achievements
Rank 1
Answers by
Harald
Top achievements
Rank 1
Martin Ivanov
Telerik team
Dinko
Telerik team
Sia
Telerik team
Share this question
or