Java如何实现图片裁剪预览功能
在项目中，我们需要做些类似头像上传，图片裁剪的功能，ok看下面文章！
需要插件：jQuery Jcrop
后端代码：
package org.csg.upload;
import java.awt.Rectangle;
import java.awt.image.BufferedImage;
import java.io.File;
import java.io.FileInputStream;
import java.io.IOException;
import java.util.Iterator;
import javax.imageio.ImageIO;
import javax.imageio.ImageReadParam;
import javax.imageio.ImageReader;
import javax.imageio.stream.ImageInputStream;
public class Upload {
/**
* @author 小夜的传说
* @param path1 图片原路径
* @param path2 裁剪后存储的路径
* @param x x轴
* @param y y轴
* @param w
* @param h
*/
public static void CutImage(String path1,String path2,int x,int y,int w,int h){
FileInputStream fileInputStream=null;
ImageInputStream iis=null;
try {
//读取图片文件，建立文件输入流
fileInputStream=new FileInputStream(path1);
//创建图片的文件流 迭代器
Iterator<ImageReader> it = ImageIO.getImageReadersByFormatName("jpg");
ImageReader reader=it.next();
//获取图片流 建立文图 文件流
iis=ImageIO.createImageInputStream(fileInputStream);
//获取图片默认参数
reader.setInput(iis, true);
ImageReadParam param=reader.getDefaultReadParam();
//定义裁剪区域
Rectangle rect=new Rectangle(x,y,w,h);
param.setSourceRegion(rect);
BufferedImage bi=reader.read(0,param);
ImageIO.write(bi, "jpg", new File(path2));
} catch (Exception e) {
e.printStackTrace();
System.out.println("裁剪失败");
}finally{
try {
if(fileInputStream!=null){
fileInputStream.close();
}
if(iis!=null){
iis.close();
}
} catch (IOException e) {
e.printStackTrace();
}
}
}
}
访问代码：
<%@ page language="java" import="java.util.*,org.csg.upload.*" pageEncoding="utf-8"%>
<%
//图片的相对路径
String imagPath=request.getParameter("imgPath");
String relPath=request.getRealPath("/");//获取图片服务器绝对地址
String newFileName=new Date().getTime()+".jpg";
//实际图片路径
String path1=relPath+imagPath;
//裁剪后存储到服务器的图片路径
String path2=relPath+"/images/"+newFileName;
int x=Integer.parseInt(request.getParameter("x"));
int y=Integer.parseInt(request.getParameter("y"));
int w=Integer.parseInt(request.getParameter("w"));
int h=Integer.parseInt(request.getParameter("h"));
try{
Upload.CutImage(path1, path2, x, y, w, h);
out.print("<img src='images/"+newFileName+"'/>");
}catch(Exception e){
e.printStackTrace();
out.print("图片裁剪失败");
}
%>
jsp代码：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Jsp开发头像裁剪</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<link rel="stylesheet" href="css/jquery.Jcrop.css" type="text/css" />
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript" src="js/jquery.Jcrop.min.js"></script>
<style type="text/css">
*{margin: 0;padding: 0;}
.cut{
margin-top: 20px;
}
#preview-pane {
display: block;
position: absolute;
z-index: 2000;
top: 10px;
right: -280px;
padding: 6px;
border: 1px rgba(0,0,0,.4) solid;
background-color: white;
-webkit-border-radius: 6px;
-moz-border-radius: 6px;
border-radius: 6px;
-webkit-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
-moz-box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
box-shadow: 1px 1px 5px 2px rgba(0, 0, 0, 0.2);
}
#preview-pane .preview-container {
width: 250px;
height: 170px;
overflow: hidden;
}
</style>
<script type="text/javascript">
$(function(){
var jcrop_api,
boundx="",
boundy="",
$preview = $('#preview-pane'),
$pcnt = $('#preview-pane .preview-container'),
$pimg = $('#preview-pane .preview-container img'),
xsize = $pcnt.width(),
ysize = $pcnt.height();
$('#cutImage').Jcrop({
onChange:showCoords,//获取选中的值
onSelect:showCoords,//获取拖拽的值
aspectRatio: xsize / ysize
},function(){
var bounds = this.getBounds();
boundx = bounds[0];
boundy = bounds[1];
jcrop_api = this;
$preview.appendTo(jcrop_api.ui.holder);
});
function showCoords(c){
var x=c.x;
var y=c.y;
var w=c.w;
var h=c.h;
$("#x1").val(parseInt(x));
$("#y1").val(parseInt(y));
$("#w").val(parseInt(w));
$("#h").val(parseInt(h));
if (parseInt(c.w) > 0){
var rx = xsize / c.w;
var ry = ysize / c.h;
$pimg.css({
width: Math.round(rx * boundx) + 'px',
height: Math.round(ry * boundy) + 'px',
marginLeft: '-' + Math.round(rx * c.x) + 'px',
marginTop: '-' + Math.round(ry * c.y) + 'px'
});
}
}
});
</script>
</head>
<body>
<h1>Java开发QQ头像裁剪系统</h1>
<div class="cut">
<img id="cutImage" alt="" src="images/1.jpg" >
<div id="preview-pane">
<div class="preview-container">
<img src="images/1.jpg" class="jcrop-preview" alt="Preview" />
</div>
</div>
</div>
<form action="success.jsp" method="post" >
<input type="text" value="images/1.jpg" name="imgPath">
x轴:<input type="text" size="4" id="x1" name="x" />
y轴:<input type="text" size="4" id="y1" name="y"/>
宽度:<input type="text" size="4" id="w" name="w"/>
高度:<input type="text" size="4" id="h" name="h"/>
<input type="submit" value="裁剪"/>
</form>
</body>
</html>
效果图：
以上就是本文的全部内容，希望大家能够喜欢。
相关推荐
-
Java实现图片上传到服务器并把上传的图片读取出来
在很多的网站都可以实现上传头像,可以选择自己喜欢的图片做头像,从本地上传,下次登录时可以直接显示出已经上传的头像,那么这个是如何实现的呢? 下面说一下我的实现过程(只是个人实现思路,实际网站怎么实现的不太清楚) 实现的思路: 工具:MySQL,eclipse 首先,在MySQL中创建了两个表,一个t_user表,用来存放用户名,密码等个人信息, 一个t_touxiang表,用来存放上传的图片在服务器中的存放路径,以及图片名字和用户ID, T_touxiang表中的用户ID对应了t_user中的i
-
Java实现图片与Base64编码互转
淘宝里面的html用base64转换图片,不知道为什么,不过看起来好像很美好,话不多说,直接上代码: import java.io.FileInputStream; import java.io.FileOutputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream; import sun.misc.BASE64Decoder; import sun.misc.BA
-
java实现文件上传下载和图片压缩代码示例
分享一个在项目中用的到文件上传下载和对图片的压缩,直接从项目中扒出来的:) 复制代码 代码如下: package com.eabax.plugin.yundada.utils; import java.awt.image.BufferedImage; import java.io.File; import java.io.IOException; import java.text.SimpleDateFormat; import java.util.Date; import java.util.
-
详解Java中使用ImageIO类对图片进行压缩的方法
最近做项目需要图片压缩处理,网上找的方法大都使用了 com.sun.image.codec.jpeg.* 这个包中的JPEGImageEncoder类,引入这个包后一直报错,各种google百度,尝试了各种方法,包括手动引jre中的rt.jar,以及在eclipse中把受访问限制的API提示从ERROR改为WARNING,等等,然而这些都是不好使的,因为后来我发现我的java-7-openjdk-amd64中的rt.jar里边根本就没有com.sun.image.*,貌似这个类在java7中已经
-
使用Java代码在Android中实现图片裁剪功能
前言 Android应用中经常会遇到上传相册图片的需求,这里记录一下如何进行相册图片的选取和裁剪. 相册选取图片 1. 激活相册或是文件管理器,来获取相片,代码如下: private static final int TAKE_PICTURE_FROM_ALBUM = 1; private void takePictureFromAlbum() { Intent intent = new Intent(Intent.ACTION_GET_CONTENT); intent.setType("ima
-
JavaWeb实现裁剪图片上传完整代码
本文实例为大家分享了JavaWeb实现裁剪图片上传完整案例,供大家参考,具体内容如下 实现思路 •使用jcrop插件手机要裁剪图片的坐标 •将收集到的参数传递到后台,在后台使用java图形对象绘制图像进行裁剪 ◦后台处理流程: 1.将上传的图片按按照比例进行压缩后上传到文件服务器,并且将压缩后的图片保存在本地临时目录中. 2.将压缩后的图片回显到页面,使用jcrop进行裁剪,手机裁剪坐标(x,y,width,height) ■@paramx 目标切片起点坐标X ■@param y 目标切片起点
-
java实现的图片裁剪功能示例
本文实例讲述了java实现的图片裁剪功能.分享给大家供大家参考,具体如下: PicCut.java: package Tsets; import java.awt.Rectangle; import java.awt.image.BufferedImage; import java.io.File; import java.io.FileInputStream; import java.io.IOException; import java.util.Iterator; import javax
-
java裁剪图片并保存的示例分享
我们将通过以下步骤来学习: 输入图像,指定要处理的图像路径允许用户拖放要剪裁的部分选择后使用 Robot 类来确定剪裁部分的坐标剪裁所选图像并保持接下来我们开始编码部分. Listing1: 引入的类 复制代码 代码如下: import java.awt.Graphics; import java.awt.Rectangle; import java.awt.Robot; import java.awt.event.MouseEvent; import java.awt.event.Mo
-
Java图片裁剪和生成缩略图的实例方法
一.缩略图 在浏览相册的时候,可能需要生成相应的缩略图. 直接上代码: public class ImageUtil { private Logger log = LoggerFactory.getLogger(getClass()); private static String DEFAULT_PREVFIX = "thumb_"; private static Boolean DEFAULT_FORCE = false;//建议该值为false /** * <p>Tit
-
jquery.Jcrop结合JAVA后台实现图片裁剪上传实例
本文介绍了头像裁剪上传功能,用到的技术有 jQuery,springmvc,裁剪插件用的是jcrop(中间遇到很多坑,最终跨越). 图片上传步骤: 1.用户选择图片 2.将图片传入后台:用户选择图片的时候选择的是各种各样的,但是我们的网页显示图片大小是有限的,所以我们就要在用户选择图片之后将图片添加到后台进行压缩,压缩成我们想要的大小,之后再显示到页面才好 3.利用jcrop裁剪工具对图片进行裁剪并且实时预览 4.点击确定按钮将裁剪用到的参数传入后台,后台图片进行剪切,之后缩放成我们需要的格式