2014-03-13 69 views
1

我有一個菜單。樣式MenuItem按預期工作

以下是創建這個菜單中的XAML:

<Menu Grid.Column="0" ItemsSource="{Binding ParentButtons}" > 

    <Menu.ItemsPanel> 
     <ItemsPanelTemplate> 
      <VirtualizingStackPanel Orientation="Vertical"/> 
     </ItemsPanelTemplate> 
    </Menu.ItemsPanel> 

    <Menu.Resources> 
     <Style TargetType="{x:Type MenuItem}"> 
      <Setter Property="Template"> 
       <Setter.Value> 
        <ControlTemplate TargetType="{x:Type MenuItem}"> 
         <Border x:Name="templateRoot" BorderBrush="{TemplateBinding BorderBrush}" BorderThickness="{TemplateBinding BorderThickness}" Background="{TemplateBinding Background}" SnapsToDevicePixels="True"> 
          <Grid VerticalAlignment="Center"> 
           <Grid.ColumnDefinitions> 
            <ColumnDefinition Width="Auto"/> 
            <ColumnDefinition Width="Auto"/> 
           </Grid.ColumnDefinitions> 
           <ContentPresenter x:Name="Icon" Content="{TemplateBinding Icon}" ContentSource="Icon" HorizontalAlignment="Center" Height="16" Margin="3" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" VerticalAlignment="Center" Width="16"/> 
           <Path x:Name="GlyphPanel" Data="F1M10,1.2L4.7,9.1 4.5,9.1 0,5.2 1.3,3.5 4.3,6.1 8.3,0 10,1.2z" Fill="{TemplateBinding Foreground}" FlowDirection="LeftToRight" Margin="3" Visibility="Collapsed" VerticalAlignment="Center"/> 
           <ContentPresenter ContentTemplate="{TemplateBinding HeaderTemplate}" Content="{TemplateBinding Header}" Grid.Column="1" ContentStringFormat="{TemplateBinding HeaderStringFormat}" ContentSource="Header" Margin="{TemplateBinding Padding}" RecognizesAccessKey="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"/> 
           <Popup x:Name="PART_Popup" AllowsTransparency="True" Focusable="False" IsOpen="{Binding IsSubmenuOpen, RelativeSource={RelativeSource TemplatedParent}}" PopupAnimation="{DynamicResource {x:Static SystemParameters.MenuPopupAnimationKey}}" Placement="Right"> 
            <Border x:Name="SubMenuBorder" BorderBrush="#FF999999" BorderThickness="1" Background="#FFF0F0F0" Padding="2"> 
             <ScrollViewer x:Name="SubMenuScrollViewer" Style="{DynamicResource {ComponentResourceKey ResourceId=MenuScrollViewer, TypeInTargetAssembly={x:Type FrameworkElement}}}"> 
              <Grid RenderOptions.ClearTypeHint="Enabled"> 
               <Canvas HorizontalAlignment="Left" Height="0" VerticalAlignment="Top" Width="0"> 
                <Rectangle x:Name="OpaqueRect" Fill="{Binding Background, ElementName=SubMenuBorder}" Height="{Binding ActualHeight, ElementName=SubMenuBorder}" Width="{Binding ActualWidth, ElementName=SubMenuBorder}"/> 
               </Canvas> 
               <!--<Rectangle Fill="#FFD7D7D7" HorizontalAlignment="Left" Margin="29,2,0,2" Width="1"/>--> 
               <ItemsPresenter x:Name="ItemsPresenter" KeyboardNavigation.DirectionalNavigation="Cycle" Grid.IsSharedSizeScope="True" SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}" KeyboardNavigation.TabNavigation="Cycle"/> 
              </Grid> 
             </ScrollViewer> 
            </Border> 
           </Popup> 
          </Grid> 
         </Border> 
         <ControlTemplate.Triggers> 
          <Trigger Property="IsSuspendingPopupAnimation" Value="True"> 
           <Setter Property="PopupAnimation" TargetName="PART_Popup" Value="None"/> 
          </Trigger> 
          <Trigger Property="Icon" Value="{x:Null}"> 
           <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/> 
          </Trigger> 
          <Trigger Property="IsChecked" Value="True"> 
           <Setter Property="Visibility" TargetName="GlyphPanel" Value="Visible"/> 
           <Setter Property="Visibility" TargetName="Icon" Value="Collapsed"/> 
          </Trigger> 
          <Trigger Property="IsHighlighted" Value="True"> 
           <Setter Property="Background" TargetName="templateRoot" Value="#3D26A0DA"/> 
           <Setter Property="BorderBrush" TargetName="templateRoot" Value="#FF26A0DA"/> 
          </Trigger> 
          <Trigger Property="IsEnabled" Value="False"> 
           <Setter Property="TextElement.Foreground" TargetName="templateRoot" Value="#FF707070"/> 
           <Setter Property="Fill" TargetName="GlyphPanel" Value="#FF707070"/> 
          </Trigger> 
          <Trigger Property="CanContentScroll" SourceName="SubMenuScrollViewer" Value="False"> 
           <Setter Property="Canvas.Top" TargetName="OpaqueRect" Value="{Binding VerticalOffset, ElementName=SubMenuScrollViewer}"/> 
           <Setter Property="Canvas.Left" TargetName="OpaqueRect" Value="{Binding HorizontalOffset, ElementName=SubMenuScrollViewer}"/> 
          </Trigger> 
         </ControlTemplate.Triggers> 
        </ControlTemplate> 

       </Setter.Value> 
      </Setter> 
     </Style> 
    </Menu.Resources> 

    <Menu.ItemTemplate> 
     <HierarchicalDataTemplate DataType="{x:Type model:Design_Master_Buttons}" 
         ItemsSource="{Binding Design_Master_Buttons1}"> 
      <StackPanel Orientation="Horizontal"> 
       <Path Data="{Binding ImageData}" 
         Stretch="Uniform" Width="32" Height="32" Margin="5" RenderTransformOrigin="0.5,0.5"> 

        <Path.RenderTransform> 
         <TransformGroup> 
          <TransformGroup.Children> 
           <RotateTransform Angle="0" /> 
           <ScaleTransform ScaleX="1" ScaleY="1" /> 
          </TransformGroup.Children> 
         </TransformGroup> 
        </Path.RenderTransform> 

        <Path.Resources> 
         <Style TargetType="{x:Type Path}"> 
          <Setter Property="Fill" Value="#FFFFFFFF" /> 
          <Style.Triggers> 
           <Trigger Property="MenuItem.IsMouseOver" Value="True"> 
            <Setter Property="Fill" Value="{Binding MouseOverColor}" /> 
           </Trigger> 
          </Style.Triggers> 
         </Style> 
        </Path.Resources> 

       </Path> 
       <TextBlock Text="{Binding Title}" VerticalAlignment="Center"> 
        <TextBlock.Resources> 
         <Style TargetType="{x:Type TextBlock}" BasedOn="{StaticResource {x:Type TextBlock}}"> 
          <Setter Property="Margin" Value="10,0,0,0" /> 
          <Style.Triggers> 
           <Trigger Property="Text" Value=""> 
            <Setter Property="Margin" Value="0" /> 
           </Trigger> 
          </Style.Triggers> 
         </Style> 
        </TextBlock.Resources> 
       </TextBlock> 
      </StackPanel> 
     </HierarchicalDataTemplate> 
    </Menu.ItemTemplate> 

