WPF ContextMenu做透明效果

Question

我想通过设置菜单背景华刷来实现ContextMenu做成透明的效果.但是他的二级菜单没找到方法去设置他的背景.<Window
xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
x:Class="MyWPF_2.MainWindow"
x:Name="Window"
Title="MainWindow"
WindowStyle="None"
AllowsTransparency="True"
Background="#00FFFFFF"
WindowStartupLocation="CenterScreen"
Width="100" Height="50">
<Window.Resources>
<ContextMenu x:Key="MyMenu" Background="#00FFFFFF" BorderBrush="#00FFFFFF">
    <ContextMenu.Resources>
        <Style TargetType="MenuItem">
            <Setter Property="ItemsPanel" Value="{Binding ItemsPanel,RelativeSource={RelativeSource AncestorType=ContextMenu}}" />
        </Style>
    </ContextMenu.Resources>
    <ContextMenu.ItemsPanel>
        <ItemsPanelTemplate>
            <StackPanel>
                <StackPanel.Background>
                    <LinearGradientBrush StartPoint="0,0" EndPoint="0,1">
                        <GradientStop Color="#00FF42D4" Offset="0" />
                        <GradientStop Color="#88FF42D4" Offset="1" />
                    </LinearGradientBrush>
                </StackPanel.Background>
            </StackPanel>
        </ItemsPanelTemplate>
    </ContextMenu.ItemsPanel>
    <MenuItem Header="MenuItem1">
        <MenuItem Header="MenuItem11"/>
        <MenuItem Header="MenuItem12"/>
    </MenuItem>
</ContextMenu></Window.Resources>
<Grid x:Name="LayoutRoot">
    <Button Width="100" Height="50" ContextMenu="{StaticResource MyMenu}">
contextmenu
</Button>
</Grid>
</Window>请高人指点...不胜感激

Answer 1

这里有一个完整的 Theme，你可以研究一下原生态的 ContextMenu 和 MenuItem 是怎么画出来的，只要你能够理解了，相信你想做出什么其它效果都不会有问题了。http://msdn.microsoft.com/en-us/library/aa972144.aspx

Answer 2

问：0009
Microsoft.Windows.Themes在哪个dll里啊？

Answer 3

在各个单独的样式DLL中有不同的实现吗？ 如 PresentationFramework.Aero，PresentationFramework.Luna，PresentationFramework.Royale 等。

Answer 4

不明白。你提到的那个Aero Sample下载后里面有个ResourceDictionary xaml<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:theme="clr-namespace:Microsoft.Windows.Themes"
                    xmlns:ui="clr-namespace:System.Windows.Documents;assembly=PresentationUI">这些部分是哪里来的。btw，我在用win03...

Answer 5

其实这些Themes都可以认为是第三方的，所以MS也把它的命名空间命名为：Microsoft....，而不是System....其实这个只要看看代码就行了，我自己是在这里面学到很多XAML的知识和技巧，至于要在程序中引用的话直接调它的DLL就OK。

Answer 6

大哥，我现在正是在问这些DLL是哪��来的

Answer 7

使WPF程序应用预置的控件风格, 如Aero, Luna, Royale, Classic等

Answer 8

C:\Program Files\Reference Assemblies\Microsoft\Framework\v3.0

Answer 9

got it. 没有你那个文章链接，还真不知道去哪儿找呢。thank you.

Answer 10

to: 0009
PresentationFramework.Aero.dll这个assembly里的内容就是上面那个Aero Sample里的ResourceDictionary吗？

Answer 11

其实还是有问题。<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:theme="clr-namespace:Microsoft.Windows.Themes"
                    xmlns:ui="clr-namespace:System.Windows.Documents;assembly=PresentationUI">红色部分貌似和C:\Program Files\Reference Assemblies\Microsoft\Framework\v3.0里的那几个DLL没什么关系。

Answer 12

不是的，我想问的是PresentationUI.dll是哪里来的，还有Microsoft.Windows.Themes在哪个DLL里定义的？
引用PresentationFramework.Aero.dll后，还是提示Microsoft.Windows.Themes是找不到啊

Answer 13

PresentationUI已经注册到 C:\WINDOWS\assembly 的了。
Microsoft.Windows.Themes是在PresentationFramework.Aero.dll中定义的。我也没去重新编译过这个样式，你为什么要去重新编译它啊？

