我想实现在web page里用mouse签名,后把这张签名图保存到DB, 搜过一些解决方案,代码给得好散, 我就来实现一个完整的, 还可以扩展, 代码如下:
Action Script:
var photow=100;//绘图区宽度
var photoh=100;//绘图区高
//photoPreview3._width=photow;
//photoPreview3._height=photoh;
//photow = new Number(150);
//photoh = new Number(150);
//var bitmap:ByteArray=new ByteArray();//记录当前绘图
var bitmap:Array=new Array();//记录当前绘图
for(i=0;i<photoh*photow;i++)
{
bitmap[i]=255;
}
_root.onMouseDown = function()
{
_root.lineStyle(2, 0xFF0000, 100);
_root.moveTo(_root._xmouse, _root._ymouse);
isDrawing = true;
};
_root.onMouseMove = function()
{
if (isDrawing == true)
{
_root.lineTo(_root._xmouse, _root._ymouse);
updateAfterEvent();
}
};
_root.onMouseUp = function()
{
isDrawing = false;
};
Clear_btn.onRelease = function()
{
_root.clear();
//photoPreview3.clear();
};
//该对象用于实现发送数据到网页可get或post
var lv:LoadVars;
lv = new LoadVars();
Preview_btn.onRelease = function()
{
//新建一个bitmapdate对象并获取video上的图像信息
lv.bm = new flash.display.BitmapData(photow, photoh,true, 0);
lv.bm.draw(_root);
//lv.bm.draw(photoPreview3);
//photoPreview是在场景中的一个Movie clip实例,用于输出bitmapdate实现照片预缆
photoPreview2.attachBitmap(lv.bm, 1);
photoPreview2._width=photow;
photoPreview2._height=photoh;
trace(lv.bm.height);
trace(lv.bm.width);
//getURL("http://www.macromedia.com", "_blank", "GET");
};
Save_btn.onRelease = function()
{
savePic();
//getURL("http://localhost/CaptureAndSignatureWebApp/pageb.aspx", "_blank", "GET");
};
function savePic()
{
//loading._visible =true;
//getURL("http://localhost/CaptureAndSignatureWebApp/pageb.aspx?aa=aabb", "_blank", "GET");
//读取图片矩形范围的像素信息,并以字符串的形式连接起来 begin
//i = lv.bm.height;
i = photoh;
trace("i: " + i.toString());
//j = lv.bm.width;
j = photow;
trace("j: " + j.toString());
//trace("a: " + i.toString());
//trace("b: " + j.toString());
rgb_array = "";
for (var m = i - 1; m >= 0; m--)
//for (y = 10 - 1; y >= 0; y--)
{
trace(rgb_array);
for (var n = 0; n < j; n ++)
//for (x = 0; x < 10; x++)
{
trace("m: " + m.toString());
trace("n: " + n.toString());
color = lv.bm.getPixel(n, m).toString(16);
if(color == "0")
{
color = "FFFFFF";
}
trace(color);
trace(rgb_array);
rgb_array = rgb_array + (color + ",");
} // end of for
//trace(rgb_array);
} // end of for
lv.height = i;
lv.width = j;
lv.rgb_array = rgb_array;
//camera_lbl.text = rgb_array;
getURL("http://localhost/CaptureAndSignatureWebApp/pageC.aspx?passVal=1", "_blank", "POST");
//读取图片矩形范围的像素信息,并以字符串的形式连接起来 end
//getURL("javascript:alert('Step_1')");
//发送到要处理的页面URL,可以在页面通过Request.Form["名称"]获取值,如:Request.Form["rgb_array"]
//lv.sendAndLoad("http://localhost/CaptureAndSignatureWebApp/pageb.aspx", lv, "POST");
//当页面返回信息即页面处理完成后,触发的行为
/*
lv.onLoad = function (success)
{
if (success)
{
//跳转到其他页面
getURL("http://localhost/CaptureAndSignatureWebApp/pageb.aspx", "_self");
}
else
{
getURL("javascript:alert('Not Success')");
}
}
*/
}
/*
photoPreview3.onMouseDown = function()
{
photoPreview3.lineStyle(5, 0xFF0000, 100);
photoPreview3.moveTo(photoPreview3._xmouse, photoPreview3._ymouse);
isDrawing = true;
};
photoPreview3.onMouseMove = function()
{
if (isDrawing == true)
{
photoPreview3.lineTo(photoPreview3._xmouse, photoPreview3._ymouse);
updateAfterEvent();
}
};
photoPreview3.onMouseUp = function()
{
isDrawing = false;
};
*/
ASP.NET代码如下
using System;
using System.Data;
using System.Configuration;
using System.Collections;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Web.UI.HtmlControls;
namespace CaptureAndSignatureWebApp
{
public partial class pageC : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//string[] rgbArray = new string[] { Request.Form["rgb_array"] };
//this.DrawImageFromFlashUploader(240, 140, rgbArray).Save("images/1.bmp");
//this.Image1.ImageUrl = "images/1.bmp";
}
protected override void OnPreInit(EventArgs e)
{
base.OnPreInit(e);
string ss = "";
if (Request.Form.Count > 0)
{
//ss = Request.QueryString["passVal"];
ss = Request.Form["rgb_array"];
this.Label1.Text = ss;
string[] rgbArray = ss.Split(new char[] { ',' });
this.DrawImageFromFlashUploader(100, 100, rgbArray).Save(@"E:/Work/ODMS/SCAAS/技术难点/CaptureAndSignatureWebApp/CaptureAndSignatureWebApp/images/1.bmp");
//this.Image1.ImageUrl = @"~E:/Work/ODMS/SCAAS/技术难点/CaptureAndSignatureWebApp/CaptureAndSignatureWebApp/images/1.bmp";
this.IMG1.Src = @"images/1.bmp";
//Response.ContentType = "image/gif";
//MemoryStream str = new MemoryStream();
System.Drawing.Imaging.ImageFormat iFormat = new System.Drawing.Imaging.ImageFormat(new Guid());
//this.DrawImageFromFlashUploader(50, 50, rgbArray).Save(str, System.Drawing.Imaging.ImageFormat.Gif);
//byte[] byteArray = new byte[str.Length];
//int iii = str.Read(byteArray, 0, (int)str.Length);
//Response.BinaryWrite(byteArray);
//Response.Write("aaaaaa");
//Response.End();
//Page.RegisterStartupScript
}
}
public System.Drawing.Bitmap DrawImageFromFlashUploader(int width, int height, string[] rgbArray)
{
System.Drawing.Bitmap bm = new System.Drawing.Bitmap(width, height, System.Drawing.Imaging.PixelFormat.Format32bppRgb);
int pos = 0;
for (int i = bm.Height - 1; i >= 0; i--)
{
for (int j = 0; j < bm.Width; j++)
{
bm.SetPixel(j, i, System.Drawing.Color.FromArgb(int.Parse(rgbArray[pos], System.Globalization.NumberStyles.HexNumber)));
pos++;
}
}
return bm;
}
}
}
我其实想做得更好看的,但我对flash不熟,只能实现个大概, 估计之后要做得更好还是要我来做,挺烦人的