在現在的數碼時代我們會經常拍攝一些相片以供留念而隨著數碼照片的增多往往需要很好地管理這些照片以便更好地查閱留念現在網上有不少的電子相冊都能很好的實現這些功能那我們能否自己動手創建自己的相冊呢？當然可以在這篇文章中我們將利用來創建一個簡單的在線相冊以收藏我們的照片
首先來看下這個相冊有哪些功能在這個相冊中我們必須先把預先攝影好的照片放到一個目錄下去之後可以供在網上使用上一張下一張的鏈接一張張地查看
下面先介紹如何獲得文件夾中的圖片我們可以使用SystemIO命名空間中的DirectoryInfo類來實現將文件夾所在的路徑做為參數傳遞到該類的構造函數中並聲明一個DirectoryInfo類的實例DirectoryInfo類中有一個GetFiles（）的方法會返回FileInfo的對象數組而每一個FileInfo的實例將包含指定路徑下文件的具體信息下面的代碼片段說明了該過程
Sub Page_Load（sender as Object e as EventArgs）
Get list of images Dim dirInfo as New DirectoryInfo（ServerMapPath（））
Dim images（） as FileInfo = FilterForImages（dirInfoGetFiles（））
……
End Sub
其中用Servermappath獲得當前目錄的路徑而dirinfogetfiles（）將會返回該目錄下的所有文件而由於我們的是相冊只需要看到比如JPGBMPGIF等圖象文件所以我們可以通過程序實現只裝載這些類型的文件這通過一個自定義的過程FilterForImages來實現該過程將只返回指定文件夾中圖象類型的文件代碼如下
Function FilterForImages（images（） as FileInfo） as FileInfo（）
Dim newImages as New ArrayList（imagesLength）
Dim i as Integer For i = to imagesLength If PathGetExtension（images（i）Name） = jpg OrElse _ PathGetExtension（images（i）Name） = jpeg OrElse _ PathGetExtension（images（i）Name） = png OrElse _ PathGetExtension（images（i）Name） = gif then newImagesAdd（images（i））
End If Next
Return CType（newImagesToArray（GetType（FileInfo）） FileInfo（））
End Function
該過程對於傳遞進來的FileInfo參數數組進行遍歷對文件夾中的文件的後綴名進行叛斷如果屬於圖象文件則添加到newimages數組中去並以arraylist形式返回
接下來我們看下如何顯示每一張圖片並以上一張下一張來顯示為了知道當前浏覽的是第幾張圖片可以通過使用傳遞參數的方法來實現先往窗體中添加一個image控件和文本框程序代碼如下
Sub Page_Load（sender as Object e as EventArgs）
……
Dim imgIndex as Integer = If Not RequestQueryString（N） is Nothing AndAlso _ IsNumeric（RequestQueryString（N）） then imgIndex = CInt（RequestQueryString（N））
End If
currentImgTitleText = You are Viewing & _ PathGetFileNameWithoutExtension（images（imgIndex）Name） & _ （ & imgIndex + & of & imagesLength & ） currentImgImageUrl = PathGetFileName（images（imgIndex）Name）
……
End Sub
HTML部分代碼
<aspLabel runat=server id=currentImgTitle /><br /> <aspImage runat=server id=currentImg />
在上面的代碼中使用變量imgindex來表示當前浏覽的是第幾張圖片剛開始時候N=則獲得images數組中的第一個變量也即第一張圖片之後每次讀取該變量值則可以知道當前浏覽的是第幾張圖片
而為了實現下一張上一張的功能往窗體增加兩個Hyperlink鏈接控件並添加以下代碼
Sub Page_Load（sender as Object e as EventArgs）
……
If imgIndex > then lnkPrevNavigateUrl = Defaultaspx？N= & imgIndex End If
If imgIndex < imagesLength then lnkNextNavigateUrl = Defaultaspx？N= & imgIndex + End If……
End Sub
HTML 部分代碼
<aspHyperLink runat=server id=lnkPrev Text=< Previous /> | <aspHyperLink runat=server id=lnkNext Text=Next > />
上面代碼比較容易理解當點下一張上一張的鏈接時參數N的值加或者減
最後為了實現比較直觀的效果我們放置一個datalist控件其中顯示圖象文件夾下的所有文件每當浏覽一張新的圖片時則將當前正在浏覽的圖片的名稱以鏈接的形式加亮顯示代碼如下
Sub Page_Load（sender as Object e as EventArgs）
……
dlIndexDataSource = images dlIndexDataBind（）
End Sub
Sub dlIndex_ItemDataBound（sender as Object e as DataListItemEventArgs）
If eItemItemType = ListItemTypeItem OrElse _ eItemItemType = ListItemTypeAlternatingItem then Get the Hyperlink Dim hl as HyperLink = CType（eItemFindControl（lnkPic） HyperLink）
Set the Text and Navigation properties hlText = PathGetFileNameWithoutExtension（_ DataBinderEval（eItemDataItem Name）ToString（）） & _ （ & _ Int（DataBinderEval（eItemDataItem Length） / ） & _ KB） hlNavigateUrl = Defaultaspx？N= & eItemItemIndex End If End Sub
HTML部分代碼
<aspDataList runat=server id=dlIndex OnItemDataBound=dlIndex_ItemDataBound RepeatColumns=> <ItemTemplate> <li><aspHyperLink runat=server id=lnkPic /></li> </ItemTemplate> </aspDataList>
在上面的代碼中在DATALIST的onitemdatabound事件中首先判斷當前觸發的項目是否是列表項listitemtype或者是交替項AlternatingItem如果是的話則動態生成鏈接hl設置hl的值為當前正在浏覽圖象的文件名並且注明了文件的大小設置其鏈接的地址為當前浏覽圖象的地址這樣用戶可以直接點要浏覽的圖片了不一要通過上一張下一張的鏈接來實現
最後給出運行的一個例子（）和全部代碼
<%@ Import Namespace=SystemIO %> <script runat=server language=VB> Sub Page_Load（sender as Object e as EventArgs）
Dim dirInfo as New DirectoryInfo（ServerMapPath（））
Dim images（） as FileInfo = FilterForImages（dirInfoGetFiles（））
Dim imgIndex as Integer =
If Not RequestQueryString（N） is Nothing AndAlso IsNumeric（RequestQueryString（N）） then imgIndex = CInt（RequestQueryString（N））
End If
currentImgTitleText = You are Viewing & _ PathGetFileNameWithoutExtension（images（imgIndex）Name） & _ （ & imgIndex + & of & imagesLength & ） currentImgImageUrl = PathGetFileName（images（imgIndex）Name）
If imgIndex > then lnkPrevNavigateUrl = Defaultaspx？N= & imgIndex End If
If imgIndex < imagesLength then lnkNextNavigateUrl = Defaultaspx？N= & imgIndex + End If
dlIndexDataSource = images dlIndexDataBind（）
End Sub
Function FilterForImages（images（） as FileInfo） as FileInfo（）
Dim newImages as New ArrayList（imagesLength）
Dim i as Integer For i = to imagesLength If PathGetExtension（images（i）Name） = jpg OrElse _ PathGetExtension（images（i）Name） = jpeg OrElse _ PathGetExtension（images（i）Name） = png OrElse _ PathGetExtension（images（i）Name） = gif then newImagesAdd（images（i））
End If Next
Return CType（newImagesToArray（GetType（FileInfo）） FileInfo（））
End Function
Sub dlIndex_ItemDataBound（sender as Object e as DataListItemEventArgs）
If eItemItemType = ListItemTypeItem OrElse eItemItemType = ListItemTypeAlternatingItem then Dim hl as HyperLink = CType（eItemFindControl（lnkPic） HyperLink）
hlText = PathGetFileNameWithoutExtension（DataBinderEval（eItemDataItem Name）ToString（）） & _ （ & Int（DataBinderEval（eItemDataItem Length） / ） & KB） hlNavigateUrl = Defaultaspx？N= & eItemItemIndex End If End Sub </script>
<HTML> <HEAD> <STYLE TYPE=text/css> body { fontfamilyVerdanafontsize medium}ImageTitle { fontweightbold fontsizelarge}index {fontsize small}NavLink { backgroundcolor yellow fontweight bold } </STYLE> </HEAD> <BODY>
<center> <aspLabel runat=server id=currentImgTitle CssClass=ImageTitle /><br /> <aspImage runat=server id=currentImg /> <aspHyperLink runat=server CssClass=NavLink id=lnkPrev Text=< Previous /> | <aspHyperLink runat=server CssClass=NavLink id=lnkNext Text=Next > /> <aspDataList runat=server id=dlIndex OnItemDataBound=dlIndex_ItemDataBound RepeatColumns= CssClass=index> <ItemTemplate> <li><aspHyperLink runat=server id=lnkPic /></li> </ItemTemplate> </aspDataList> </center> </BODY> </HTML>
From:http://tw.wingwit.com/Article/program/net/201311/12022.html