Answer 14

头部：
xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"原来加上红色部分就行了。
PresentationUI.dll是从百度搜到的。真怪，这家伙是哪来的？<Style x:Key="BaseButtonStyle"
           TargetType="{x:Type ButtonBase}">
        <Setter Property="FocusVisualStyle"
                Value="{StaticResource ButtonFocusVisual}"/>
        <Setter Property="Background"
                Value="{StaticResource ButtonNormalBackground}"/>
        <Setter Property="BorderBrush"
                Value="{StaticResource ButtonNormalBorder}"/>
        <Setter Property="BorderThickness"
                Value="1"/>
        <!--<Setter Property="Foreground"
                Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>-->
        <Setter Property="Foreground"
                Value="Black"/>源代码中粗体部分提示有错误，其他好像没什么问题了。呵呵。有点意思。

Answer 15

恩 我也再看WPF 做皮肤这方面的 呵呵

Answer 16

不是重新编译的问题，Aero Sample里的那个ResourceDictionary里
<ResourceDictionary xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
                    xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
                    xmlns:theme="clr-namespace:Microsoft.Windows.Themes;assembly=PresentationFramework.Aero"
                    xmlns:ui="clr-namespace:System.Windows.Documents;assembly=PresentationUI"
                    >
如果不加红色部分会提示错误还有我新建的wpf项目里PresentationUI并不是默认引用的:-)其实也就这点问题。

Answer 17

<!--<Setter Property="Foreground"
Value="{DynamicResource {x:Static SystemColors.ControlTextBrushKey}}"/>-->这一行应该跟PresentationUI没什么关系吧？

Answer 18

我不是有研究精神，我现在是逃避呼。这两天一直看MVVM，那个老外写的示例太TM复杂了搞的我头痛现在是借事逃避一会儿:-)

Answer 19

没关系，不过会提示ResourceDictionary里有错误（就是这一行），我不知道要用到SystemColors，是不是还需要引用别的dll.

Answer 20

SystemColors是System.Drawing中的，而且应该是在http://schemas.microsoft.com/winfx/2006/xaml/presentation中定义。

Answer 21

to: 0009你现在在silverlight/WPF项目里用到MVVM了吗？

Answer 22

我是第一次听说，刚才GOOGLE了才知道的哈

Answer 23

可能是我在app.xaml和MainWindow.xaml里两次引用了ResourceDictionary，所以出现了点问题。
现在OK了。Button变漂亮了，Scrollbar变漂亮了我也变漂亮了。多么美好的一天啊:-)

Answer 24

顺便说一下，我现在看的是这个:
http://msdn.microsoft.com/en-us/magazine/dd419663.aspx#id0090009有空你也看看，互相沟通沟通:-)

Answer 25

0009我看了ContextMenu和MenuItem,也去试过了,始终没有找到如何去改第二级菜单的背景.

Answer 26

我看了一下，确实是比较麻烦，直观上可以看出，虽然你重写了 ItemsPanel， 但是它后面还有一个背景色没有被去掉，我用以下代码测试了一下：1. 在MenuItem11上加了一个事件，用于测试。
<MenuItem Header="MenuItem11" Click="MenuItem_Click" />2. 在事件中处理：
private void MenuItem_Click(object sender, RoutedEventArgs e)
{
    StringBuilder ancestors = new StringBuilder();
    UIElement element = sender as UIElement;
    while (element != null)
    {
        ancestors.AppendFormat("{0} [{1}]", element.ToString(), element.GetValue(FrameworkElement.NameProperty));
        try
        {
            var bg = (System.Windows.Media.Brush)element.GetType().InvokeMember("Background",
                            BindingFlags.Instance | BindingFlags.GetProperty | BindingFlags.Public,
                            null, element, null);
            ancestors.AppendFormat(": {0}\r\n", bg);
        }
        catch
        {
            ancestors.Append("\r\n");
        }
        element = VisualTreeHelper.GetParent(element) as UIElement;
    }
    MessageBox.Show(ancestors.ToString());
}得到以下结果：
System.Windows.Controls.MenuItem Header:MenuItem11 Items.Count:0 []: #00FFFFFF
System.Windows.Controls.StackPanel []: System.Windows.Media.LinearGradientBrush
System.Windows.Controls.ItemsPresenter []
System.Windows.Controls.ScrollContentPresenter []
System.Windows.Controls.Border []: 
System.Windows.Controls.Grid []: 
System.Windows.Controls.ScrollViewer []: 
System.Windows.Controls.ContentPresenter []
System.Windows.Controls.Grid []: 
System.Windows.Controls.Border []: #FFF5F5F5
System.Windows.Controls.ContentControl [SubMenuBorder]: 
Microsoft.Windows.Themes.SystemDropShadowChrome [Shdw]
System.Windows.Documents.NonLogicalAdornerDecorator []
System.Windows.Controls.Decorator []
System.Windows.Controls.Primitives.PopupRoot []可以看出，我们所写的ItemsPanel是起作用了：StackPanel []:System.Windows.Media.LinearGradientBrush但是，在其外层有一个Border的背景色是#FFF5F5F5，问题就出在这里了，我们以这个Border的父元素ContentControl [SubMenuBorder]到昨天我给你的Themes文件中查看一下，搜索关键字 SubMenuBorder 可以找到以下代码：    <ControlTemplate x:Key="{ComponentResourceKey TypeInTargetAssembly={x:Type MenuItem}, ResourceId=TopLevelHeaderTemplateKey}"
                     TargetType="{x:Type MenuItem}">
