Silverlight入门系列]右键菜单ContextMenu工具栏Toolbar和SplitButton

概述 Silverlight4 Toolkit提供了ContextMenu和MenuItem控件来实现右键菜单，很方便。另外， Silverlight4 Toolkit提供了 PopUp控件来实现d出式内容，里面可以放任何子控件，利用 IsOpen属性来控制显示隐藏。Silverlight工具栏Toolbar制作也很简单，就是用一个StackPanel横向摆一些button即可，button的内容  Silverlight4 Toolkit提供了ContextMenu和MenuItem控件来实现右键菜单，很方便。另外， Silverlight4 Toolkit提供了 PopUp控件来实现d出式内容，里面可以放任何子控件，利用 IsOpen属性来控制显示隐藏。Silverlight工具栏Toolbar制作也很简单，就是用一个StackPanel横向摆一些button即可，button的内容就是图片，或者图片加文字均可。 上下文菜单ContextMenu的Silverlight Demo源码下载请点击 这儿， SplitButton的Silverlight Demo源码下载请点击 这儿，Silverlight工具栏Toolbar的源码在本文末尾。另外微软的一款Silverlight Split button的源码在 这儿下载。各种实现效果如下几幅图： Silverlight Splitbutton

Silverlight ContextMenu

 

Silverlight工具栏 Toolbar

 

 

上下文菜单ContextMenu的Silverlight Demo源码下载请点击 这儿， SplitButton的Silverlight Demo源码下载请点击 这儿

 

< splitbutton:Splitbutton  Content ="Open"  Click ="Open_Click" >
                 splitbutton:Splitbutton.buttonMenuItemsSource
                     toolkit:MenuItem  header
                         toolkit:MenuItem.Icon
                             Image  Source ="/SilverlightApplication3;component/images/search.png"  WIDth ="14"  Height ="14" /> </ toolkit:MenuItem ="Open read-only" ="OpenReadonly_Click" ="Open as copy" ="Opencopy_Click"
             splitbutton:Splitbutton >

