科技行者

行者学院 转型私董会 科技行者专题报道 网红大战科技行者

知识库

知识库 安全导航

至顶网软件频道基础软件创建基于AJAX技术的Scribble应用程序

创建基于AJAX技术的Scribble应用程序

  • 扫一扫
    分享文章到微信

  • 扫一扫
    关注官方公众号
    至顶头条

ASP.NET Atlas是一套丰富的类库,用于ASP.NET开发AJAX风格的应用程序

作者:朱先忠编译 来源:天极开发 2007年11月4日

关键字:

  • 评论
  • 分享微博
  • 分享邮件
Global.asax

  我们从Global.asax文件开始进行我们的编码过程。

  1. 在"Website"菜单上点击"Add New Item"或按下Ctrl +Shift+A组合键。

  2. 在"Add New Item"对话框中选择"Global Application Class"并且点击ok。你会看到Global.asax文件被自动创建。

  3. 一开始,我们导入System.Drawing命名空间。这只要在上面文件的第一行的后面插入下面一行代码即可:

  <%@ Import Namespace="System.Drawing" %>

  4. 添加下列代码到Session_Start函数。

void Session_Start(object sender, EventArgs e){
 Bitmap bmp = new Bitmap(200, 200);
 using (Graphics g = Graphics.FromImage(bmp))
 {
  g.FillRectangle(new SolidBrush(Color.White),new Rectangle(0, 0, bmp.Width, bmp.Height));
  g.Flush();
 }
 Session["Image"] = bmp;
}

  这部分代码创建一个简单的白色200×200像素的位图,背景全为白色并把它赋给会话变量Image。

  5. Session_End函数应该释放掉存储在会话变量中的图像。

Bitmap bmp = (Bitmap)Session["Image"];
bmp.Dispose();

  6. 从"Website"菜单中选择"Add Reference"。

  7. 在"Add Reference"对话框中选择"System.Drawing"并且点击OK。

  8. 最后,在"Build"菜单下点击"Build Web Site"或按组合键Ctrl+Shift+B来确保没有构建错误。

ScribbleImage.ashx

  这个web处理器用于把存储在会话变量中的图像数据流回客户端。

  1. 在"WebSite"菜单中点击"Add New Item"或按下Ctrl+Shift+A。

  2. 在"Add New Item"对话框中选择"Generic Handler",然后把该处理器的名字设置为ScribbleImage.ashx并且点击OK。

  3. 一个web处理器要使用会话变量,它需要实现接口IRequiresSessionState。这是唯一的标记接口并且没有要重载的方法。如下所示编辑该类的声明:

public class ScribbleImage : IHttpHandler,
System.Web.SessionState.IRequiresSessionState

  4. 接下来,我们把代码添加到ProcessRequest方法。

public void ProcessRequest (HttpContext context){
 context.Response.ContentType = "image/png";
 context.Response.Cache.SetNoStore();
 context.Response.Cache.SetCacheability(HttpCacheability.NoCache);
 context.Response.Cache.SetExpires(DateTime.Now);
 context.Response.Cache.SetValidUntilExpires(false);
 System.Drawing.Bitmap bmp = (System.Drawing.Bitmap)context.Session["Image"];
 lock(bmp)
 {
  using (MemoryStream ms = new MemoryStream())
  {
   bmp.Save(ms, ImageFormat.Png);
   ms.Flush();
   context.Response.BinaryWrite(ms.GetBuffer());
  }
 }
 }
}

  o 第一行设置相应于image/png的响应的ContentType头。这确保浏览器认出该响应是一个png图像而不是普通HTML代码。

  o 紧接着的四行向浏览器指明不应该缓冲这个响应。所有的这四行都是必要的,用于确保该代码是跨浏览器兼容的。我们将在本教程的以后的版本中优化这些代码。

  o 最后,会话变量中的位图被存储到一个内存流中,而该内存流的内容被写到响应中。由于图像是二进制数据,所以这里使用了BinaryWrite函数。

  ScribbleService.asmx

  我们有办法来初始化会话图像并把该图像内容转换成流作为响应。现在,我们需要一些方法来把内容添加到图像本身。我们期望客户调用ScribbleService.asmx web服务以把线段添加到图像上。

  1. 在"WebSite"菜单中点击"Add New Item"或按下Ctrl+Shift+A。

  2. 在"Add New Item"对话框中选择"Web Service",指定名为ScribbleService.asmx并且点击OK。确保未选定"Place Code in a Separate File"。

  3. 通过把下列一行添加到命名空间语句中来导入命名空间System.Drawing:

using System.Drawing;

  4. 接下来,我们需要为绘制点定义一个简单的类。我们不能使用System.Drawing.Point类,因为它是不可以XML串行化的。在后面的内容中,我们将会看到我们怎样使用System.Drawing.Point来代替定制的类。现在我们先在ScribbleService类声明之前添加下面代码:

public class Point{
 public int X;
 public int Y;
};

  5. 最后,我们需要添加一个方法来使用一组给定的点进行绘制。我们把一个web方法Draw添加到我们的web服务。

[WebMethod(EnableSession = true)]
public void Draw(Point[] points){
 Image scribbleImage = (Image)Session["Image"];
 lock(scribbleImage)
 {
  using (Graphics g = Graphics.FromImage(scribbleImage))
  using(Pen p = new Pen(Color.Black, 2))
  {
   if (points.Length > 1)
   {
    int startX = points[0].X;
    int startY = points[0].Y;
    for (long i = 1; i < points.Length; i++)
    {
     g.DrawLine(p, startX, startY,
     points[i].X, points[i].Y);
     startX = points[i].X;
     startY = points[i].Y;
    }
   }
  }
 }
}

  o 属性WebMethod(EnableSession=true)保证会话变量可从web服务中进行存取。

  o 图像被锁定以确保并发存取的安全性。

  o 绘制本身很简单,因为它仅是把在points数组中提供的点连接起来.
    • 评论
    • 分享微博
    • 分享邮件
    邮件订阅

    如果您非常迫切的想了解IT领域最新产品与技术信息,那么订阅至顶网技术邮件将是您的最佳途径之一。

    重磅专题
    往期文章
    最新文章