Asp.net 2.0 自定义控件开发[浮动工具条控件](示例代码下载)

.

.

(一). 概述

        控件名称: 浮动工具条控件, 可用于GridView等列表控件的一些常用快捷操作, 涉及到公司代码版权, 目前版本不是最终版本, 且去除了一些代码, 后面可下载的仅为纯控件开发技术相关代码.  通过扩展可以任意定制需要的功能. 里面一些设计思想也具有参考价值.  

Author:【夜战鹰】【ChengKing(ZhengJian)】

(二). 控件运行效果截图

 

(三). 代码部分

1. 主控件类PopupTraceMenu代码

  1  ///   <summary>
  2  ///  Author: 【金鹰】【专注于DotNet技术】【ChengKing(ZhengJian)】
  3  ///  Blog:   Http://blog.csdn.net/ChengKing
  4  ///   </summary>
  5 
  6  using  System;
  7  using  System.Collections.Generic;
  8  using  System.ComponentModel;
  9  using  System.Text;
 10  using  System.Web;
 11  using  System.Web.UI;
 12  using  System.Web.UI.WebControls;
 13  using  System.Web.UI.HtmlControls;
 14 
 15  namespace  TraceMenu
 16  {
 17      [DefaultProperty( " TargetControl " )]
 18      [ToolboxData( " <{0}:PopupTraceMenu runat=server></{0}:PopupTraceMenu> " )]    
 19      [ParseChildren( true ,  " Items " )]
 20      [PersistChildren( false )]
 21       public   class  PopupTraceMenu : Control
 22      {
 23           #region  类变量
 24 
 25           private  FloatMenu _Items  =   new  FloatMenu();
 26 
 27           #endregion
 28 
 29           #region  属性
 30 
 31           ///   <summary>
 32           ///  菜单变量, 其用于存放子菜单项集合
 33           ///   </summary>
 34          [PersistenceMode(PersistenceMode.InnerDefaultProperty)]
 35          [DesignerSerializationVisibility(DesignerSerializationVisibility.Content)]
 36          [Description( " 获取或设置菜单项集合 " )]
 37          [Category( " 杂项 " )]        
 38          [NotifyParentProperty( true )]
 39          [TypeConverter( typeof (CollectionConverter))]
 40          [DesignOnly( false )]            
 41           public  FloatMenu Items
 42          {
 43               get
 44              {
 45                   if  (_Items  ==   null )
 46                  {
 47                      _Items  =   new  FloatMenu();
 48                  }
 49                   return  _Items;
 50              }
 51          }
 52 
 53           ///   <summary>
 54           ///  获取或设置菜单
 55           ///   </summary>
 56          [Browsable( false )]
 57          [Description( " 获取或设置菜单 " )]
 58           public  FloatMenu Menu
 59          {
 60               get
 61              {
 62                   return  _Items;
 63              }
 64               set
 65              {
 66                   this ._Items.Clear();
 67                   foreach  (FloatMenuItem item  in  value)
 68                  {
 69                       this ._Items.Add(item);
 70                  }
 71              }
 72          }        
 73 
 74           ///   <summary>
 75           ///  设置此控件的目标(寄主)控件
 76           ///   </summary>
 77          [Bindable( true )]
 78          [Category( " 数据 " )]
 79          [DefaultValue( "" )]
 80          [Description( " 设置此控件的目标(寄主)控件 " )]
 81          [TypeConverter( typeof (ControlIDConverter))]  
 82           public   string  TargetControl
 83          {
 84               get
 85              {
 86                  String s  =  (String)ViewState[ " TargetControl " ];
 87                   return  ((s  ==   null )  ?  String.Empty : s);                                                
 88              }
 89               set
 90              {
 91                  ViewState[ " TargetControl " ]  =  value;
 92              }
 93          }
 94 
 95          [Browsable( true )]
 96          [Category( " CSS样式 " )]
 97          [Description( " 获取或设置控件的OnMouseOver样式 " )]
 98           public   string  CSS_ONMOUSEOVER_CLASSNAME
 99          {
100               get
101              {
102                   string  s  =  ( string )ViewState[ " CSS_ONMOUSEOVER " ];
103                   return  ((s  ==   null )  ?  String.Empty : s);
104              }
105               set
106              {
107                  ViewState[ " CSS_ONMOUSEOVER " ]  =  value;
108              }
109          }
110          [Browsable( true )]
111          [Category( " CSS样式 " )]
112          [Description( " 获取或设置控件的OnMouseOut样式 " )]
113           public   string  CSS_ONMOUSEOUT_CLASSNAME
114          {
115               get
116              {
117                   string  s  =  ( string )ViewState[ " CSS_ONMOUSEOUT " ];
118                   return  ((s  ==   null )  ?  String.Empty : s);
119              }
120               set
121              {
122                  ViewState[ " CSS_ONMOUSEOUT " ]  =  value;
123              }
124          }
125 
126           #endregion
127 
128           #region  方法
129 
130           protected   override   void  CreateChildControls()
131          {
132               base .CreateChildControls();
133          }
134 
135           protected   override   void  OnPreRender(EventArgs e)
136          {
137               // GridView增加FloatMenu
138              WebControl targetControl  =  (WebControl) this .FindControl(TargetControl);
139               // 给GridView头增加FloatMenu
140               // Control targetControl = this.FindControl(TargetControl).Controls[0].Controls[0];
141 
142               // 注册HiddenField字段，用于存储数据绑定控件，行的键值: DataRowKey.
143              Page.ClientScript.RegisterHiddenField( " hidden_row_key " ,  "" );
144 
145               if  ( ! Page.ClientScript.IsClientScriptBlockRegistered( this .GetType(),  " BuildMenu " ))
146              {
147                  Page.ClientScript.RegisterClientScriptBlock( this .GetType(),  " BuildMenu " ,
148                       " <script type='text/javascript' src='TraceMenuJScript.js'></script> " );
149              }
150 
151 
152               /// <summary>
153               ///  注册菜单项动态添加脚本
154               /// <summary>
155              StringBuilder strAddMenuItemScript  =   new  StringBuilder();
156               if  ( this .Items.Count  !=   0 )
157              {
158 
159                  strAddMenuItemScript.Append( "  function makeMenu "   +   this .UniqueID  +   " ()  " );
160                  strAddMenuItemScript.Append( "  {  " );
161                  strAddMenuItemScript.Append( "    var myMenu, item;   " );
162                  strAddMenuItemScript.Append( "                             " );
163                  strAddMenuItemScript.Append( "                                 " );
164                  strAddMenuItemScript.Append( "    popupMenu_divs='';           " );
165                  strAddMenuItemScript.Append( "    myMenu = new floatMenu();  " );
166                  strAddMenuItemScript.Append( "                                 " );
167                   foreach  (FloatMenuItem item  in   this .Items)
168                  {
169                       string  strImageSrc;
170                       try
171                      {
172                          strImageSrc  =  item.ImageSrc  +   string .Empty  ==   string .Empty  ?   "   "  :  base .ResolveUrl(item.ImageSrc);
173                      }
174                       catch
175                      {
176                          strImageSrc  =   "   " ;
177                      }
178 
179                       string  strCommand;
180                       try
181                      {
182                          strCommand  =  item.Command.Trim().Replace( " / "" ,  "' ").Replace("&nbsp;", "");
183                      }
184                       catch
185                      {
186                          strCommand  =   null ;
187                      }
188 
189 
190                       /// /添加自定义款项的 <DIV> 容器                    
191                       if  (item.Type.ToString().ToUpper()  ==   " CUSTOM " )
192                      {                        
193                           string  strClientID  =  item.Control.ClientID;
194                          strAddMenuItemScript.Append( "  var strDiv; popupMenu_divs+='DIV_ "   +  strClientID  +   " ,'; " );
195                          strAddMenuItemScript.Append( "  strDiv= / " < div id = ' DIV_" + strClientID + " '   "  +  "  style = ' BACKGROUND-COLOR: #ffffff; BORDER: #000000 1px solid; TOP: 0px; LEFT:0px; Z-INDEX: 15; POSITION: absolute; display:none; ' > / " ;   " );
196                          strAddMenuItemScript.Append( "  strDiv+='</div>';  " );
197                          strAddMenuItemScript.Append( "  document.write(strDiv); " );                        
198                      }
199 
200                       string  strClientId  =  item.Control  !=   null   ?  item.Control.ClientID :  "" ;                    
201                      
202                      strAddMenuItemScript.Append( "    item = new floatItem(' "   +  ((item.Text  +   string .Empty  ==   string .Empty)  ?   "   "  : item.Text)  +   " ',' "   +  strImageSrc  +   " ',/ ""  + (strCommand + string.Empty == string.Empty ?  ""  : strCommand) +  " / " ,' "   +  item.Type  +   " ',' "   +  strClientId  +   " ',' "   +   this .CSS_ONMOUSEOVER_CLASSNAME  +   " ',' "   +   this .CSS_ONMOUSEOUT_CLASSNAME  +   " '); " );
203                      strAddMenuItemScript.Append( "    myMenu.addItem(item);  " );
204                  }
205                  strAddMenuItemScript.Append( "   " );
206                  strAddMenuItemScript.Append( "  myMenu.show(this.document,popupMenu_divs,' "   +   this .UniqueID  +   " '); " );
207                  strAddMenuItemScript.Append( "   " );
208                  strAddMenuItemScript.Append( "  delete item; " );
209                  strAddMenuItemScript.Append( "   delete myMenu; " );
210                  strAddMenuItemScript.Append( "  } " );
211              }
212               else
213              {
214                  strAddMenuItemScript.Append( "  function makeMenu "   +   this .UniqueID  +   " ()  " );
215                  strAddMenuItemScript.Append( "  {  " );
216                   // strAddMenuItemScript.Append("   alert('No Set Items Property!');");
217                  strAddMenuItemScript.Append( "  } " );
218              }
219 
220               if  ( ! Page.ClientScript.IsClientScriptBlockRegistered( this .GetType(),  " AddMenuItemScript "   +   this .UniqueID))
221              {
222                  Page.ClientScript.RegisterClientScriptBlock( this .GetType(),  " AddMenuItemScript "   +   this .UniqueID, strAddMenuItemScript.ToString(),  true );
223              }
224 
225 
226               /// <summary>
227               ///  注册初始化脚本
228               /// <summary>
229              StringBuilder strInitScript  =   new  StringBuilder();
230               if  (targetControl  !=   null )
231              {
232                  strInitScript.Append( " <script text/javascript>  " );
233                  strInitScript.Append( "    makeMenu "   +   this .UniqueID  +   " (); var obj;   " );
234                  strInitScript.Append( "    if( document.all&&window.print )  " );
235                  strInitScript.Append( "    {  " );
236                  strInitScript.Append( "       var objClientId = ' "   +  targetControl.ClientID  +   " '; " );
237                  strInitScript.Append( "       if(objClientId != null)  " );
238                  strInitScript.Append( "       { " );
239                  strInitScript.Append( "          obj = document.getElementById(objClientId); " );
240                  strInitScript.Append( "          obj.style.cursor = 'default'; " );
241                  strInitScript.Append( "          document.onclick = forcehideMenu; " );
242 
243                   if  (targetControl.GetType().Name  !=   " GridView " )   // 临时修改为: "=="
244                  {
245                      targetControl.Attributes.Add( " onmouseenter " ,  " showMenu(' "   +   this .UniqueID  +   " '); " );
246                      strInitScript.Append( "      obj.onmousemove = moveMenu; " );
247                  }
248                  strInitScript.Append( "          obj.onmouseleave = hideMenu; " );
249                  strInitScript.Append( "          obj.oncontextmenu = showMenu; " );
250                  strInitScript.Append( "       } " );
251                  strInitScript.Append( "       else {alert('Please Set TargetControl Property!')} " );
252                  strInitScript.Append( "    }  " );
253                  strInitScript.Append( " </script> " );
254              }
255      
256               if  ( ! Page.ClientScript.IsStartupScriptRegistered( this .GetType(),  " InitScript "   +   this .UniqueID))
257              {
258                  Page.ClientScript.RegisterStartupScript( this .GetType(),  " InitScript "   +   this .UniqueID,
259                      strInitScript.ToString());
260              }
261 
262               /// <summary>
263               /// 给数据绑定控件的行(DataRow)注册弹出悬浮菜单脚本      
264               /// <summary>
265               if  (targetControl  !=   null )
266              {
267                   switch  (targetControl.GetType().Name.ToUpper())
268                  {
269                       case   " GRIDVIEW " :
270                          {
271                              GridView gv  =  (GridView)targetControl;
272 
273                               for  ( int  i  =   0 ; i  <  gv.Rows.Count; i ++ )
274                              {
275                                   object  key  =  gv.DataKeys[i].Value;
276                                   // gv.Rows[i].Attributes.Add("onmouseenter", "window.status='表格控件的当前行主键为: " + key + "';" + "showRowMenu('" + key + "','" + this.UniqueID + "')");
277                                  gv.Rows[i].Attributes.Add( " onmouseenter " ,  " showRowMenu(' "   +  key  +   " ',' "   +   this .UniqueID  +   " ') " );
278                                  gv.Rows[i].Attributes.Add( " onmousemove " ,  " moveMenu(); " );
279                                  gv.Rows[i].Attributes.Add( " onmouseleave " ,  " hideMenu(); " );
280                              }
281 
282                          };  break ;
283                  }
284              }
285 
286               base .OnPreRender(e);           
287          }
288 
289           protected   override   void  Render(HtmlTextWriter writer)
290          {
291               if  (DesignMode)
292              {
293                   this .Controls.Clear();
294                  LiteralControl lc  =   new  LiteralControl();
295                  lc.Text  =   " [PopupTraceMenu / " PopupTraceMenu11/ " ] " ;
296                   this .Controls.Add(lc);
297              }
298 
299               foreach  (FloatMenuItem item  in   this .Items)
300              {
301                   try
302                  {
303                       if (item.Control.Page  ==   null   &&  item.Control.Parent  ==   null )
304                      {
305                         item.Control.RenderControl(writer);
306                      }
307                  }
308                   catch (Exception)
309                  {
310                  }
311              }
312 
313               base .Render(writer);
314          }
315 
316           public   string  GetRowKey()
317          {
318               return  Page.Request.Form[ " hidden_row_key " ]  !=   null   ?  Page.Request.Form[ " hidden_row_key " ].ToString(): "" ;
319          }
320 
321           #endregion
322      }
323  }

2. 单个菜单项类FloatMenuItem代码

  1  ///   <summary>
  2  ///  Author: 【金鹰】【专注于DotNet技术】【ChengKing(ZhengJian)】
  3  ///  Blog:   Http://blog.csdn.net/ChengKing
  4  ///   </summary>
  5 
  6  using  System;
  7  using  System.Collections.Generic;
  8  using  System.ComponentModel;
  9  using  System.Text;
 10  // using System.Web;
 11  using  System.Web.UI;
 12  using  System.Web.UI.WebControls;
 13 
 14  namespace  TraceMenu
 15  {   
 16       ///   <summary>
 17       ///  单个菜单项类
 18       ///   </summary>
 19      [ToolboxItem( false )]
 20       public   class  FloatMenuItem 
 21      {
 22           private   string  _ImageSrc;
 23           private   string  _Text;
 24           private   string  _Command;
 25           private  TypeEnum _Type;        
 26           private  Control _Control;         
 27 
 28           ///   <summary>
 29           ///  默认构造方法
 30           ///   </summary>
 31           public  FloatMenuItem()
 32          { }
 33         
 34 
 35           ///   <summary>
 36           ///  [简单命令链接按钮]菜单项
 37           ///   </summary>
 38           ///   <param name="ImageSrc"> 菜单项显示的图片 </param>
 39           ///   <param name="Text"> 菜单项显示的文本 </param>
 40           ///   <param name="Command"> 点击菜单项执行的命令 </param>
 41           ///   <param name="Type"> 菜单项的类型, 包括: Link, Separator 和 Custom </param>               
 42           public  FloatMenuItem( string  ImageSrc,  string  Text,  string  Command, TypeEnum Type)
 43          {
 44               this ._ImageSrc  =  ImageSrc;
 45               this ._Text  =  Text;
 46               this ._Command  =  Command;
 47               this ._Type  =  Type;            
 48               this ._Control  =   null ;    
 49          }
 50 
 51           ///   <summary>
 52           ///  [自己定义组合控件]菜单项
 53           ///   </summary>
 54           ///   <param name="ImageSrc"> 菜单项显示的图片 </param>
 55           ///   <param name="Text"> 菜单项显示的文本 </param>         
 56           ///   <param name="Type"> 菜单项的类型, 包括: Link, Separator 和 Custom </param>       
 57           ///   <param name="c"> 自己定义组合控件的对象引用 </param>
 58           public  FloatMenuItem( string  ImageSrc,  string  Text, TypeEnum Type, Control c)
 59          {
 60               this ._ImageSrc  =  ImageSrc;
 61               this ._Text  =  Text;
 62               this ._Command  =   null ;
 63               this ._Type  =  Type;
 64               this ._Control  =  c;   
 65          }
 66 
 67           ///   <summary>
 68           ///  [分割符]菜单项
 69           ///   </summary>
 70           ///   <param name="Type"> 菜单项的类型, 包括: Link, Separator 和 Custom </param>       
 71           public  FloatMenuItem(TypeEnum Type)
 72          {
 73               this ._ImageSrc  =   null ;
 74               this ._Text  =   null ;
 75               this ._Command  =   null ;
 76               this ._Type  =  Type;            
 77               this ._Control  =   null ;
 78          }
 79 
 80           ///   <summary>
 81           ///  全部参数构造方法
 82           ///   </summary>
 83           ///   <param name="ImageSrc"> 菜单项显示的图片 </param>
 84           ///   <param name="Text"> 菜单项显示的文本 </param>
 85           ///   <param name="Command"> 点击菜单项执行的命令 </param>
 86           ///   <param name="Type"> 菜单项的类型, 包括: Link, Separator 和 Custom </param>       
 87           ///   <param name="c"> 自己定义组合控件的对象引用 </param>
 88           // public FloatMenuItem(string ImageSrc, string Text, string Command, TypeEnum Type, Control c)
 89           // {
 90           //     this._ImageSrc = ImageSrc;
 91           //     this._Text = Text;
 92           //     this._Command = Command;
 93           //     this._Type = Type;
 94           //     this._Control = c;
 95           // }
 96 
 97 
 98           ///   <summary>
 99           ///  命令图标路径
100           ///   </summary>
101           // [NotifyParentProperty(true)]
102           public   string  ImageSrc
103          {
104               get
105              {
106                   return  _ImageSrc; 
107              }
108               set  
109              {
110                  _ImageSrc  =  value; 
111              }
112          }       
113          
114           ///   <summary>
115           ///  菜单项显示的文本
116           ///   </summary>
117           // [NotifyParentProperty(true)]
118           public   string  Text
119          {
120               get  {  return  _Text; }
121               set  { _Text  =  value; }
122          }
123 
124                 
125           ///   <summary>
126           ///  所调用的命令按钮的ID
127           ///   </summary>
128           // [NotifyParentProperty(true)]
129           public   string  Command
130          {
131               get  {  return  _Command; }
132               set  { _Command  =  value; }
133          }
134          
135             
136           ///   <summary>
137           ///  右键菜单的项的类别
138           ///   </summary>
139           // [NotifyParentProperty(true)]
140           public  TypeEnum Type
141          {
142               get  {  return  _Type; }
143               set  { _Type  =  value; }
144          }          
145 
146 
147           public  Control Control
148          {
149               get  {  return  _Control; }
150               set  { _Control  =  value; }
151          }
152 
153      }
154  }

3. 菜单集合类FloatMenu代码

  1  ///   <summary>
  2  ///  Author: 【金鹰】【专注于DotNet技术】【ChengKing(ZhengJian)】
  3  ///  Blog:   Http://blog.csdn.net/ChengKing
  4  ///   </summary>
  5 
  6  using  System;
  7  using  System.Collections;
  8  using  System.Collections.Generic;
  9  using  System.ComponentModel;
 10  using  System.Web.UI;
 11 
 12  namespace  TraceMenu
 13  {
 14       ///   <summary>
 15       ///  菜单实现类[实用泛型集合]    
 16       ///   </summary>
 17      [
 18      ToolboxItem( false ),
 19      ParseChildren( true )
 20      ]
 21       public   class  FloatMenu :  List < FloatMenuItem >
 22      {       
 23 
 24           #region  定义构造函数
 25 
 26           public  FloatMenu() :  base ()
 27          {            
 28          }
 29 
 30           #endregion
 31 
 32           ///   <summary>
 33           ///  得到集合元素的个数
 34           ///   </summary>
 35           public   new   int  Count
 36          {
 37               get
 38              {
 39                   return   base .Count;
 40              }
 41          }
 42 
 43           ///   <summary>
 44           ///  表示集合是否为只读
 45           ///   </summary>
 46           public   bool  IsReadOnly
 47          {
 48               get
 49              {
 50                   return   false ;
 51              }
 52          }
 53           ///   <summary>
 54           ///  添加对象到集合
 55           ///   </summary>
 56           ///   <param name="item"></param>
 57           public   new   void  Add(FloatMenuItem item)
 58          {
 59               base .Add(item);
 60          }
 61 
 62           ///   <summary>
 63           ///  清空集合
 64           ///   </summary>
 65           public   new   void  Clear()
 66          {
 67               base .Clear();
 68          }
 69 
 70           ///   <summary>
 71           ///  判断集合中是否包含元素
 72           ///   </summary>
 73           ///   <param name="item"></param>
 74           ///   <returns></returns>
 75           public   new   bool  Contains(FloatMenuItem item)
 76          {
 77               return   base .Contains(item);
 78          }
 79 
 80           ///   <summary>
 81           ///  移除一个对象
 82           ///   </summary>
 83           ///   <param name="item"></param>
 84           ///   <returns></returns>
 85           public   new   bool  Remove(FloatMenuItem item)
 86          {
 87               return   base .Remove(item);
 88          }
 89 
 90           public   new  FloatMenuItem  this [ int  index]
 91          {
 92               get
 93              {
 94                   return   base [index];
 95              }
 96               set
 97              {
 98                   base [index]  =  value;
 99              }
100          }     
101          
102      }
103  }
104 

4. 菜单项类型的枚举类TypeEnum代码

 1  ///   <summary>
 2  ///  Author: 【金鹰】【专注于DotNet技术】【ChengKing(ZhengJian)】
 3  ///  Blog:   Http://blog.csdn.net/ChengKing
 4  ///   </summary>
 5 
 6  namespace  TraceMenu
 7  {
 8       ///   <summary>
 9       ///  右键菜单的项的类别
10       ///   </summary>
11       public   enum  TypeEnum
12      {
13           ///   <summary>
14           ///  链接
15           ///   </summary>
16          Link,
17 
18           ///   <summary>
19           ///  分隔项
20           ///   </summary>
21          Separator,
22 
23           ///   <summary>
24           ///  自定义款项
25           ///   </summary>
26          Custom
27 
28      }    
29  }

.

(四). 示例代码下载

 http://www.cnblogs.com/Files/MVP33650/PopupTraceMenuExample.rar

.

(五). 其它控件开发文章

  http://blog.csdn.net/ChengKing/category/288694.aspx

 

 

.

.

.

.

.

.