Silverlight Splitbutton源码

  1  using  System;
  2   System.Collections.ObjectModel;
  3   System.windows;
  4   System.windows.Controls;
  5   System.windows.input;
  6 
  7  namespace  Delay
  8  {
  9       ///   <summary>  10   Implements a "split button" for Silverlight and WPF.
 11  </summary>
 12      [TemplatePart(name  =  SplitElementname, Type    typeof (UIElement))]
 13       public class  Splitbutton : button
 14      {
 15            16   Stores the public name of the split element.
 17   18           private const string  SplitElementname  " SplitElement " ;
 19   20   21   Stores a reference to the split element.
 22   23   UIElement _splitElement;
 24   25   26   Stores a reference to the ContextMenu.
 27   28   ContextMenu _contextMenu;
 29   30   31   32   Stores the initial location of the ContextMenu.
 33   34   Point _contextMenuInitialOffset;
 35   36   37   Stores the backing collection for the buttonMenuItemsSource property.
 38   39   ObservableCollection < object >  _buttonMenuItemsSource  new ();
 40   41   42   Gets the collection of items for the split button's menu.
 43   44   Collection  buttonMenuItemsSource {  get  {  return  _buttonMenuItemsSource; } }
 45   46   47   Gets or sets a value indicating whetherthe mouse is over the split element.
 48   49  protected bool  IsMouSEOverSplitElement {  ;  set ; }
 50   51   52   Initializes a new instance of the Splitbutton class.
 53   54   Splitbutton()
 55          {
 56              DefaultStyleKey  (Splitbutton);
 57          }
 58   59   60   Called when the template is changed.
 61   62  overrIDe voID  OnApplyTemplate()
 63   64               //  Unhook existing handlers  65  if  ( null !=  _splitElement)
 66              {
 67                  _splitElement.MouseEnter  -=  MouseEventHandler(SplitElement_MouseEnter);
 68                  _splitElement.MouseLeave   MouseEventHandler(SplitElement_MouseLeave);
 69                  _splitElement   70              }
 71   _contextMenu)
 72   73                  _contextMenu.Opened   RoutedEventHandler(ContextMenu_Opened);
 74                  _contextMenu.Closed   RoutedEventHandler(ContextMenu_Closed);
 75                  _contextMenu   76   77   78   Apply new template  79  base .OnApplyTemplate();
 80   81   Hook new event handlers  82              _splitElement   GetTemplateChild(SplitElementname)  as  UIElement;
 83   84   85  +=  86   87   88   ContextMenuService.GetContextMenu(_splitElement);
 89                    90                  {
 91   92                      _contextMenu.Opened   93                      _contextMenu.Closed   94                  }
 95   96   97   98   99   Called when the button is clicked.
100  101   OnClick()
102  103   (IsMouSEOverSplitElement)
104  105                  OpenbuttonMenu();
106  107  else 108  109  .OnClick();
110  111  112  113  114   Called when a key is pressed.
115  116   OnKeyDown(KeyEventArgs e)
117  118  ==  e)
119  120  throw  ArgumentNullException( e );
121  122  123   ((Key.Down   e.Key)  ||  (Key.Up   e.Key))
124  125   WPF requires this to happen via BeginInvoke 126                  dispatcher.BeginInvoke((Action)(()  =>  OpenbuttonMenu()));
127  128  129  130  .OnKeyDown(e);
131  132  133  134  135   Opens the button menu.
136  137   OpenbuttonMenu()
138  139   (( 0  _buttonMenuItemsSource.Count)  &&  _contextMenu))
140  141                  _contextMenu.HorizontalOffset  142                  _contextMenu.VerticalOffset  143                  _contextMenu.IsOpen  true 144  145  146  147  148   Called when the mouse goes over the split element.
149  </summary> 150  <param name="sender"> Event source. </param> 151  <param name="e"> Event arguments. </param> 152   SplitElement_MouseEnter(  sender, MouseEventArgs e)
153  154              IsMouSEOverSplitElement  155  156  157  158   Called when the mouse goes off the split element.
159  160  161  162   SplitElement_MouseLeave( 163  164  false 165  166  167  168   Called when the ContextMenu is opened.
169  170  171  172   ContextMenu_Opened( 173  174   Offset the ContextMenu correctly 175  176              _contextMenuInitialOffset   _contextMenu.transformToVisual( ).transform(  Point());
177  178              UpdateContextMenuOffsets();
179  180   Hook LayoutUpdated to handle application resize and zoom changes 181              LayoutUpdated   EventHandler(Splitbutton_LayoutUpdated);
182  183  184  185   Called when the ContextMenu is closed.
186  187  188  189   ContextMenu_Closed( 190  191   No longer need to handle LayoutUpdated 192  193  194   Restore focus to the button 195              Focus();
196  197  198  199   Called when the ContextMenu is open and layout is updated.
200  201  202  203   Splitbutton_LayoutUpdated( 204  205  206  207  208  209   Updates the ContextMenu's Horizontal/VerticalOffset propertIEs to keep it under the Splitbutton.
210  211   UpdateContextMenuOffsets()
212  213   Calculate desired offset to put the ContextMenu below and left-aligned to the button 214  215              Point currentOffset   _contextMenuInitialOffset;
216              Point desiredOffset   transformToVisual(Application.Current.RootVisual).transform(  Point( , ActualHeight));
217  218              _contextMenu.HorizontalOffset   desiredOffset.X  -  currentOffset.X;
219              _contextMenu.VerticalOffset   desiredOffset.Y   currentOffset.Y;
220   Adjust for RTL 221   (FlowDirection.RightToleft   FlowDirection)
222  223                  _contextMenu.UpdateLayout();
224   _contextMenu.ActualWIDth;
225  226  227  228  229      }
230  }

 

Silverlight工具栏 Toolbar源码

 

GrID  Height ="33"  HorizontalAlignment ="Stretch"  margin ="0,5,0"  name ="grID1"  VerticalAlignment ="top" ="auto" border  borderThickness ="0"  Background ="transparent"  CornerRadius ="3"  borderBrush ="Gray" GrID GrID.ColumnDeFinitions
                                 ColumnDeFinition  WIDth ="*" ="auto"

                             sdk:DataPager  GrID.Column ="1" ="24" ="left" ="dataPager1"  PageSize ="10" ="169"  borderThickness  autoEllipsis ="True"  AllowDrop ="False"  displayMode ="FirstLastPrevIoUsNext"  IsTotalitemCountFixed StackPanel  ="stackPanel1" ="Center"  OrIEntation ="Horizontal" button  ="30"  padding ="5"  Cursor ="Hand" ="tsbAddNew" ="transparent"
                                     button.Content
                                         OrIEntation
                                             Opacity ="0.7" ="-2,-2,0)"> Source ="/SilverlightApplication2;component/images/plus.png" ="16" TextBlock  Text ="Add New Person" ="5,0)">StackPanel button   padding ="tsbTest3" ="10,255)">="/SilverlightApplication2;component/images/zoom.png" ="Advanced Search" ="tsbTest" ="/SilverlightApplication2;component/images/refresh2.png" ="Refresh" border >

 

菜单、d出式菜单和鼠标经过按钮出现的下拉菜单

这个开源（LPGL协议）的不错哦，用法是这样的：

name ="button1" ="50" />
     my:PopupMenu  RightClickElements  leftClickElements  AccessShortcut ="Ctrl+Alt+M" >
         ListBox >
             my:PopupMenuItem  ="Menu1" />
             my:PopupMenuSeparator  ="SubMenuheader1"  ImageRightSource ="images/arrow.png" >
                 my:PopupMenu >
                     >
                         ="SubMenu1" />
                     my:PopupMenuItem ="Menu2" ="Menu3" />
         >
>

在CodeBehind里面：

 

this.myMenu.AddTrigger(TriggerTypes.Hover,  this.button1);

这样鼠标经过button1就会浮出菜单。同时支持MVVM的Command和CommandParameter，不错。

总结

以上是内存溢出为你收集整理的Silverlight入门系列]右键菜单ContextMenu工具栏Toolbar和SplitButton全部内容，希望文章能够帮你解决Silverlight入门系列]右键菜单ContextMenu工具栏Toolbar和SplitButton所遇到的程序开发问题。

如果觉得内存溢出网站内容还不错，欢迎将内存溢出网站推荐给程序员好友。