</Menu> 

但我有1個問題:

當我將鼠標放置到路徑(它的工作好):

enter image description here

當我mouseOver MenuItem(它不按預期工作):

enter image description here

+0

第二種情況應該是什麼樣的行爲? –

+0

第二種情況下的行爲應該是:當我mouseover MenuItem時,路徑的背景應該改變,如第一幅圖所示。 – Vishal

回答

3

試試這個:在我的情況下stackpanel作爲AncestorType不起作用,所以我用Menuitem。

  <StackPanel> 
        <Path x:Name="PathData" Data="M 0 0 L 0 5 L 5 5 Z" Stretch="Uniform" Width="32" Height="32" RenderTransformOrigin="0.5,0.5"> 
         <Path.RenderTransform> 
          <TransformGroup> 
           <TransformGroup.Children> 
            <RotateTransform Angle="0"/> 
            <ScaleTransform ScaleX="1" ScaleY="1" /> 
           </TransformGroup.Children> 
          </TransformGroup> 
         </Path.RenderTransform> 
         <Path.Style> 
          <Style TargetType="{x:Type Path}"> 
           <Setter Property="Fill" Value="Transparent" /> 
           <Style.Triggers> 
            <DataTrigger Binding="{Binding RelativeSource={RelativeSource Mode=FindAncestor,AncestorType={x:Type MenuItem}},Path=IsMouseOver}" Value="True"> 
             <Setter Property="Fill" Value="Green" /> 
            </DataTrigger> 
           </Style.Triggers> 
          </Style> 
         </Path.Style> 
        </Path> 
       </StackPanel> 
+0

是的,DataTrigger會訣竅。感謝您一次又一次的幫助我。 – Vishal

+0

@訪問你是最受歡迎的。 –

2

您所在位置的資源是不正確的更換:

 <Path.Resources> 
      <Style TargetType="{x:Type Path}"> 
       <Setter Property="Fill" Value="#FFFFFFFF" /> 
       <Style.Triggers> 
        <DataTrigger Binding="{Binding RelativeSource={RelativeSource AncestorType=StackPanel,AncestorLevel=1}, Path=IsMouseOver}" Value="True" > 
         <Setter Property="Fill" Value="{Binding MouseOverColor}" /> 
        </DataTrigger> 

       </Style.Triggers> 
      </Style> 
     </Path.Resources> 

並添加Background="#01000000"到StackPanel中,它能夠檢測IsMouseOver屬性。

現在它會起作用。 此致敬禮。

+0

好的。但是Heena Patil給出了更完美的答案。所以,我已經將它標記爲接受的答案。感謝你們對我的幫助。 – Vishal

+1

+1,因爲我們的appraoch是相同的,但stackpanel作爲AncestorType在我的情況下不起作用。 –