ASP.NET图象处理详解
生活随笔
收集整理的這篇文章主要介紹了
ASP.NET图象处理详解
小編覺得挺不錯的,現(xiàn)在分享給大家,幫大家做個參考.
作者:未知???? 請與本人聯(lián)系
?在使用ASP的時候,我們時常要借助第三方控件來實現(xiàn)一些圖象功能。而現(xiàn)在,ASP.NET的推出,我們已經(jīng)沒有必要再使用第三方控件來實現(xiàn),因為ASP.NET 已經(jīng)具有強大的功能來實現(xiàn)一些圖象處理。現(xiàn)在,我們就來看看怎樣使用ASP.NET的這一強大功能。
??
??一、System.Drawing的使用
??以下的舉例將演示在內(nèi)存中生成一張圖片,然后,將這張圖片通過網(wǎng)頁顯示出來。需要了解的是,我們這里輸出的不是HTML效果,而是實實在在的圖片(圖象),我們可以使用“另存為…”將輸出圖象保存起來。
??我們先來看看效果:
??
??我們看到,這張圖片是一個漸變背景上有“看見了嗎”幾個字,當然,這個效果在PhotoShop等圖象處理軟件里面很容易實現(xiàn),但是,一些與數(shù)據(jù)庫結(jié)合的應(yīng)用我們不可能將所有圖片都事先設(shè)計出來,這時候,利用ASP.NET來實現(xiàn)這些功能就顯得很重要了。我們來看源代碼:
??<%@ page language="vb" contenttype="image/jpeg" %>
??<%@ import namespace="system.drawing" %>
??<%@ import namespace="system.drawing.imaging" %>
??<%@ import namespace="system.drawing.drawing2d" %>
??
??<%
??'清空Response
??response.clear
??
??'建立一個120*30大小,24bit的BMP圖象;
??dim imgOutput as New bitmap(120, 30, pixelformat.format24bpprgb)
??
??'根據(jù)以上BMP建立一個新圖象;
??dim g as graphics = graphics.fromimage(imgOutput)
??
??g.clear(color.Green)
??g.smoothingMode = smoothingMode.antiAlias
??
??g.drawString("看見了嗎?", New font("黑體",16,fontstyle.bold),new SolidBrush(Color.White),New pointF(2,4))
??
??g.FillRectangle(New linearGradientBrush(New point(0,0), New point(120,30), color.fromArgb(0,0,0,0),color.fromArgb(255,255,255,255)),0,0,120,30)
??
??imgOutput.save(response.outputstream, imageformat.jpeg)
??
??g.dispose()
??imgOutput.dispose()
??response.end
??%>
??在以上代碼中,我們看到和數(shù)據(jù)庫程序不同,這里專門引入了圖象處理的名字空間system.drawing等。程序首先清空了Response,確保沒有輸出;然后,程序建立了一個120乘30大的BMP圖象,再在這個基礎(chǔ)上建立一個新圖象,建立圖象以后,我們首先“畫”出了字符串“看見了嗎”,該字符串為16大粗黑體,顏色為白色,位置為(2,4);最后,我們實現(xiàn)漸變效果。
??以上舉例很簡單,但是如果和數(shù)據(jù)庫結(jié)合,我們可以實現(xiàn)很多使用ASP可能不敢想的效果。
??
??二、讀取和改變圖象文件大小
??讀取圖片?直接使用HTML不就可以了?當然可以,我們這里只是提供一種選擇和方法來實現(xiàn)這一功能,具體這一功能的使用,我們可能需要在實踐中更多的學習。先來看程序源代碼:
??<% ' import all relevant namespaces %>
??<%@ import namespace="System" %>
??<%@ import namespace="System.Drawing" %>
??<%@ import namespace="System.Drawing.Imaging" %>
??<%@ import namespace="System.IO" %>
??
??<script runat="server">
??Sub sendFile()
??dim g as System.Drawing.Image = System.Drawing.Image.FromFile(server.mappath(request("src")))
??dim thisFormat=g.rawformat
??dim imgOutput as New Bitmap(g, cint(request("width")), cint(request("height")))
??if thisformat.equals(system.drawing.imaging.imageformat.Gif) then
??response.contenttype="image/gif"
??else
??response.contenttype="image/jpeg"
??end if
??imgOutput.save(response.outputstream, thisformat)
??g.dispose()
??imgOutput.dispose()
??end sub
??
??Sub sendError()
??dim imgOutput as New bitmap(120, 120, pixelformat.format24bpprgb)
??dim g as graphics = graphics.fromimage(imgOutput)
??g.clear(color.yellow)
??g.drawString("錯誤!", New font("黑體",14,fontstyle.bold),systembrushes.windowtext, New pointF(2,2))
??response.contenttype="image/gif"
??imgOutput.save(response.outputstream, imageformat.gif)
??g.dispose()
??imgOutput.dispose()
??end sub
??</script>
??
??<%
??response.clear
??if request("src")="" or request("height")="" or request("width")="" then
??call sendError()
??else
??if file.exists(server.mappath(request("src"))) then
??call sendFile()
??else
??call sendError()
??end if
??end if
??response.end
??%>
??在以上的程序中,我們看到兩個函數(shù),一個是SendFile,這一函數(shù)主要功能為顯示服務(wù)器上的圖片,該圖片的大小通過Width和Height設(shè)置,同時,程序會自動檢測圖片類型;另外一個是SendError,這一函數(shù)的主要功能為服務(wù)器上的圖片文件不存在時,顯示錯誤信息,這里很有趣,錯誤信息也是通過圖片給出的(如圖):
??
??以上的程序顯示圖片并且改變圖片大小,現(xiàn)在,我們將這個程序進一步,顯示圖片并且保持圖片的長寬比例,這樣,和實際應(yīng)用可能比較接近,特別是需要制作電子相冊或者是圖片網(wǎng)站的時候比較實用。我們先來看主要函數(shù):
??Function NewthumbSize(currentwidth, currentheight)
??dim tempMultiplier as Double
??if currentheight > currentwidth then
??tempMultiplier = 200 / currentheight
??Else
??tempMultiplier = 200 / currentwidth
??end if
??dim NewSize as New Size(CInt(currentwidth * tempMultiplier), CInt(currentheight * tempMultiplier))
??return NewSize
??End Function
??以上程序是增加的一個函數(shù)NewthumbSize,該函數(shù)專門處理改變一會的圖片大小,這個圖片的長寬和原圖片的長寬保持相同比例。其他部分請參考上文程序代碼。
??
??三、畫圖特效
??如果只是將圖片顯示在網(wǎng)頁上,這樣未免顯得簡單。現(xiàn)在,我們來進一步感受ASP.NET的強大功能。我們將學習圖象處理中常用的圖象反轉(zhuǎn)、圖象切割、圖象拉伸等技巧。
??先來看看程序效果:
??
??
??仔細看,我們可以找到各種圖象處理效果。現(xiàn)在,我們來看看程序代碼:
??<%@ Page Language="vb" Debug="True" %>
??<%@ import namespace="system.drawing" %>
??<%@ import namespace="system.drawing.imaging" %>
??<%@ import namespace="system.drawing.drawing2d" %>
??<%
??dim strFilename as string
??dim i as System.Drawing.Image
??strFilename = server.mappath("./chris-fsck.jpg")
??
??i = System.Drawing.Image.FromFile(strFilename)
??
??dim b as New system.drawing.bitmap(i.width, i.height, pixelformat.format24bpprgb)
??dim g as graphics = graphics.fromimage(b)
??
??g.clear(color.blue)
??
??'旋轉(zhuǎn)圖片
??i.RotateFlip(System.Drawing.RotateFlipType.Rotate90FlipX)
??g.drawimage(i,New point(0,0))
??i.RotateFlip(System.Drawing.RotateFlipType.Rotate270FlipY)
??
??g.RotateTransform(10)
??g.drawimage(i,New point(0,0))
??g.RotateTransform(10)
??g.drawimage(i,New point(20,20))
??g.RotateTransform(10)
??g.drawimage(i,New point(40,40))
??g.RotateTransform(10)
??g.drawimage(i,New point(40,40))
??g.RotateTransform(-40)
??g.RotateTransform(90)
??g.drawimage(i,New rectangle(100,-400,100,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??g.RotateTransform(-90)
??
??' 拉伸圖片
??g.drawimage(i,New rectangle(10,10,50,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??g.drawimage(i,New rectangle(50,10,90,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??g.drawimage(i,New rectangle(110,10,150,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??
??
??'切割圖片
??g.drawimage(i,50,100,New rectangle(180,80,60,110),GraphicsUnit.Pixel)
??g.drawimage(i,140,100,New rectangle(180,80,60,110),GraphicsUnit.Pixel)
??
??'旋轉(zhuǎn)圖片
??i.RotateFlip(System.Drawing.RotateFlipType.Rotate180FlipX)
??g.drawimage(i,230,100,New rectangle(180,110,60,110),GraphicsUnit.Pixel)
??
??response.contenttype="image/jpeg"
??
??b.save(response.outputstream, imageformat.jpeg)
??
??b.dispose()
??
??%>
??在以上的程序中,我們看到實現(xiàn)圖象處理的各種技巧,仔細觀察,我們可以知道旋轉(zhuǎn)圖片其實是用了一個RotateFlip方法;而切割和拉伸圖片,完全是通過設(shè)置DrawImage的不同參數(shù)來實現(xiàn)。
??
??四、總結(jié)
??ASP.NET的圖象處理可以實現(xiàn)的功能很多,我們在這里其實只是簡單的介紹,更多功能的應(yīng)用,需要我們在實踐中摸索、總結(jié)。
?在使用ASP的時候,我們時常要借助第三方控件來實現(xiàn)一些圖象功能。而現(xiàn)在,ASP.NET的推出,我們已經(jīng)沒有必要再使用第三方控件來實現(xiàn),因為ASP.NET 已經(jīng)具有強大的功能來實現(xiàn)一些圖象處理。現(xiàn)在,我們就來看看怎樣使用ASP.NET的這一強大功能。
??
??一、System.Drawing的使用
??以下的舉例將演示在內(nèi)存中生成一張圖片,然后,將這張圖片通過網(wǎng)頁顯示出來。需要了解的是,我們這里輸出的不是HTML效果,而是實實在在的圖片(圖象),我們可以使用“另存為…”將輸出圖象保存起來。
??我們先來看看效果:
??
??我們看到,這張圖片是一個漸變背景上有“看見了嗎”幾個字,當然,這個效果在PhotoShop等圖象處理軟件里面很容易實現(xiàn),但是,一些與數(shù)據(jù)庫結(jié)合的應(yīng)用我們不可能將所有圖片都事先設(shè)計出來,這時候,利用ASP.NET來實現(xiàn)這些功能就顯得很重要了。我們來看源代碼:
??<%@ page language="vb" contenttype="image/jpeg" %>
??<%@ import namespace="system.drawing" %>
??<%@ import namespace="system.drawing.imaging" %>
??<%@ import namespace="system.drawing.drawing2d" %>
??
??<%
??'清空Response
??response.clear
??
??'建立一個120*30大小,24bit的BMP圖象;
??dim imgOutput as New bitmap(120, 30, pixelformat.format24bpprgb)
??
??'根據(jù)以上BMP建立一個新圖象;
??dim g as graphics = graphics.fromimage(imgOutput)
??
??g.clear(color.Green)
??g.smoothingMode = smoothingMode.antiAlias
??
??g.drawString("看見了嗎?", New font("黑體",16,fontstyle.bold),new SolidBrush(Color.White),New pointF(2,4))
??
??g.FillRectangle(New linearGradientBrush(New point(0,0), New point(120,30), color.fromArgb(0,0,0,0),color.fromArgb(255,255,255,255)),0,0,120,30)
??
??imgOutput.save(response.outputstream, imageformat.jpeg)
??
??g.dispose()
??imgOutput.dispose()
??response.end
??%>
??在以上代碼中,我們看到和數(shù)據(jù)庫程序不同,這里專門引入了圖象處理的名字空間system.drawing等。程序首先清空了Response,確保沒有輸出;然后,程序建立了一個120乘30大的BMP圖象,再在這個基礎(chǔ)上建立一個新圖象,建立圖象以后,我們首先“畫”出了字符串“看見了嗎”,該字符串為16大粗黑體,顏色為白色,位置為(2,4);最后,我們實現(xiàn)漸變效果。
??以上舉例很簡單,但是如果和數(shù)據(jù)庫結(jié)合,我們可以實現(xiàn)很多使用ASP可能不敢想的效果。
??
??二、讀取和改變圖象文件大小
??讀取圖片?直接使用HTML不就可以了?當然可以,我們這里只是提供一種選擇和方法來實現(xiàn)這一功能,具體這一功能的使用,我們可能需要在實踐中更多的學習。先來看程序源代碼:
??<% ' import all relevant namespaces %>
??<%@ import namespace="System" %>
??<%@ import namespace="System.Drawing" %>
??<%@ import namespace="System.Drawing.Imaging" %>
??<%@ import namespace="System.IO" %>
??
??<script runat="server">
??Sub sendFile()
??dim g as System.Drawing.Image = System.Drawing.Image.FromFile(server.mappath(request("src")))
??dim thisFormat=g.rawformat
??dim imgOutput as New Bitmap(g, cint(request("width")), cint(request("height")))
??if thisformat.equals(system.drawing.imaging.imageformat.Gif) then
??response.contenttype="image/gif"
??else
??response.contenttype="image/jpeg"
??end if
??imgOutput.save(response.outputstream, thisformat)
??g.dispose()
??imgOutput.dispose()
??end sub
??
??Sub sendError()
??dim imgOutput as New bitmap(120, 120, pixelformat.format24bpprgb)
??dim g as graphics = graphics.fromimage(imgOutput)
??g.clear(color.yellow)
??g.drawString("錯誤!", New font("黑體",14,fontstyle.bold),systembrushes.windowtext, New pointF(2,2))
??response.contenttype="image/gif"
??imgOutput.save(response.outputstream, imageformat.gif)
??g.dispose()
??imgOutput.dispose()
??end sub
??</script>
??
??<%
??response.clear
??if request("src")="" or request("height")="" or request("width")="" then
??call sendError()
??else
??if file.exists(server.mappath(request("src"))) then
??call sendFile()
??else
??call sendError()
??end if
??end if
??response.end
??%>
??在以上的程序中,我們看到兩個函數(shù),一個是SendFile,這一函數(shù)主要功能為顯示服務(wù)器上的圖片,該圖片的大小通過Width和Height設(shè)置,同時,程序會自動檢測圖片類型;另外一個是SendError,這一函數(shù)的主要功能為服務(wù)器上的圖片文件不存在時,顯示錯誤信息,這里很有趣,錯誤信息也是通過圖片給出的(如圖):
??
??以上的程序顯示圖片并且改變圖片大小,現(xiàn)在,我們將這個程序進一步,顯示圖片并且保持圖片的長寬比例,這樣,和實際應(yīng)用可能比較接近,特別是需要制作電子相冊或者是圖片網(wǎng)站的時候比較實用。我們先來看主要函數(shù):
??Function NewthumbSize(currentwidth, currentheight)
??dim tempMultiplier as Double
??if currentheight > currentwidth then
??tempMultiplier = 200 / currentheight
??Else
??tempMultiplier = 200 / currentwidth
??end if
??dim NewSize as New Size(CInt(currentwidth * tempMultiplier), CInt(currentheight * tempMultiplier))
??return NewSize
??End Function
??以上程序是增加的一個函數(shù)NewthumbSize,該函數(shù)專門處理改變一會的圖片大小,這個圖片的長寬和原圖片的長寬保持相同比例。其他部分請參考上文程序代碼。
??
??三、畫圖特效
??如果只是將圖片顯示在網(wǎng)頁上,這樣未免顯得簡單。現(xiàn)在,我們來進一步感受ASP.NET的強大功能。我們將學習圖象處理中常用的圖象反轉(zhuǎn)、圖象切割、圖象拉伸等技巧。
??先來看看程序效果:
??
??
??仔細看,我們可以找到各種圖象處理效果。現(xiàn)在,我們來看看程序代碼:
??<%@ Page Language="vb" Debug="True" %>
??<%@ import namespace="system.drawing" %>
??<%@ import namespace="system.drawing.imaging" %>
??<%@ import namespace="system.drawing.drawing2d" %>
??<%
??dim strFilename as string
??dim i as System.Drawing.Image
??strFilename = server.mappath("./chris-fsck.jpg")
??
??i = System.Drawing.Image.FromFile(strFilename)
??
??dim b as New system.drawing.bitmap(i.width, i.height, pixelformat.format24bpprgb)
??dim g as graphics = graphics.fromimage(b)
??
??g.clear(color.blue)
??
??'旋轉(zhuǎn)圖片
??i.RotateFlip(System.Drawing.RotateFlipType.Rotate90FlipX)
??g.drawimage(i,New point(0,0))
??i.RotateFlip(System.Drawing.RotateFlipType.Rotate270FlipY)
??
??g.RotateTransform(10)
??g.drawimage(i,New point(0,0))
??g.RotateTransform(10)
??g.drawimage(i,New point(20,20))
??g.RotateTransform(10)
??g.drawimage(i,New point(40,40))
??g.RotateTransform(10)
??g.drawimage(i,New point(40,40))
??g.RotateTransform(-40)
??g.RotateTransform(90)
??g.drawimage(i,New rectangle(100,-400,100,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??g.RotateTransform(-90)
??
??' 拉伸圖片
??g.drawimage(i,New rectangle(10,10,50,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??g.drawimage(i,New rectangle(50,10,90,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??g.drawimage(i,New rectangle(110,10,150,50),New rectangle(20,20,i.width-20,i.height-20),GraphicsUnit.Pixel)
??
??
??'切割圖片
??g.drawimage(i,50,100,New rectangle(180,80,60,110),GraphicsUnit.Pixel)
??g.drawimage(i,140,100,New rectangle(180,80,60,110),GraphicsUnit.Pixel)
??
??'旋轉(zhuǎn)圖片
??i.RotateFlip(System.Drawing.RotateFlipType.Rotate180FlipX)
??g.drawimage(i,230,100,New rectangle(180,110,60,110),GraphicsUnit.Pixel)
??
??response.contenttype="image/jpeg"
??
??b.save(response.outputstream, imageformat.jpeg)
??
??b.dispose()
??
??%>
??在以上的程序中,我們看到實現(xiàn)圖象處理的各種技巧,仔細觀察,我們可以知道旋轉(zhuǎn)圖片其實是用了一個RotateFlip方法;而切割和拉伸圖片,完全是通過設(shè)置DrawImage的不同參數(shù)來實現(xiàn)。
??
??四、總結(jié)
??ASP.NET的圖象處理可以實現(xiàn)的功能很多,我們在這里其實只是簡單的介紹,更多功能的應(yīng)用,需要我們在實踐中摸索、總結(jié)。
總結(jié)
以上是生活随笔為你收集整理的ASP.NET图象处理详解的全部內(nèi)容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: ASP.Net ViewState的实现
- 下一篇: 在ASP.NET中值得注意的两个地方