• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

Asp.net实现在线截图(大图截取为小图)

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

 最近看了有些网站实现的在线截图功能比较不错。就是上传一个图片以后,把裁剪成固定大小的图片一般用来做自己的照片。 我这文章就是实现这功能,开发工具是vs2005和两个js类库,dom-drag.js和jquery,使用比较简单,这个两个js类库是恨优秀的,建议大家再看看。 先发一个效果图片看看 这个效果是模拟的,如何上传图片等这些小问题就不说了。那个大图片是已经上传到服务器了。然后有个黑色边框的框长和宽都是100px。我们就是要截取这个大小的图片来作为我们的头像。你可以拖动这个黑框到合适的位置来截取我们想要的图片。在ie7的效果中必须点中边框才能拖到,在火狐中可以点住黑框的任何地方。而且这个黑框我没有做边界限制,就是说他不应该拖出这个大图片的范围。如果拖出了就是报错。 我们需要建立这个两个页面cutImage.aspx和cutImageAjax.aspx cutImage.aspx就是我们看到的效果图了。

添加两个js类库 然后是body中的html标签。这里面的html样式是需要下一番功夫才出来的(aa.gif就是我们测试用的大图) 

然后就是js代码了

然后就是该看cutImageAjax.aspx页面的后台处理了。其实后台裁剪图片是比较简单的。

 protected void Page_Load(object sender, EventArgs e)

 {

   if (!Page.IsPostBack)

  {

    string x = Page.Request.QueryString["offx"].ToString();

    string y = Page.Request.QueryString["offy"].ToString();

     Bitmap bm = new Bitmap(Server.MapPath("pic/aa.gif"));

    Rectangle cloneRect = new Rectangle(int.Parse(x),int.Parse(y) , 100,100);

     PixelFormat format = bm.PixelFormat;

    Bitmap cloneBitmap = bm.Clone(cloneRect, format);

    // ===保存图片===

    cloneBitmap.Save(Server.MapPath("pic/aa1.gif"),ImageFormat.Gif);

   }

 }

 看看吧。关键的裁剪代码就是这样的。但是我这里没有做其他的判断,比如图片的格式等,如果上传其他不同格式图片可能还要做其他处理,这里我就没有说明了,不过道理差不多了。


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
asp.net连接Access的几种方法发布时间:2022-07-10
下一篇:
Asp.net创建伪静态页面发布时间:2022-07-10
热门推荐
热门话题
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap