demoshop

demo, trying to be the best_

RGB轉換HSB和HEX(色碼)的方法

  • 2015-01-05 22:48:33
  • 9909

這篇是介紹色碼的轉換功能,利用輸入的RGB轉換為HSB和HEX,其中的HEX公式demo已經忘了從哪裡找到的,所以無法提供原始出處給各位=.=

▲頁面上我們給它三個文字方塊,用以輸入RGB三色碼

<div>
    <asp:TextBox ID="txtR" runat="server"></asp:TextBox>
    <asp:RangeValidator ID="RangeValidator1" runat="server" ControlToValidate="txtR"
        Display="Dynamic" ErrorMessage="超過255" MaximumValue="255" MinimumValue="0" Type="Integer"></asp:RangeValidator>
    <asp:TextBox ID="txtG" runat="server"></asp:TextBox>
    <asp:RangeValidator ID="RangeValidator2" runat="server" ControlToValidate="txtG"
        Display="Dynamic" ErrorMessage="超過255" MaximumValue="255" MinimumValue="0" Type="Integer"></asp:RangeValidator>
    <asp:TextBox ID="txtB" runat="server"></asp:TextBox>
    <asp:RangeValidator ID="RangeValidator3" runat="server" ControlToValidate="txtB"
        Display="Dynamic" ErrorMessage="超過255" MaximumValue="255" MinimumValue="0" Type="Integer"></asp:RangeValidator>
    <asp:Button ID="Button1" runat="server" OnClick="Button1_Click" Text="給我轉" /><br />
</div>
<table>
    <tr>
        <td style="width: 100px">
            原始顏色td>
            <td style="width: 30px">
            </td>
            <td rowspan="2" style="width: 100px">
                <table>
                    <tr>
                        <td align="center" style="font-weight: bold; width: 204px">
                            HEX
                        </td>
                    </tr>
                    <tr>
                        <td align="center" style="width: 100px">
                            <asp:Label ID="labHEX" runat="server"></asp:Label>
                        </td>
                    </tr>
                    <tr>
                        <td align="center" style="font-weight: bold; width: 204px">
                            HSB
                        </td>
                    </tr>
                    <tr>
                        <td align="center" style="width: 100px">
                            <asp:Label ID="labHSB" runat="server"></asp:Label>
                        </td>
                    </tr>
                </table>
                <br />
                <br />
            </td>
    </tr>
    <tr>
        <td style="width: 100px">
            <asp:Panel ID="show" runat="server" Height="100px" Width="100px">
            </asp:Panel>
        </td>
        <td style="width: 30px">
        </td>
    </tr>
</table> 

▲程式頁就直接給它以下code

#region 變數宣告到位
int R = Convert.ToInt32(this.txtR.Text);
int G = Convert.ToInt32(this.txtG.Text);
int B = Convert.ToInt32(this.txtB.Text);
this.show.BackColor = System.Drawing.Color.FromArgb(255, R, G, B);
float sH, sB, sS, aH, aS, aB, aF, aP, aQ, aT;
int lH;
#endregion
 
#region 利用陣列排序取出最大值和最小值
ArrayList colorArr = new ArrayList();
colorArr.Add(R);
colorArr.Add(G);
colorArr.Add(B);
colorArr.Sort();
float max = Convert.ToInt16(colorArr[colorArr.Count - 1]);
float mix = Convert.ToInt16(colorArr[0]);
#endregion
 
#region RGB TO HEX
this.labHEX.Text = string.Format("#{0:X2}{1:X2}{2:X2}", R, G, B);
#endregion
 
#region RGB TO HSB
sH = System.Drawing.Color.FromArgb(255, R, G, B).GetHue();
sS = (max - mix) / max;
sS = Convert.ToSingle(sS.ToString("N2").Substring(sS.ToString().IndexOf('.') + 1, 2));
sB = max;
sB = max / 255;
sB = Convert.ToSingle(sB.ToString("N2").Substring(sB.ToString().IndexOf('.') + 1, 2));
this.labHSB.Text = string.Format("{0:F0},{1},{2}", sH, sS, sB);
colorArr = null;
#endregion
 
#region HSB TO RGB
sH = (sH % 360);
if (sS > 100)
{
    sS = 100;
}
else if (sS < 0)
{
    sS = 0;
}
if (sB > 100)
{
    sB = 100;
}
else if (sB < 0)
{
    sB = 0;
}
 
if (sS > 0)
{
    aH = sH / 60;
    aS = sS / 100;
    aB = sB / 100;
    lH = Convert.ToInt32(aH);
    aF = aH - lH;
    aP = aB * (1 - aS);
    aQ = aB * (1 - aS * aF);
    aT = aB * (1 - aS * (1 - aF));
 
    switch (lH)
    {
        case 0:
            R = Convert.ToInt32(aB * 255);
            G = Convert.ToInt32(aT * 255);
            B = Convert.ToInt32(aP * 255);
            break;
        case 1:
            R = Convert.ToInt32(aQ * 255);
            G = Convert.ToInt32(aB * 255);
            B = Convert.ToInt32(aP * 255);
            break;
        case 2:
            R = Convert.ToInt32(aP * 255);
            G = Convert.ToInt32(aB * 255);
            B = Convert.ToInt32(aT * 255);
            break;
        case 3:
            R = Convert.ToInt32(aP * 255);
            G = Convert.ToInt32(aQ * 255);
            B = Convert.ToInt32(aB * 255);
            break;
        case 4:
            R = Convert.ToInt32(aT * 255);
            G = Convert.ToInt32(aP * 255);
            B = Convert.ToInt32(aB * 255);
            break;
        case 5:
            R = Convert.ToInt32(aB * 255);
            G = Convert.ToInt32(aP * 255);
            B = Convert.ToInt32(aQ * 255);
            break;
    }
}
else
{
    R = Convert.ToInt32((sB * 255) / 100);
    G = Convert.ToInt32(R);
    B = Convert.ToInt32(R);
}
R = R > 255 ? 255 : R;
G = G > 255 ? 255 : G;
B = B > 255 ? 255 : B;
#endregion 

回應討論