程序師世界是廣大編程愛好者互助、分享、學習的平台,程序師世界有你更精彩!
首頁
編程語言
C語言|JAVA編程
Python編程
網頁編程
ASP編程|PHP編程
JSP編程
數據庫知識
MYSQL數據庫|SqlServer數據庫
Oracle數據庫|DB2數據庫
 程式師世界 >> 編程語言 >> .NET網頁編程 >> .NET實例教程 >> Asp.net中多彩下拉框的實現

Asp.net中多彩下拉框的實現

編輯:.NET實例教程

開發背景:
    有人曾經要我開發一個根據不同選擇而顯示不同顏色的管理工具。我開始考慮利用下拉框來實現條目背景及顯示顏色根據條目名稱不同而進行變化,根據這個思路我在網上搜了半天也沒有找到任何相關的解決方案,最後我想到了一個比當初需求要復雜的方案(包括數據庫),所以我嘗試著找到一個更簡單的實現方案。

    該文主要是演示如何讀取系統顏色並在下拉框中的每個條目中顯示對應的顏色,該源碼主要展示以下內容:
    1、如何獲得System.Drawing.KnownColor顏色控件的列表枚舉
    2、如何排除系統環境顏色,如“Active Border”
    3、如何分配顏色到下拉框的每個條目


代碼詳解:
    命名下拉框為ddlMultiColor 來顯示顏色名稱及顏色,用<div>標簽顯示右側矩形結果,ASPx代碼如下

<table>
    <tr>
        <td>
            <ASP:DropDownList ID ="ddlMultiColor"  
                OnSelectedIndexChanged="ddlMultiColor_OnSelectedIndExchanged"
                runat="server" AutoPostBack="true">
            </ASP:DropDownList>
        </td>
        <td>
            <div id="msgColor" runat="server">
            </div>
        </td>
    </tr>
</table>

    在cs文件中我們需要引用以下命名空間:

using System;
using System.Web;
using System.Reflection;
using System.Drawing;
using System.Collections.Generic;
   我們先看一下Page_Load事件,在Page_Load中我們對選中的下拉列表進行處理顯示


protected void Page_Load(object sender, EventArgs e)
{
    if (Page.IsPostBack == false)
    {
        populateDdlMultiColor(); //51ASPx.com
        colorManipulation();
    }
}

    現在讓我們來看一下populateDdlMultiColor() 函數

private void populateDdlMultiColor()
{       
    ddlMultiColor.DataSource = finalColorList();
    ddlMultiColor.DataBind(); //liudao 翻譯
}

    finalColorList()方法

private List finalColorList()
{
    string[] allColors = Enum.GetNames(typeof(System.Drawing.KnownColor));
    string[] systemEnvironmentColors =
        new string[(
        typeof(System.Drawing.SystemColors)).GetPropertIEs().Length];

    int index = 0;

    foreach (MemberInfo member in (
        typeof(System.Drawing.SystemColors)).GetPropertIEs())
    {
        systemEnvironmentColors[index ++] = member.Name;           
    }

    List finalColorList =  new List();
           
    foreach (string color in allColors)
    {
        if (Array.IndexOf(systemEnvironmentColors, color) < 0)
        {
            finalColorList.Add(color);
        }                          
    }
    return finalColorList;
}


    System.Drawing.KnownColor是ASP.Net系統本身自帶顏色,我已經通過枚舉列出了這些顏色並通過finalColorList()函授進行綁定。為了實現該功能,我使用了最基本的枚舉特征之一:Enum.GetNames() 共享方法,該方法對枚舉內容進行檢測並輸出結果為字符串序列,該字符串中每個值都對應枚舉中的每個結果。
    然而,該方法還是有些問題的。按照上面的思路,枚舉金額過中會包括系統環境顏色,比如“Active Border(注:活動邊框)”,為了解決該問題,我擴展了系統環境顏色。我用了System.Reflection.MemberInfo類。
    這裡我用System.Drawing.SystemColors屬性填充systemEnvironmentColors ,然後創建一個名稱為finalColorList 的圖形列表,在finalColorList 中我只調用已知顏色,但是不在系統環境顏色中。然後把finalColorList綁定到ddlMultiColor中。至此,我們已經有了一個包括全部顏色名稱的下拉框,下面讓我們來操作一下:
http://www.knowsky.com/
private void colorManipulation()
{
    int row;
    for (row = 0; row < ddlMultiColor.Items.Count - 1; row++)
    {
        ddlMultiColor.Items[row].Attributes.Add("style",
            "background-color:" + ddlMultiColor.Items[row].Value);
    }
    ddlMultiColor.BackColor =
        Color.FromName(ddlMultiColor.SelectedItem.Text);//liudao翻譯
}

    下拉框中的每一行背景顏色的Style]屬性都與該行顯示的顏色名稱對應的。在OnSelectedIndExchanged 事件中下拉框中被選中的行通過下面的函數結合<div>標簽進行高亮顯示,同時右側的矩形顏色也隨之變化。

protected void ddlMultiColor_OnSelectedIndExchanged(object sender,
    EventArgs e)
{       
    ddlMultiColor.BackColor = Color.FromName(ddlMultiColor.SelectedItem.Text);
    colorManipulation();  
    ddlMultiColor.Items.FindByValue(ddlMultiColor.SelectedValue).Selected =
        true;   
    msgColor.Attributes.Add("style", "background:" +
        ddlMultiColor.SelectedItem.Value + ";width:30px;height:25px;");
}

    至此,我們學會了如果獲取System.Drawing並排出系統環境顏色,並綁定顏色名稱到下拉列表。

  1. 上一頁:
  2. 下一頁:
Copyright © 程式師世界 All Rights Reserved