以前制作类似于垂直菜单功能的控件我都是Listbox和一个Popup实现的,今天尝试着用Menu做了一个简单垂直菜单,就当是做了个小练习写了这篇随笔~;

有什么不对的地方希望大家指正,分享和记录也是一个学习和提高的过程^-^。

先看看效果图(颜色搭配不是很合理有些难看):

实现方式就是重写了Menu和MenuItem的样式,绿色的地方是可以添加Icon的,只是简单的用Rectangle代替了(还是能说明问题的)

  <Style TargetType="{x:Type Menu}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type Menu}">
<Border CornerRadius="0">
<ItemsPresenter/>
</Border>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style> <Style TargetType="{x:Type MenuItem}">
<Setter Property="Template">
<Setter.Value>
<ControlTemplate TargetType="{x:Type MenuItem}">
<Border Margin="0,2" x:Name="bd" Background="#CCCCCC" MinWidth="100" CornerRadius="0">
<Grid>
<Grid.ColumnDefinitions>
<ColumnDefinition Width="30"/>
<ColumnDefinition/>
</Grid.ColumnDefinitions>
<Rectangle Fill="#99CC66" Height="20" Width="20"/>
<ContentPresenter Margin="0,10" ContentSource="Header" Grid.Column="1" HorizontalAlignment="Left"/>
<Popup x:Name="pop" Margin="10" IsOpen="{TemplateBinding IsSubmenuOpen}" AllowsTransparency="True" Placement="Right">
<Border Margin="5" CornerRadius="5" Background="#FFCCCC">
<StackPanel IsItemsHost="True">
</StackPanel>
</Border>
</Popup>
</Grid>
</Border>
<ControlTemplate.Triggers>
<Trigger Property="IsMouseOver" Value="true">
<Setter TargetName="bd" Property="Background" Value="#0099CC"/>
<Setter TargetName="pop" Property="IsOpen" Value="true"/>
</Trigger>
<Trigger Property="IsMouseOver" Value="False">
<Setter TargetName="pop" Property="IsOpen" Value="false"/>
</Trigger>
<Trigger Property="IsPressed" Value="True">
<Setter TargetName="bd" Property="Background" Value="#FF6666"/>
<Setter TargetName="pop" Property="IsOpen" Value="false"/>
</Trigger>
</ControlTemplate.Triggers>
</ControlTemplate>
</Setter.Value>
</Setter>
</Style>
  <StackPanel Width="100" HorizontalAlignment="Left">
<Menu>
<MenuItem Header="开始">
<MenuItem Header="开始"></MenuItem>
<MenuItem Header="开始"></MenuItem>
<MenuItem Header="开始"></MenuItem>
<MenuItem Header="开始"></MenuItem>
</MenuItem>
</Menu>
<Menu>
<MenuItem Header="哈哈">
<MenuItem Header="哈哈"></MenuItem>
<MenuItem Header="哈哈"></MenuItem>
<MenuItem Header="哈哈"></MenuItem>
<MenuItem Header="哈哈"></MenuItem>
</MenuItem>
</Menu>
<Menu>
<MenuItem Header="哦哦">
<MenuItem Header="好看啦啦啦"></MenuItem>
<MenuItem Header="啦啦啦"></MenuItem>
<MenuItem Header="啦啦啦"></MenuItem>
<MenuItem Header="啦啦啦"></MenuItem>
</MenuItem>
</Menu>
</StackPanel>

代码不多一点点,没有实现具体的什么功能,要是真要这么用还得做一部分工作的,这只是个显示效果而已。

