登录
2 实现照片显示和自定义分页
在基于PWS的站点中，有多处都涉及照片显示的内容。例如，根目录下的Details.aspx、Photos.aspx、Albums.aspx，Admin文件夹内的Details.aspx、Photos.aspx、Albums.aspx等等。无论它们显示照片或者相册缩略图，还是显示实际照片内容，都使用了几乎相同的实现方式，即利用从数据库获取的PhotoID（照片编号）或者AlbumID（相册编号），通过Handler.ashx文件来实现照片缩略图显示。本文以根目录下的Details.aspx文件应用为例，重点说明Handler.ashx的实现方法。同时，还简单涉及FormView控件自定义分页的实现方法。
Details.aspx页面主要用于显示相册内照片的大缩略图。同时，为了方便用户使用，该页面还提供了照片导航功能。如下图2显示了该页面应用效果图。
 |
| 图2(点击看大图) |
如图2所示，Details.aspx页面主要实现了两个功能：一是显示照片的大缩略图；二是提供分页导航功能按钮。实现这两个功能主要涉及3个关键点：（1）利用ObjectDataSource控件获取数据源数据，例如，照片标题文字、照片编号等；（2）使用HTTP处理程序文件显示存储在数据库中的二进制照片数据；（3）使用FormView作为显示容器，在显示数据（照片标题文字和编号）的同时，实现分页导航功能。本节重点介绍关键点（2）和（3）的具体实现过程。
在Details.aspx页面声明的FormView控件的ItemTemplate属性标记中，包括如下与显示照片有关的代码设置。
| <img src="Handler.ashx?PhotoID=<%# Eval("PhotoID") %>&Size=L" class="photo_198" style="border: 4px solid white" alt='照片编号 <%# Eval("PhotoID") %>' /> |
以上代码声明了一个用于显示图片的Image控件，其中设置图片来源的src属性值并不是常见的图片地址，而是Handler.ashx、QueryString参数PhotoID（绑定PhotoID字段）和Size=L组成的URL地址。这表明图片显示将以PhotoID和Size值为输入参数，由Handler.ashx文件来实现。如下列举了Handler.ashx文件源代码。
| <%@ WebHandler Language="C#" Class="Handler" %> using System; using System.IO; using System.Web; // Handler类实现IHttpHandler接口 public class Handler : IHttpHandler { // 实现接口成员IsReusable属性 public bool IsReusable { get {return true;} } // 实现接口成员ProcessRequest public void ProcessRequest(HttpContext context) { // 设置响应设置 context.Response.ContentType = "image/jpeg"; context.Response.Cache.SetCacheability(HttpCacheability.Public); context.Response.BufferOutput = false; // 设置Size参数 PhotoSize size; switch (context.Request.QueryString["Size"]) { case "S": size = PhotoSize.Small; break; case "M": size = PhotoSize.Medium; break; case "L": size = PhotoSize.Large; break; default: size = PhotoSize.Original; break; } // 设置PhotoID参数 Int32 id = -1; Stream stream = null; if (context.Request.QueryString["PhotoID"] != null && context.Request.QueryString["PhotoID"] != "") { id = Convert.ToInt32(context.Request.QueryString["PhotoID"]); stream = PhotoManager.GetPhoto(id, size); } else { id = Convert.ToInt32(context.Request.QueryString["AlbumID"]); stream = PhotoManager.GetFirstPhoto(id, size); } // 从数据库获取照片，如果未返回照片，将获取默认的"placeholder"照片 if (stream == null) stream = PhotoManager.GetPhoto(size); // 将图像流写入响应流中 const int buffersize = 1024 * 16; byte[] buffer = new byte[buffersize]; int count = stream.Read(buffer, 0, buffersize); while (count > 0) { context.Response.OutputStream.Write(buffer, 0, count); count = stream.Read(buffer, 0, buffersize); } } } |
以上列举了Handler.ashx文件源代码。*.ashx文件用于创建自定义HTTP处理程序，常用于生成动态图片和动态文本的实现过程。如上代码所示，Handler类实现了IHttpHandler接口，这表示此次创建的是一个自定义同步HTTP处理程序，其中具体实现了IHttpHanlder接口声明的IsReusable属性和ProcessRequest方法。IsReusable属性用于获取一个值，该值指示其他请求是否可以使用IHttpHandler实例。ProcessRequest方法用于实现具体的自定义HTTP处理请求过程。在本例的ProcessRequest方法实现过程中，首先，初始化响应设置，然后，设置Size和PhotoID参数，最后，根据参数获取并显示照片。从数据库获取数据的过程调用了PhotoManager类的GetPhoto (int photoid, PhotoSize size)方法。该方法的实现过程比较简单，主要是一些数据库方法代码，在此就不作说明了。
另外，在Details.aspx页面中还包括以下实现自定义分页的代码。
| <asp:ImageButton ID="ImageButton9" runat="server" CommandName="Page" CommandArgument="First" SkinID="first" /> <asp:ImageButton ID="ImageButton10" runat="server" CommandName="Page" CommandArgument="Prev" SkinID="prev" /> <asp:ImageButton ID="ImageButton11" runat="server" CommandName="Page" CommandArgument="Next" SkinID="next" /> <asp:ImageButton ID="ImageButton12" runat="server" CommandName="Page" CommandArgument="Last" SkinID="last" /> |
以上包括4个ImageButton控件设置代码，它们用于实现FormView控件的自定义分页导航功能。实现的关键在于，为每一个ImageButton控件设置CommandName属性值为Page的同时，将CommandArgument属性值设置为First（第一页）、Prev（上一页）、Next（下一页）和Last（最后一页）。
3. 小结
在很多应用程序中都包括了照片存储，显示和分页功能。然而，功能虽然都能够实现，但是实现方法和技巧上还是存在一些细小的差异。本文介绍的PWS中的照片存储就有很多可取之处。
至此，笔者已经通过六篇文章相信讲解了PWS案例的实现要点。希望这个系列文章能够帮助读者快速掌握PWS案例，从而加深对于ASP.NET 2.0技术的理解。
| 第1页：实现批量上载图片 | 第2页：实现上载单个照片 |
| 第3页：实现照片列表管理 | 第4页：实现照片显示和自定义分页 |
