如何在Asp.net中实现多彩下拉框

   开发背景: 89g站长资讯
   有人曾经要我开发一个根据不同选择而显示不同颜色的管理工具。我开始考虑利用下拉框来实现条目背景及显示颜色根据条目名称不同而进行变化,根据这个思路我在网上搜了半天也没有找到任何相关的解决方案,最后我想到了一个比当初需求要复杂的方案(包括数据库),所以我尝试着找到一个更简单的实现方案。 89g站长资讯
   89g站长资讯
   该文主要是演示如何读取系统颜色并在下拉框中的每个条目中显示对应的颜色,该源码主要展示以下内容: 89g站长资讯
   1、如何获得System.Drawing.KnownColor颜色控件的列表枚举 89g站长资讯
   2、如何排除系统环境颜色,如“Active Border” 89g站长资讯
   3、如何分配颜色到下拉框的每个条目  89g站长资讯
    89g站长资讯
  代码详解: 89g站长资讯
   命名下拉框为ddlMultiColor 来显示颜色名称及颜色,用<div>标签显示右侧矩形结果,Aspx代码如下

  <table> 89g站长资讯
   <tr> 89g站长资讯
   <td> 89g站长资讯
   <asp:DropDownList ID ="ddlMultiColor" 89g站长资讯
   OnSelectedIndexChanged="ddlMultiColor_OnSelectedIndexChanged" 89g站长资讯
   runat="server" AutoPostBack="true"> 89g站长资讯
   </asp:DropDownList> 89g站长资讯
   </td> 89g站长资讯
   <td> 89g站长资讯
   <div id="msgColor" runat="server"> 89g站长资讯
   </div> 89g站长资讯
   </td> 89g站长资讯
   </tr> 89g站长资讯
  </table> 

 89g站长资讯
    在cs文件中我们需要引用以下命名空间:

  using System; 89g站长资讯
  using System.Web; 89g站长资讯
  using System.Reflection; 89g站长资讯
  using System.Drawing; 89g站长资讯
  using System.Collections.Generic; 

89g站长资讯
    我们先看一下Page_Load事件,在Page_Load中我们对选中的下拉列表进行处理显示

  protected void Page_Load(object sender, EventArgs e) 89g站长资讯
  { 89g站长资讯
   if (Page.IsPostBack == false) 89g站长资讯
   { 89g站长资讯
   populateDdlMultiColor(); //51aspx.com 89g站长资讯
   colorManipulation(); 89g站长资讯
   } 89g站长资讯
  } 

89g站长资讯
    现在让我们来看一下populateDdlMultiColor() 函数

  private void populateDdlMultiColor() 89g站长资讯
  { 89g站长资讯
   ddlMultiColor.DataSource = finalColorList(); 89g站长资讯
   ddlMultiColor.DataBind(); //liudao 翻译 89g站长资讯
  } 89g站长资讯
   89g站长资讯
   finalColorList()方法 89g站长资讯
  private List finalColorList() 89g站长资讯
  { 89g站长资讯
   string[] allColors = Enum.GetNames(typeof(System.Drawing.KnownColor)); 89g站长资讯
   string[] systemEnvironmentColors = 89g站长资讯
   new string[( 89g站长资讯
   typeof(System.Drawing.SystemColors)).GetProperties().Length]; 89g站长资讯
   89g站长资讯
   int index = 0; 89g站长资讯
   89g站长资讯
   foreach (MemberInfo member in ( 89g站长资讯
   typeof(System.Drawing.SystemColors)).GetProperties()) 89g站长资讯
   { 89g站长资讯
   systemEnvironmentColors[index ++] = member.Name; 89g站长资讯
   } 89g站长资讯
   89g站长资讯
   List finalColorList = new List(); 89g站长资讯
   89g站长资讯
   foreach (string color in allColors) 89g站长资讯
   { 89g站长资讯
   if (Array.IndexOf(systemEnvironmentColors, color) < 0) 89g站长资讯
   { 89g站长资讯
   finalColorList.Add(color); 89g站长资讯
   } 89g站长资讯
   } 89g站长资讯
   return finalColorList; 89g站长资讯
  } 
 

    System.Drawing.KnownColor是Asp.net系统本身自带颜色,我已经通过枚举列出了这些颜色并通过 finalColorList()函授进行绑定。为了实现该功能,我使用了最基本的枚举特征之一:Enum.GetNames() 共享方法,该方法对枚举内容进行检测并输出结果为字符串序列,该字符串中每个值都对应枚举中的每个结果。 89g站长资讯
   然而,该方法还是有些问题的。按照上面的思路,枚举金额过中会包括系统环境颜色,比如“Active Border(注:活动边框)”,为了解决该问题,我扩展了系统环境颜色。我用了System.Reflection.MemberInfo类。 89g站长资讯
   这里我用System.Drawing.SystemColors属性填充systemEnvironmentColors ,然后创建一个名称为finalColorList 的图形列表,在finalColorList 中我只调用已知颜色,但是不在系统环境颜色中。然后把finalColorList绑定到ddlMultiColor中。至此,我们已经有了一个包括全部颜色名称的下拉框,下面让我们来操作一下:

  private void colorManipulation() 89g站长资讯
  { 89g站长资讯
   int row; 89g站长资讯
   for (row = 0; row < ddlMultiColor.Items.Count - 1; row++) 89g站长资讯
   { 89g站长资讯
   ddlMultiColor.Items[row].Attributes.Add("style", 89g站长资讯
   "background-color:" + ddlMultiColor.Items[row].Value); 89g站长资讯
   } 89g站长资讯
   ddlMultiColor.BackColor = 89g站长资讯
   Color.FromName(ddlMultiColor.SelectedItem.Text);//liudao翻译 89g站长资讯
  } 

 89g站长资讯
    下拉框中的每一行背景颜色的Style]属性都与该行显示的颜色名称对应的。在OnSelectedIndexChanged 事件中下拉框中被选中的行通过下面的函数结合<div>标签进行高亮显示,同时右侧的矩形颜色也随之变化。

  protected void ddlMultiColor_OnSelectedIndexChanged(object sender, 89g站长资讯
   EventArgs e) 89g站长资讯
  { 89g站长资讯
   ddlMultiColor.BackColor = Color.FromName(ddlMultiColor.SelectedItem.Text); 89g站长资讯
   colorManipulation(); 89g站长资讯
   ddlMultiColor.Items.FindByValue(ddlMultiColor.SelectedValue).Selected = 89g站长资讯
   true; 89g站长资讯
   msgColor.Attributes.Add("style", "background:" + 89g站长资讯
   ddlMultiColor.SelectedItem.Value + ";width:30px;height:25px;"); 89g站长资讯
  }  
89g站长资讯
   至此,我们学会了如果获取System.Drawing并排出系统环境颜色,并绑定颜色名称到下拉列表。

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值