Placement for RadMenu

[om]

Hi,

We just started using RadMenu control and are using it in grid as ContextMenu. We are not using ContextMenu for this job because, we needed the contextmenu to appear on mouseover to make it disappear when cursor is outside the boundries of contextMenu.

Now, we have RadMenu being added to grid with one item only on which if you hover over you will see the submenu options being popup at the bottom. All we want to do is to change the position of popup from bottom to right. Is there anyway to do it from SubMenuOpened event or something like that?

If it is doable is it possible to demonstrate it throught some code sample?

Thanks

[Hristo]

Hello Osama,

RadMenu have Orientation property which is by default to Horizontal. If you change it to Vertical the popup will be placed on the right side. You can see a demo here:
http://demos.telerik.com/silverlight/#Menu/Orientation

I hope this helps.
Let me know if you need more help.

Kind regards,
Hristo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[om]

Thanks for your reply Hristo. In fact I had already tried the orientation property already, but it didn't work for me. It might be the result of my scenario. Which is that I am using menu inside the grid column. Let me show you what I am doing:
Following is my converter and the datatemplate for my menu.

 

<converters:MenuConverter x:Key="MenuConverter"></converters:MenuConverter>
        <DataTemplate x:Key="MenuOptions">
            <menu:RadMenu x:Name="mnuCtx" Background="Transparent" Orientation="Vertical">
                <!--Define Style or icon on this object-->
                <menu:RadMenuItem Height="20" Width="20" ItemsSource="{Binding MenuItems, Converter={StaticResource MenuConverter}}" Cursor="Hand">
                    <menu:RadMenuItem.Icon>
                        <Path Stretch="Fill" Height="4" Width="8" Data="F1 M 531.107,321.943L 541.537,321.943L 536.322,328.042L 531.107,321.943 Z" >
                            <Path.Fill>
                                <LinearGradientBrush StartPoint="0.2,0.2" EndPoint="0.8,0.8" >
                                    <GradientStop Color="#FF000000"/>
                                    <GradientStop Color="#FFA1A1A1" Offset="1"/>
                                </LinearGradientBrush>
                            </Path.Fill>
                        </Path>
                    </menu:RadMenuItem.Icon>
                </menu:RadMenuItem>
            </menu:RadMenu>
        </DataTemplate>

Then I have a column being generated from code behind:

                        Results.HeadersVisibility = DataGridHeadersVisibility.All;

                        //Context Menu Column
                        DataGridTemplateColumn dgColMenu = new DataGridTemplateColumn();
                        dgColMenu.Header = "";
                        dgColMenu.CellTemplate = Resources["MenuOptions"] as DataTemplate;
                        this.Results.Columns.Add(dgColMenu);

The converter I have specified, creates subitems inside the item I have there in datatemplate like this:

public class MenuConverter : IValueConverter
    {
        #region IValueConverter Members

        public object Convert(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            List<string> options = value as List<string>;
            Telerik.Windows.Controls.RadMenu ctxMenu = new Telerik.Windows.Controls.RadMenu();
            foreach (string item in options)
            {
                Telerik.Windows.Controls.RadMenuItem mnuItem = new Telerik.Windows.Controls.RadMenuItem() { Header = item };
                ctxMenu.Items.Add(mnuItem);
            }
            return ctxMenu.Items;
        }

        public object ConvertBack(object value, Type targetType, object parameter, System.Globalization.CultureInfo culture)
        {
            throw new NotImplementedException();
        }

        #endregion
    }

Now you can see that I have set the orientation property but its not working, my menu sub items are still poping at the bottom.
Am I missing something?

Thanks

[om]

Hi,
I have even tried the code available at your demo section and that still didn't work, yes, it made the menu appear vertically but when I click on the menu to bring up the submenus, submenus popup at the buttom of the parent item...
Am I missing something?

Following is the code which I copied from demo section:

<UserControl x:Class="Telerik_Quick_Test.TestPage1"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
    xmlns:telerik="clr-namespace:Telerik.Windows.Controls;assembly=Telerik.Windows.Controls.Navigation"
    Width="400" Height="300">

        <!--<ToggleButton x:Name="ToggleButton_SearchOptions" Grid.Row="0" Grid.RowSpan="1" Grid.Column="2" Grid.ColumnSpan="1" Margin="0,0,4,0" Height="16" Width="16" Style="{StaticResource DropDownToggleButton}" HorizontalAlignment="Right"/>-->
        <telerik:RadMenu Grid.Row="1" x:Name="menu" VerticalAlignment="Top" Orientation="Vertical" HorizontalAlignment="Left"
            ClickToOpen="True">
            <telerik:RadMenuItem Header="File">
                <telerik:RadMenuItem Header="New">

                </telerik:RadMenuItem>
                <telerik:RadMenuItem Header="Open">

                    <telerik:RadMenuItem Header="Project" />
                    <telerik:RadMenuItem Header="Project from Web" />
                    <telerik:RadMenuItem Header="File" />
                    <telerik:RadMenuItem Header="File from Web" />
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Header="Close">

                </telerik:RadMenuItem>
            </telerik:RadMenuItem>
            <telerik:RadMenuItem Header="Edit">
                <telerik:RadMenuItem Header="Undo">

                </telerik:RadMenuItem>
                <telerik:RadMenuItem Header="Redo" />
                <telerik:RadMenuItem Header="Cut" />
                <telerik:RadMenuItem Header="Copy">
                </telerik:RadMenuItem>
                <telerik:RadMenuItem Header="Paste" />
            </telerik:RadMenuItem>
            <telerik:RadMenuItem Header="Help">
                <telerik:RadMenuItem Header="Index" />
                <telerik:RadMenuItem Header="Search">

                </telerik:RadMenuItem>
                <telerik:RadMenuItem Header="About us" />
            </telerik:RadMenuItem>
        </telerik:RadMenu>

</UserControl>

Thanks

[Hristo]

Hi Osama Mirza,

I'm sorry for the late response. Could you send us your project so we can investigate this further?
In order to be able to attach files you should open a support ticket.

Waiting for your response.

All the best,
Hristo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.

[om]

Hi Hristo,

I am sorry that I have lost the test project and because of extreemly tight dead line, I am affraid that I will be able to go through that the whole process. The last code sample I pasted, if you copy that and put that in a new project, you will be able to see what I was seeing.

Regards
OM

[Hristo]

Hello om,

I was able to reproduce this and confirm that this is bug. We will fix it for the next release. If this is a showstopper for you please open a support ticket and I will send you the hotfix.
Thank you for reporting this. Your telerik points have been updated.

Greetings,
Hristo
the Telerik team

Check out Telerik Trainer, the state of the art learning tool for Telerik products.