WPF一个简单的垂直菜单样式的实现的更多相关文章

  1. WPF 一个简单的颜色选择器

    原文:WPF 一个简单的颜色选择器 版权声明:本文为博主原创文章,未经博主允许不得转载. https://blog.csdn.net/BYH371256/article/details/8340999 ...

  2. Expression Blend4经验分享:制作一个简单的图片按钮样式

    这次分享如何做一个简单的图片按钮经验 在我的个人Silverlight网页上,有个Iphone手机的效果,其中用到大量的图片按钮 http://raimon.6.gwidc.com/Iphone/de ...

  3. Expression Blend4经验分享:制作一个简单的文字按钮样式

    首先在Grid里放一个TextBlock,对象时间线窗口的结构树如下 右键点击grid,选择构成控件 会弹出构成控件的对话框,选择你要构成的控件类型,控件名称,控件样式存储位置 这里我们选择butto ...

  4. js写的一个简单的手风琴菜单

    1 <!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8&q ...

  5. 14、Semantic-UI之菜单样式

    14.1 基础菜单样式   在Semantic-UI中使用class="ui menu". 示例:定义基础菜单样式 <div class="ui menu" ...

  6. 简单的dialog菜单

    本文介绍的是我自己做的一个简单的dialog菜单,可以直接植入到类中. 方法代码: /** 显示一个靠右上的dialog列表菜单*/private void showTopBarRightButton ...

  7. Prism for WPF 搭建一个简单的模块化开发框架(三) 给TreeView加样式做成菜单

    原文:Prism for WPF 搭建一个简单的模块化开发框架(三) 给TreeView加样式做成菜单 昨天晚上把TreeView的样式做了一下,今天给TreeView绑了数据,实现了切换页面功能 上 ...

  8. Prism for WPF 搭建一个简单的模块化开发框架(六)隐藏菜单、导航

    原文:Prism for WPF 搭建一个简单的模块化开发框架(六)隐藏菜单.导航 这个实际上是在聊天之前做的,一起写了,也不分先后了 看一下效果图,上面是模块主导航,左侧是模块内菜单,现在加一下隐藏 ...

  9. Prism for WPF 搭建一个简单的模块化开发框架(一)

    原文:Prism for WPF 搭建一个简单的模块化开发框架(一) 最近闲来无事又想搞搞WPF..... 做个框架吧,可能又是半途而废....总是坚持不下来 不废话了, 先看一下工程结构 布局大概是 ...

随机推荐

  1. 配置SQL Server 2008管理器

    SQl Server 配置管理器(简称为配置管理器)包含了SQL Server 2008服务.SQL Server 2008网络配置和SQL Native Client配置3个工具,供数据库管理人员做 ...

  2. Ubuntu10.04下载并编译Android4.3源代码

    注:转载或引用请标明出处    http://blog.csdn.net/luzhenrong45/article/details/9719433 去年用Ubuntu10.10成功下载并编译Andro ...

  3. How to Map Distinct Value Types Using Java Generics--reference

    原文:http://www.codeaffine.com/2015/03/04/map-distinct-value-types-using-java-generics/ Occasionally t ...

  4. 【转】int const A::func()和int A::func() const

    int const A::func() { return 0; }int A::func() const { return 0; } 上面的代码是合法的,其中A::func成员函数[只能在成员函数后面 ...

  5. C# 之 SqlConnection 类

    一.常用属性 [1]ConnectionString  获取或设置用于打开 SQL Server 数据库的字符串. (重写 DbConnection.ConnectionString.) [2]Con ...

  6. 在IOS中 NSRange类详解

    NSRange的定义 typedef struct _NSRange { NSUInteger location; NSUInteger length; } NSRange; NSRange是一个结构 ...

  7. aggregations 详解1(概述)

    aggregation分类 aggregations —— 聚合,提供了一种基于查询条件来对数据进行分桶.计算的方法.有点类似于 SQL 中的 group by 再加一些函数方法的操作. 聚合可以嵌套 ...

  8. VSPackge插件系列:常用IDE功能的封装

    继上一篇VSPackge插件系列简单介绍如何正确的获取DTE之后,就一直没发VSPackge插件系列的文章了,最近同事也想了解如何在代码中与VS交互,特发一篇文章示例一些简单功能是如何调用,也以备以后 ...

  9. RGBa颜色 css3的Alpha通道支持

    CSS3中,RGBa 为颜色声明添加Alpha通道. RGB值被指定使用3个8位无符号整数(0 – 255)并分别代表红色.蓝色.和绿色.增加的一个alpha通道并不是一个颜色通道——它只是用来指定除 ...

  10. ThinkPHP的配置

    ThinkPHP配置:conf目录下 'URL_PATHINFO_DEPR'=>'-',//修改URL的分隔符, 'TMPL_L_DELIM'=>'<{', //修改左定界符 'TM ...