topcat 姍舞之間的極度凝聚

這一篇是修改Puma大大的方式，讓使用者上載圖形，然後透過排列文字的顏色來展現圖形。Puma大大是用C#，小喵特別把他改成VB.NET,原來的文章請參考以下這篇連結：

http://www.dotblogs.com.tw/puma/archive/2008/04/05/2596.aspx

 

---

首先安排一下畫面，小喵透過Wizard讓使用者先上傳檔案，然後進行轉換

    <asp:Wizard ID="Wizard1" runat="server" ActiveStepIndex="1">
        <WizardSteps>
            <asp:WizardStep ID="WizardStep1" runat="server" Title="步驟一：上傳圖檔">
                (圖檔限制：50KB,JPG)<br />
                <asp:FileUpload ID="FileUpload1" runat="server" />
                <br />
                <asp:Button ID="btnStartUpload" runat="server" Text="上傳" />
            </asp:WizardStep>
            <asp:WizardStep ID="WizardStep2" runat="server" Title="步驟二：轉換">
                <asp:RadioButtonList ID="RadioButtonList1" runat="server" RepeatDirection="Horizontal">
                    <asp:ListItem Selected="True" Value="灰階">灰階</asp:ListItem>
                    <asp:ListItem Value="彩色">彩色</asp:ListItem>
                </asp:RadioButtonList><asp:TextBox ID="TextBox1" runat="server">TOPCAT</asp:TextBox>
                <asp:Button ID="btnRun" runat="server" Text="執行" />
                <asp:RequiredFieldValidator ID="RequiredFieldValidator1" runat="server" ControlToValidate="TextBox1"
                    ErrorMessage="字串不可以為空"></asp:RequiredFieldValidator><br />
                <asp:Image ID="Image1" runat="server" ImageUrl="" /><br />
                
            </asp:WizardStep>
        </WizardSteps>
    </asp:Wizard>
        <asp:Literal ID="Literal1" runat="server"></asp:Literal>
        <br />
        訊息：<asp:Label ID="lblMsg" runat="server" Font-Bold="True" ForeColor="Red"></asp:Label>
        <br />
        <asp:TextBox ID="txtSource" runat="server" TextMode="MultiLine" Height="141px" 
            Width="318px"></asp:TextBox>
    </div>

Imports System.Drawing


接著，在Page Load的時候，安排一下，預設顯示Step1

再來安排一下上傳檔案的動作

這邊小喵在小喵的專案中安排一個 Temp的資料夾，預計上傳的檔案會存放在這邊


        Dim Path As String = Server.MapPath("~/Temp/")
        Dim FileOk As Boolean = False
        Dim FileExtension As String = ""
        Dim i As Integer
        If Me.FileUpload1.HasFile Then
            FileExtension = IO.Path.GetExtension(Me.FileUpload1.FileName).ToLower

            Dim fileSize As Integer = FileUpload1.PostedFile.ContentLength
            If fileSize > 50 * 1024 Then
                Me.lblMsg.Text = "檔案超過500KB!!"
            Else
                Dim allowedExtensions As String() = {".jpg"}   '定義允許的檔案格式

                For i = 0 To allowedExtensions.Length - 1   '逐一檢查允許的格式中是否有上傳的格式
                    If FileExtension = allowedExtensions(i) Then
                        FileOk = True
                    End If

                Next
                If FileOk Then
                    Try
                        Me.FileUpload1.PostedFile.SaveAs(Path & Me.FileUpload1.FileName)    '將上傳的檔案儲存
                        Me.lblMsg.Text = "上傳成功!!準備開始轉換"     '傳回成功
                        ViewState("FileName") = Me.FileUpload1.FileName

                        Me.Wizard1.MoveTo(Me.WizardStep2)
                        Me.Image1.ImageUrl = "~/Temp/" & Me.FileUpload1.FileName

                    Catch ex As Exception
                        Me.lblMsg.Text = "Upload False!! <br>" + ex.Message

                    End Try
                Else
                    Me.lblMsg.Text = "檔案上傳失敗，請確認檔案格式是否正確!!"
                End If
            End If
        End If
    End Sub


接著就是準備兩個自訂的Function轉換資料用


        Dim str() As Char = Me.TextBox1.Text.ToCharArray
        Return str(cnt Mod str.Length).ToString
    End Function

    Private Function ToGray(ByVal pixel As Color) As Color

        Dim val As Integer = 0

        Dim SumPixel As Integer = CInt(pixel.R.ToString) + CInt(pixel.G.ToString) + CInt(pixel.B.ToString)
        val = CInt(SumPixel / 3)

        Return Color.FromArgb(Val, Val, Val)
    End Function


最後，就是轉換圖檔程式的部分


        Dim sb As New StringBuilder()

        '載入你要處理的圖片
        Using b As New Bitmap(Server.MapPath("~/temp/" & ViewState("FileName")))
            Dim cnt As Integer = 0

            sb.Append("<table style='background-color:black;'><tr><td>")
            Dim x As Integer
            Dim pixel As Color
            'x=x+2,如果產生的圖片太高可以調整這個,可以+1,+2,+3
            For x = 0 To b.Height - 1 Step +2
                For y = 0 To b.Width - 1
                    pixel = b.GetPixel(y, x)

                    If Me.RadioButtonList1.SelectedIndex = 0 Then
                        sb.AppendFormat("<font color='{0}'>{1}</font>", ColorTranslator.ToHtml(ToGray(pixel)), GetVal(cnt))
                    Else
                        sb.AppendFormat("<font color='{0}'>{1}</font>", ColorTranslator.ToHtml(pixel), GetVal(cnt))
                    End If
                    cnt += 1
                Next
                sb.Append("<br/>")
            Next
            sb.Append("</td></tr></table>")
            Me.Literal1.Text = sb.ToString
            Me.txtSource.Text = sb.ToString
        End Using
    End Sub


另外，在Wizard切換的時候(要換下一張圖的時候)，把已經產生的那些內容清除一下


        Me.txtSource.Text = ""
        Me.Literal1.Text = ""
    End Sub

此外，希望畫面剛開始用的時候，能夠讓Wizard停留在步驟一，所以在PagLoad的時候安排一下切換WizardStep


            Me.Wizard1.MoveTo(WizardStep1)
        End If


執行畫面如下：



 

 
                    
 
以下是簽名：
歡迎轉貼本站的文章，不過請在貼文主旨上加上【轉貼】，並在文章中附上本篇的超連結與站名【topcat姍舞之間的極度凝聚】，感恩大家的配合。
小喵大部分的文章會以小喵熟悉的語言VB.NET撰寫，如果您需要C#的Code，也許您可以試著用線上的工具進行轉換，這裡提供幾個參考
http://converter.telerik.com/
http://www.carlosag.net/tools/codetranslator/
http://www.developerfusion.com/tools/convert/vb-to-csharp/
Microsoft MVP
Visual Studio and Development Technologies
(2005~2019/6) 
topcat
Blog:http://www.dotblogs.com.tw/topcat