Silverlight Menu4U

<navigation:Page x:Class="Menu4UDemo.Views.RightToLeft"
    xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation" 
    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml" 
    xmlns:d="http://schemas.microsoft.com/expression/blend/2008" xmlns:mc="http://schemas.openxmlformats.org/markup-compatibility/2006"
    xmlns:navigation="clr-namespace:System.Windows.Controls;assembly=System.Windows.Controls.Navigation"
    xmlns:ctrl="clr-namespace:Silverlight.Controls;assembly=Silverlight.Controls"
    xmlns:converters="clr-namespace:Silverlight.Controls.Converters;assembly=Silverlight.Controls"
    xmlns:controls="clr-namespace:Silverlight.Controls;assembly=Silverlight.Controls"
    mc:Ignorable="d" d:DesignWidth="640" d:DesignHeight="480"
    Title="RightToLeft"
    Style="{StaticResource PageStyle}">

    <navigation:Page.Resources>

        <converters:HasItemsToVisibilityConverter x:Key="hasItemsToVis"/>
        <converters:BooleanToOpacityConverter x:Key="isEnabledToOpacity"/>
        <converters:LevelToVisibilityConverter x:Key="levelToVis"/>
        <converters:BooleanToVisibilityConverter x:Key="boolToVis"/>
        <converters:BooleanToCollapsedConverter x:Key="boolToCollapsed"/>                

        <DataTemplate x:Key="tabTemplate">
            <Grid Margin="0,-2,0,-2" Height="40" Width="127">
                <Grid.Background>
                    <LinearGradientBrush>
                        <GradientStop Offset="0.0" Color="#60c0ffc0"/>
                        <GradientStop Offset="0.5" Color="#80c0ffc0"/>
                        <GradientStop Offset="1.0" Color="#60c0ffc0"/>
                    </LinearGradientBrush>
                </Grid.Background>
                <Path Data="M0,0 L1,0 L1,1 L0,1" Stretch="Fill" Stroke="Gray"/>
                <TextBlock Margin="3,0,3,0" VerticalAlignment="Center" TextAlignment="Right">
                    <ctrl:BindingHelper.Binding>
                        <ctrl:BindingProperties TargetProperty="Text" SourceProperty="SecondLevelHeaderText"
                                    RelativeSourceAncestorType="SLMenu" RelativeSourceAncestorLevel="1"/>
                    </ctrl:BindingHelper.Binding>
                </TextBlock>
            </Grid>
        </DataTemplate>

        <DataTemplate x:Key="firstLevelMenuItemTemplate">
            <Grid Width="120" Opacity="{Binding IsEnabled, Converter={StaticResource isEnabledToOpacity}}">
                <ctrl:ItemWrapper Text="{Binding Text}" HorizontalAlignment="Stretch">
                    <TextBlock VerticalAlignment="Center" Text="{Binding Text}" TextAlignment="Right"/>
                </ctrl:ItemWrapper>
            </Grid>
        </DataTemplate>

        <DataTemplate x:Key="secondLevelMenuItemTemplate">
            <Grid Width="160" Opacity="{Binding IsEnabled, Converter={StaticResource isEnabledToOpacity}}">
                <ctrl:ItemWrapper Text="{Binding Text}" HorizontalAlignment="Stretch">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="12"/>
                        <ColumnDefinition/>
                        <ColumnDefinition Width="28"/>
                    </Grid.ColumnDefinitions>
                    <Path Grid.Column="0" Data="M0,1 L1,0 L1,2 L0,1" Width="4" Height="6" Stretch="Fill" Fill="Black"
                          Visibility="{Binding Children, Converter={StaticResource hasItemsToVis}}"/>
                    <TextBlock Grid.Column="1" VerticalAlignment="Center" Text="{Binding Text}" TextAlignment="Right"/>
                    <Image Grid.Column="2" HorizontalAlignment="Left" Source="{Binding IconUrl}" Width="16" Margin="4,0,0,0" Visibility="{Binding IsCheckable, Converter={StaticResource boolToCollapsed}}"/>
                    <Image Grid.Column="2" HorizontalAlignment="Left" Source="{Binding IconUrl}" Width="16" Margin="4,0,0,0" Visibility="{Binding IsChecked, Converter={StaticResource boolToVis}}"/>

                </ctrl:ItemWrapper>
                <ctrl:Separator Grid.Column="0" Grid.ColumnSpan="3" Text="{Binding Text}"/>
            </Grid>
        </DataTemplate>

        <Style x:Key="slMenuStyle" TargetType="ctrl:SLMenu">
            <Setter Property="FirstLevelItemsPanelBrush">
                <Setter.Value>
                    <LinearGradientBrush>
                        <GradientStop Offset="0.0" Color="#00c0ffc0"/>
                        <GradientStop Offset="1.0" Color="#ffc0ffc0"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>
            <Setter Property="SecondLevelItemsPanelBrush">
                <Setter.Value>
                    <LinearGradientBrush>
                        <GradientStop Offset="0.0" Color="#00c0ffc0"/>
                        <GradientStop Offset="1.0" Color="#ffc0ffc0"/>
                    </LinearGradientBrush>
                </Setter.Value>
            </Setter>            
        </Style>

    </navigation:Page.Resources>

    <Grid x:Name="LayoutRoot">

        <Grid.Background>
            <ImageBrush ImageSource="/Images/Silverlight.jpg" Stretch="Uniform"/>
        </Grid.Background>

        <Grid.RowDefinitions>
            <RowDefinition Height="28"/>
            <RowDefinition/>
            <RowDefinition Height="28"/>
        </Grid.RowDefinitions>
        <Grid.ColumnDefinitions>
            <ColumnDefinition Width="75"/>
            <ColumnDefinition/>
            <ColumnDefinition Width="75"/>
        </Grid.ColumnDefinitions>

        <Grid 
            Grid.Row="0"
            Grid.RowSpan="3"
            Grid.Column="0"
            Grid.ColumnSpan="3"
            Background="Transparent" MouseLeftButtonDown="Grid_MouseLeftButtonDown"/>
        
        <ctrl:SLMenu 
            x:Name="mnu" 
            Grid.Row="1"
            Grid.RowSpan="1"
            Grid.Column="0"
            Grid.ColumnSpan="3"
            DataSource="{Binding MenuRoot}"
            TabTemplate="{StaticResource tabTemplate}"
            FirstLevelMenuItemTemplate="{StaticResource firstLevelMenuItemTemplate}"
            SecondLevelMenuItemTemplate="{StaticResource secondLevelMenuItemTemplate}"
            Style="{StaticResource slMenuStyle}"
            FontSize="18"
            Dock="Right">

        </ctrl:SLMenu>

    </Grid>
</navigation:Page>