......
                <theme:SystemDropShadowChrome Name="Shdw"
                                              Color="Transparent">
                    <ContentControl Name="SubMenuBorder"
                                    Template="{DynamicResource {ComponentResourceKey TypeInTargetAssembly={x:Type FrameworkElement}, ResourceId=SubmenuContent}}"
                                    IsTabStop="false">
                        <ScrollViewer CanContentScroll="true"
                                      Style="{DynamicResource {ComponentResourceKey TypeInTargetAssembly={x:Type FrameworkElement}, ResourceId=MenuScrollViewer}}">
                            <ItemsPresenter Margin="2"
                                            KeyboardNavigation.TabNavigation="Cycle"
                                            KeyboardNavigation.DirectionalNavigation="Cycle"
                                            SnapsToDevicePixels="{TemplateBinding SnapsToDevicePixels}"
                                            Grid.IsSharedSizeScope="true"/>
                        </ScrollViewer>
                    </ContentControl>
                </theme:SystemDropShadowChrome>
            </Popup>
        </Grid>
......
    </ControlTemplate>顺藤摸瓜可以找到SubmenuContent的定义：
    <ControlTemplate x:Key="{ComponentResourceKey TypeInTargetAssembly={x:Type FrameworkElement}, ResourceId=SubmenuContent}"
                     TargetType="{x:Type ContentControl}">
        <Border Background="#F5F5F5"
                BorderBrush="#FF959595"
                BorderThickness="1">
            <Grid>
                <Rectangle Fill="#F1F1F1"
                           HorizontalAlignment="Left"
                           Width="28"
                           Margin="2"
                           RadiusX="2"
                           RadiusY="2"/>
                <Rectangle HorizontalAlignment="Left"
                           Width="1"
                           Margin="30,2,0,2"
                           Fill="#E2E3E3"/>
                <Rectangle HorizontalAlignment="Left"
                           Width="1"
                           Margin="31,2,0,2"
                           Fill="White"/>                <ContentPresenter Grid.ColumnSpan="2" Margin="1,0"/>
           </Grid>
        </Border>
    </ControlTemplate>
在此我们看到了关键的一行代码：
<Border Background="#F5F5F5"
正是这行代码阻挡了你的透明背景。我个人认为这是设计上一个小小的缺陷。从上面的分析可以看出，如果你非要实现这个透明背景，那么重写MenuItem的Template应该是唯一途径了。

Answer 27

谢谢 0009了,讲的太棒拉
很精辟, 我照着你给的思路去改了,做到透明拉,ContentControl [SubMenuBorder]到昨天我给你的Themes文件中查看一下，搜索关键字 SubMenuBorder 可以找到以下代码
<ControlTemplate x:Key="{ComponentResourceKey TypeInTargetAssembly={x:Type MenuItem}, ResourceId=TopLevelHeaderTemplateKey}"
好象应该是要去找ResourceId=SubmenuHeaderTemplateKey结贴了.