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

How can I show RadialMenu over TileViewItem

5 Answers 93 Views
RadialMenu
This is a migrated thread and some comments may be shown as answers.
MinSu
Top achievements
Rank 1
MinSu asked on 18 Feb 2016, 05:17 AM

Hi~

I want to show RadialMenu over TileViewItem.

TileViewItem hide RadialMenu.

Here is example code.

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

    <Window.Resources>
        <Style TargetType="telerik:RadTileView">
            <Setter Property="PreservePositionWhenMaximized" Value="True" />
            <Setter Property="telerik:TileViewPanel.IsVirtualized" Value="True" />
            <Setter Property="IsAutoScrollingEnabled" Value="True" />
            <Setter Property="TileStateChangeTrigger" Value="SingleClick" />
            <Setter Property="MinimizedColumnWidth" Value="180" />
            <Setter Property="MinimizedRowHeight" Value="155" />
            <Setter Property="RowHeight" Value="250" />
            <Setter Property="ColumnWidth" Value="250" />
            <Setter Property="ColumnsCount" Value="3" />
        </Style>
        <Style TargetType="telerik:RadTileViewItem">
            <Setter Property="Background" Value="#eaeaea" />
        </Style>
        <DataTemplate x:Key="sizeTemplate">
            <StackPanel Orientation="Horizontal">
                <TextBlock Text="Item" />
                <TextBlock Text="{Binding}" />
            </StackPanel>
        </DataTemplate>
        <DataTemplate x:Key="contentTemplate">
            <StackPanel>
                <telerik:RadRadialMenu Panel.ZIndex="99999">
                    <telerik:RadRadialMenuItem Header="Item 1" />
                    <telerik:RadRadialMenuItem Header="Item 2" />
                    <telerik:RadRadialMenuItem Header="Item 3" />
                </telerik:RadRadialMenu>
            </StackPanel>
        </DataTemplate>
    </Window.Resources>
    
    <Grid>
       
        <telerik:RadTileView  ItemsSource="{Binding}" ItemTemplate="{StaticResource sizeTemplate}"
                              ContentTemplate="{StaticResource contentTemplate}"  />
    </Grid>
</Window>

You can see capture file "Actual.png"

I want to "Expect.png" screen.

How?

5 Answers, 1 is accepted

Sort by
0
Yana
Telerik team
answered on 18 Feb 2016, 01:01 PM
Hello Minsu,

It is not possible for RadialMenu to go over the TileViewItem as it's placed inside its Template.

You could either set smaller size to RadialMenu in order to fit inside the TileView item when expanded as shown in the following snippet:

<telerik:RadRadialMenu>
    <telerik:RadRadialMenu.Style>
        <Style TargetType="telerik:RadRadialMenu">
            <Setter Property="MinWidth" Value="190"/>
            <Setter Property="MinHeight" Value="190"/>
        </Style>
    </telerik:RadRadialMenu.Style>
    <telerik:RadRadialMenuItem Header="Item 1" />
    <telerik:RadRadialMenuItem Header="Item 2" />
    <telerik:RadRadialMenuItem Header="Item 3" />
</telerik:RadRadialMenu>

or recreate the layout, so that the whole RadialMenu is placed inside a popup, for example. The popup could be open from a button placed inside the TileViewItem.

Hope this will be helpful.

Regards,
Yana
Telerik
Do you want to have your say when we set our development plans? Do you want to know when a feature you care about is added or when a bug fixed? Explore the Telerik Feedback Portal and vote to affect the priority of the items
0
MinSu
Top achievements
Rank 1
answered on 19 Feb 2016, 04:18 AM

Thanks your help!

I should use popup.

0
Russell
Top achievements
Rank 1
answered on 16 Oct 2017, 05:52 PM

So you are saying have a button which will open the menu in a popup? Is that not the point of this menu? To have a small button that appears over content?

 

What can be done to get the z-index corrected with this control? It seems like such an amazing control but I cannot get it to appear above elements.

0
Yana
Telerik team
answered on 19 Oct 2017, 01:32 PM
Hi Russell,

RadRadialMenu control represents a circular menu which allows you to drill-down into different levels of items. However, its purpose is not to be specifically positioned over the content except in cases when it is used as ContextMenu.

Could you give us more details on the exact requirement you have, so I could research what could be the possible ways to achieve it?

Regards,
Yana
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
Russell
Top achievements
Rank 1
answered on 19 Oct 2017, 02:59 PM

Yana,

 

Thank you for the link. After reading it I think I understand the purpose behind needing to do it this way.

 

My requriement is really to have a context menu off of ListView items so the user can take action on an item with a cool looking menu as opposed to a simple right click boring context menu. I will give this tutorial a shot and if I have more questions I will holler. 

 

Thanks again.

Tags
RadialMenu
Asked by
MinSu
Top achievements
Rank 1
Answers by
Yana
Telerik team
MinSu
Top achievements
Rank 1
Russell
Top achievements
Rank 1
Share this question
or